Textbox.io’s powerful editing tools and simple user interface let you create great looking HTML anywhere and that can be used on IBM Web Content Manager 8.5.
I have create a new article on the Base22 public wiki, to explains how is possible to customize the styles drop-down menu (css property), and how to read the styles from a WCM component.
For more details check: How to customize styles drop-down menu on Textbox.io
I really hope you find this information useful.
Recently on Base22 we started to evaluate Electron:
Electron is an open source library developed by GitHub for building cross-platform desktop applications with HTML, CSS, and JavaScript. Electron accomplishes this by combining Chromium and Node.js into a single runtime and apps can be packaged for Mac, Windows, and Linux.
Our initial evaluation and findings, covering some key elements we considered important are documented on the next Base22 public wiki page: Electron – Build cross platform desktop apps
I really hope you find this information useful.
Recently on Base22 we started to test Vue:
Vue (pronounced /vju?/, like view) is a progressive framework for building user interfaces. Unlike other monolithic frameworks, Vue is designed from the ground up to be incrementally adoptable. The core library is focused on the view layer only, and is very easy to pick up and integrate with other libraries or existing projects. On the other hand, Vue is also perfectly capable of powering sophisticated Single-Page Applications.
More important, we focused on evaluate Vue on an Enterprise environment, our findings are documented on the next Base22 public wiki page: Vue.js
Note: the article is oriented to provide a none technical overview of Vue.
I really hope you find this information useful.
If you want to learn about JavaScript Design Patterns, I really recommend you to read the next book: Learning JavaScript Design Patterns. A book by Addy Osmani
Design patterns are reusable solutions to commonly occurring problems in software design. They are both exciting and a fascinating topic to explore in any programming language.
One reason for this is that they help us build upon the combined experience of many developers that came before us and ensure we structure our code in an optimized way, meeting the needs of problems we’re attempting to solve.
Design patterns also provide us a common vocabulary to describe solutions. This can be significantly simpler than describing syntax and semantics when we’re attempting to convey a way of structuring a solution in code form to others.
In this book we will explore applying both classical and modern design patterns to the JavaScript programming language.
I really hope you find this information useful.
The next links explain very well how JavaScript’s scoping system works as the related topic known as hoisting.
I really hope you find this information useful.
If you need to find a way to get the list off all the events bound on an element here is a code that you can use.
My example cover event delegation just to show how these events are displayed in the console.
.
jQuery("myelemnt").on({
click: function(){ console.log("click") },
mouseout: function(){ console.log("mouseout") }
});
//test event delegation
jQuery("myelemnt").on("click","a", function(){
console.log("a click");
});
jQuery("myelemnt").on("mouseout","a", function(){
console.log("a mouseout");
});
//for jQuery 1.8 +
var $events = jQuery._data(jQuery("myelemnt")[0], "events" );
//for jQuery 1.7 and below
//var $events = jQuery('myelemnt').data('events');
//validate if the element has an event attached
if(typeof $events != "undefined"){
//iteration to get each one of the handlers
jQuery.each($events, function(i, event){
jQuery.each(event, function(i, handler){
console.log(handler); // write on console the handler
});
});
}
Output example:
Useful links:
I really hope you find this information useful.
My good friend Alex Arriaga has created an excellent post about how to get same results when sorting JavaScript arrays in all browsers, since recently one of our clients reported to us that they were seeing some data in different order depending of the browser used. Without doubt a very interesting case.
I really hope you find this information useful.
In this post I will share a real example of the use of the JavaScript console API beyond the traditional console.log( ) since it has an API that provides a number of methods that make debugging easier.
On Base22 we developed a set of assets, called xWidget Assets or just xWidget.
As an introduction, Base22 xWidget is set of beautiful, flexible, and easy to use templates for formatting the dynamic content that comes out of portal platforms and content management systems. Designed from the ground up to be dynamic, multilingual, and highly configurable directly by authors – xWidget can be deployed in any kind of environment and has been tested for user in IBM WebSphere Portal (versions 5, 6, 7, and 8) and SharePoint (2010, 2013).
In the developing process of the new version of the xWidget we wanted to make the debugging experience more easy and more useful, so, we incorporated the next list of methods that are part of the console API:
The console.error() method takes one or more objects and prints them to the console. This method is similar to console.log() however console.error() will also print a stack trace from where the method was called. The output will also be flagged as an error in the console.
The console.groupCollapsed() method is essentially the same as console.group() except that the group is initially displayed collapsed rather than open in the console.
The console.info() method functions in the same way as console.log() with the exception that log messages are given the info flag. This can be handy as the developer tools console has a feature that allows you to filter log messages using flags.
The console.warn() method will log a message to the console with a warning flag.
Altogether:
Now, all the debug information is more easy to read and at the same time is more easy to identify potential problems thanks to the new way of we display all that info.
Note: In order to support old browsers like IE 7, we added a polyfill in the code to support the use of the console object.
Similar posts:
Reference
I really hope you find this information useful.
“IBM Connections is a social software platform that enables organizations to engage the right people, drive innovation, and deliver results”.
I have created a post on the Base22.com public knowledge wiki of How to remove a tag from a Wiki Page Using jQuery Ajax since I couldn’t find an example on the official IBM Connections 4 documentation.
This post is part of a current “How to” series that I have created, to check the complete list of posts, please check: IBM Connections 4 API How to
I really hope you find this information useful.
In a new project where I´m working I needed a way to “minify” the content of a HTML page in client side, via JavaScript, I mean, all the HTML code inside the tag <body> </body>.
Note: In my particular scenario, all the HTML pages that I want to minify doesn´t have JavaScript code and all css rules are inline.
I came across the next regular expressions that I used in my final code:
// Merge multiple spaces into one space
var string = string.replace(/\s+/g,’ ‘);
// Remove space between tags
var string = string.replace(/>\s+</g,’><‘);
//Remove all kinds of line breaks.
var string = string.replace(/(\r\n|\n|\r)/gm,””)
My final code looks like:
var wikiPageTemplate = wikiPageTemplate.replace(/(\r\n|\n|\r)/gm,"").replace(/\s+/g,' ').replace(/>\s+<');
References:
Hope you find this information useful!!