Sunday, November 2, 2014

AMD global require and relative path from HTML

In my environment there are lot of tests and templates are HTMLs with self-testing functionality. To make them path-agnostic I was using relative MIDs to same folder resources: scripts, templates and CSS.

ModuleFolder

  • MyModule.html
    • require(["./MyModule"],function(MyModule){ new MyModule({},createDivInBody() ).startup(); }
  • test/test.html
    • require(["../MyModule"],function(MyModule){ new MyModule({},createDivInBody() ).startup(); }
  • MyModule.js
    • require(["dojo/text!./MyModule.html","AMD/cssI!./MyModule.css"],function( template, css) {... }
  • MyModule.css
As dojo AMD and perhaps some other AMD implementations disrespect relative path on global require I need  either to work around or make AMD working as expected. By expected I mean not imaginary potential use of absolute path but real life expectation when looking on the code sniplet above.

There are 2 bugs exposed in the code:

  1. The repative path in HTMLs is treated not as module with JS extension assumed but rather abstract resource, so no JS extension added when path converted to URL. What it could be if not a JS and why there is a difference to MID ?
  2. In CSS plugin the relative path is not working either. It is computated relatively to dojo basePath
The bug fix is not an option(see bellow). What could be done?

  1. Shim the require() and rebase relative pathes with regard to existing basePath
  2. Create artificial "currentPage" package and place into require config, replace relative path dots with this package: require({paths:{currentPackage:location.href... }},["currentPackage/MyModule"]
  3. Use absolute package name: require(["lib/MyLib/PackageX/MyModule"
  4. give up on dojo and use another AMD loader
Perhaps someone could give a better suggestion which is quite appreciated.
If there is a solution, please share.

Regards,
suns

PS. Thank  Christophe Jolif's wisdom for this pain: https://bugs.dojotoolkit.org/ticket/14649
PPS. for interested will keep track on my blog.

JSON added to XmlView, a bookmarklet for web service presentation as sortable table

In addition to early promoted XML in XmlView the JSON format support appeared to be an easy effort. The recognition of JSON format and conversion to XML was all needed to make a sortable table presentation for JSON based web services.

It is not as efficient and scalable as XML though. JSON doubles the browser memory consumption, half of which reside in the JS VM; additional parser for JSON consumes extra CPU/time.

Is it possible to make a faster and smaller memory consumption implementation using JSON without XML?

I guess not. XML reside in browser memory and is not a subject for JS limitations which will be in place for JSON. There is no multi-threaded(yet?) template transformation from JSON to HTML. Not to mention there is no way to render directly DOM by template engine besides XSLT.

Potential for the improvement

There is a prototype for virtual scrolling via XSLT. It could be used as a base for rendering just visible part of data delegation the rendering on scroll in real time.

Happy coding!

Sunday, October 26, 2014

What are you after?

It is hard to guess what will happen with soul when the body is gone. There is no straight answer in any religion, at least I have not heard of it. But few guesses could be done based on some cross-religious claims.
All claiming that there is something for the soul, but what is a mystery.
Lets make a mind experiment and imagine what it could be.

It is definitely a stress to leave the body and huge uncertainty on what to do. Soul most likely would act according to its instinct which reflect its "true believes". Whether looking for angels, seeking own prophet or the guide to destination place. And believes will lead to matching destination. Self-estimation or guilt are those instincts which fulfill the expectations and eventually define the fate.
There are few scenarios most popular among believers. Soul of Buddhist will seek for available fetus to become own reincarnation. Others will seek for holy spirit which will guide to paradise of own kind or fear the devil on the way to hell. Atheists will be lost in the choice and could become poltergeist or ghost as not able to choose own way. Perhaps there is a chance that some demon or gang of those will try to catch the lost.

As "smart" homo sapiens I would like to be prepared and select the path which will allow my soul to grow, gain experience and carry some mission in long run. The minimal step is to develop a curiosity with scientific approach on same level of strength as true faith. It is essential to keep the options open in order to preserve the progress. Sticking to same scenario is circling in rounds. The external factors will affect the path and rather following own agenda the stronger entities will be able to manipulate and use the soul. They also will try to keep them circling until reached wanted state or worn out.

Curiosity itself is not a path or agenda. The nearest and a step or two ahead plan would be handy. High-level agenda is declared earlier, how to achieve it?
Only known world is this one and potentially something in the middle. In this world we growing, getting enlightened or reverse. At least the progress here could be achieved for sure. So it would be logical to try to get back. One of declared ways is reincarnation. There are few others but less popular.
The self-improvement could be done on "carma" level. Which is unconscious and not reliable, most likely breakable by other stronger souls. Or on sane level. Which requires previous incarnations memory recall or at least same on soul stage. It has been claimed that most enlightened people could reach the level when previous lives recalled. Hmm, does not seem an easy option...
Are there other ways? Perhaps. There is a popular concept of conversation with dead people. Perhaps it would be the way to speak to yourself also? Seems it will require as gaining of whole xxx skills and ability of identifying yourself on top of it. Such approach would be quite dangerous to expose in modern society as not welcomed by any religion. On opposite the enlightening could be advertised and the help is much expected.

There is an effort associated in achievement of memory recall. As been read at least a decade to reach some approximation to "nirvana". Does it include the incarnations reunion in same consciousness or some more work need to be done? Adding the question to my todo list.

Despite of answers on questions above, the far goals of eternity should be leading to same conclusions as real life goals realized only inside of this world among live people. Be curious, learn and adopt knowledge, seek the path, state the goals and reach them.

XmlView browser button shows XML as a sortable table

XmlView

The one extra module appeared on XmlAspect.org. This is a browser button to make the web services visualization. Along with Web 2.0 methods implemented by client-side cross-browser XSLT rendering it is a great showcase for CSS3 capabilities. The collapsing and sub-branch selection is implemented by pure CSS without any JS.

While JSON fans have been claiming the XML presentation is ugly and not useful, I was happy with its default presentation as a collapsible tree in browser. But most of web services comprise the tabular kind of data. Which is more helpful when shown as a table. The sorting on all columns could help with usability. That is what the tool does: present tabular data as sortable table.

Besides changing the sorting the URL will be adjusted by adding the sorting parameters into hash part. That will allow to share the URL with view parameters set.

As a tool for developer the cross-browser support will rely on audience interest. For now it is tested on current Chrome and FF.

The module is completely open sourced, feel free to use anywhere. Github given a great service where I am happy to use SVN on git repository.

Happy coding!

Saturday, June 7, 2014

CSS3 trigger UI

How to make trigger UI using only CSS?

Once in a while there is a need to have some kind of trigger for checkbox functionality on the plage. Usually it is a regular <input type="checkbox"/> styled with background images like those: .
To use the styling based on background image you would need JS as INPUT itself does not have the ability to override the image on its container level during change event. There are some tricks how to do that properly as you do not want to use JS during page load to make the checkbox UI.
CSS3 gives you ability to implement the trigger UI design without any JS. The magic reside in ::before selector and background: linear-gradient. It is backward-compatible and shows regular checkbox where CSS3 is not available.

input[type='checkbox']{ display: block; width: 100%;margin:0; }
input[type='checkbox']::before
{ content: "OFF";
  display:block; padding: 0 1em 0 60%; color: white; font-weight: bold;
  text-align: "right";
  border: 1px solid black; border-radius: 3px;
  background: #73777b; /* Old browsers */
  background: linear-gradient(to right, #ffffff 0%,#ffffff 49%,#f1f1f1 50%,#73777b 51%,#73777b 100%);
  white-space: nowrap;
}
input[type='checkbox']:checked::before
{ content: "ON";
  padding: 0 60% 0 1em;
  background: #49aa50; /* Old browsers */
  background: linear-gradient(to right,  #49aa50 0%,#49aa50 49%,#f1f1f1 50%,#ffffff 51%,#ffffff 100%); /* W3C */
  white-space: nowrap;
}


Links: gradient-editor
Happy coding!

Sunday, October 20, 2013

RE: How to solve the lack of a real multi-threading in JavaScript?

Recently on LinkedIn post the question was raised. And I was surprised how "respectable" people on JS community are struggling in their insulated "JS" world. While there are many ways to solve the given problem none was even exposed. It seems to be a good opportunity for people with out of the box thinking and bigger knowledge. But to gain the advantage there is a need for willingness to listen from community. Is there any?

On subj:
While JS is single threaded by definition, there are lot of ways to have parallel processing from graphics computation to data conversion. XSLT, SVG & CSS transforms just to name a few. Depend of your needs big chance there is a solution.
@Jeff Schwartz. The JS loading and parsing is multithreaded in Chrome. Running is not. XSLT uses internally multithreaded processing; frames have own threads. And so on. I had 2 alerts on the screen quite a bit when tuned communication in between. Have whole HTML rendered as a string with multithreaded XSLT and than passed to single-threaded DOM rendering. Please do not confuse people if do not know what you are talking about. 
There is no multithreaded JS(Web Workers aside). But there are numerous ways to use multithreading in browser from JS and between JS VMs. 

Friday, September 20, 2013

XHTML5 DTD validation and data-dojo- attributes

 In development, updates will follow. 

While this is guide for dojo templates validation, the concept is applicable to any JS library which leverage of data- HTML5 attribute.

The mistakes in HTM dojo toolkit widget templates could cost quite a pain as browser will try to make a smart guess what it should actually make out of invalid document. As result you could find misbehavior in completely irrelevant location and spend a fortune on finding the original cause.
The solution is simple: add the DTD validation into development process.
If template is made as HTML, the smart enough IDE or online validator will highlight the errors.

The dijit templated widget uses a DIV as template string source which prevent regular DTD check. Fortunately text! AMD pluging gives ability to strip the tag from html body content:
SAMPLE

HTML5 twisted design made DTD validation impossible just for sake of XML hating. Lucky us there is a work around. XML allow to use the XSL and browsers are capable to render data-dojo- attributes out of "dojo-data" namespace before JS and HTML dom is used making the browser to deal with HTML5 syntax and XML parser with DTD validation.

The sample of completely valid XML and HTML5:
SAMPLE.

Dijit template does not accept the XML as template string, so you would need to use the XHtmlBody! loader.
SAMPLE.


References:

www.html5dtd.org - try to cover some subset of HTML5 dtd.