jidesoft / jidejs Goto Github PK
View Code? Open in Web Editor NEWModern Javascript and HTML5 based UI control toolkit.
License: MIT License
Modern Javascript and HTML5 based UI control toolkit.
License: MIT License
If the value generated by an Observable.computed (on read) is a Promise, we should notify its listeners only after the Promise has been fulfilled. This will open various possibilities when used in combination with Observable#map, i.e.
var url = Observable('/foo.json');
var json = url.map(function(url) {
return xhrPromise(url);
}).map(function(content) {
return JSON.parse(content);
});
In order to prevent useless updates of the DOM, it would be favorable if jidejs/ui/bind scheduled its updates on the browser render loop (using requestAnimationFrame).
This will require a few changes to Observable.computed to allow manual dependency management in addition to the automatic one (we need to calculate dependencies in an async callback).
The generated jsdoc contains lots of duplications.
Every class is repeated and ever method too, so that every method is documented four times. We need to find a way to prevent that from happening.Perhaps we can use a newer version of jsdoc or we can fix it by modifying the template. Possibly there is something wrong with our jsdoc tags.
One problem with the compatibility for Bower is that we seem to be unable to use external template files if we intend to use the 'is' binding to upgrade an element to a control.
The reason for this is quite simple: We can not require some previously unnamed dependency.
An approach that requires a custom browserify transform forces us to push the dependencies to the exported string and from there to the Template element, to the Skin and finally to jidejs/ui/bind
where we really need it. That solution is not exactly clean and we need to find out if there is a better way.
At the moment, it is not possible to use a "foreach" binding in a template if it iterates over an array (or ObservableList) that is not an object (such as an array of strings or numbers).
This happens because of how we create a new context (by creating a new object whose prototype is the original data). At that point, we need to verify that what we received actually is an object and create one if it isn't.
Example:
<ul bind="
foreach: component.values
">
<template>
<li><span bind="text: $item"></span></li>
</template>
</ul>
The above example doesn't work if the values
property is an Array/ObservableList of Strings.
This issue should be fixed in jidejs/ui/bind.js
createContext
function.
The notify function is only invoked after a new listener is added. We need to add a call to notify when the Promise is fulfilled or rejected, too.
Dispatcher.nextTick(notify.bind(promise));
In line 283 in Skin.js, we verify that the source of the event is the element we're looking for, however, we use the wrong property (sorry!). We should use the "source" property instead.
if(element === event.source) {
would be the correct approach.
It turns out that we're doing it wrong. After some experiments with jsdoc 3.3 (alpha), I was able to find a markup that works (includes inherited members, etc.).
/**
* This event is fired whenever the user invokes the button, usually through a click or tap within
* the bounds of the button. If the Button currently has the focus, it might also be fired through keyboard
* events such as the spacebar or the enter key.
*
* It can be observed by listening to the `action` event of a Control.
*
* @event module:C#action
* @type {object}
* @property {HTMLElement} source - The source of the event
*/
/**
* The base class for all buttons.
* @module C
*/
define(['B'], function(B) {
/**
* Creates a new ButtonBase. Must only be invoked by subclasses.
*
* @constructor
* @alias module:C
* @extends module:B
* @param {object} config The configuration.
* @param {boolean} config.enabled `true`, if the button is enabled; `false`, otherwise.
*/
var exports = function ButtonBase(config) {
installer(this);
config = _.defaults(config || {}, { tabIndex: 0 });
if(!config.skin) config.skin = new ButtonBase.Skin(this, config.element);
Labeled.call(this, config);
this.classList.add('jide-buttonbase');
}
Class(ButtonBase).extends(Labeled).def({
/**
* `true`, if the button is enabled; `false`, otherwise.
*
* A disabled button does not react to user interaction. Set the value of this property to `false` if a
* command is currently not available.
*
* @type boolean
*/
enabled: true,
/**
* `true`, if the button is enabled; `false`, otherwise.
* @type module:A
*/
enabledProperty: null,
command: null, commandProperty: null,
dispose: function() {
Labeled.prototype.dispose.call(this);
installer.dispose(this);
}
});
return ButtonBase;
});
It is extremly important to include the var exports =
part when defining the constructor. If that line is not present, inheritance documentation will not work.
If the value passed to jidejs/base/Util.isElement is not an object but a primitive value (such as a Number or Boolean), it will throw an exception due to the usage of the "in" operator.
We need to make sure that the argument passed to it is not a primitive value before using the "in" operator.
When I use the optimize:website task, the gulp-uglify module seems to be having problems with some of the dependencies (CodeMirror and Faker) where it produces encoding errors for certain regular expressions that use unicode ranges.
I'm not sure where that issue comes from (suspects: Gulp, gulp-uglify, uglify) so that needs some more exploration.
Currently, the API documentation is incomplete. We need to add more details to it, explain the API better and add more code samples.
This task also includes improving the visual appearance of the API doc.
Currently, the Developer Guide is... a mess. We need to restructure it in a way that makes sense.
Suggestion:
The site http://js.jidesoft.com/ referenced on this page doesn't work, are there copies of the documentation anywhere?
Being able to convert a Promise into an Observable is a useful feature. The method should be compatible with common Promise APIs (such as the new browser standard) and our internal, limited, Promise API.
We need to find issues with jide.js performance and try to find things that can be improved and made faster.
For each performance problem that is found, a new issue should be created.
Take a look at our bower.json and exclude similar files from our npm package.
The icon alignment for the Mail demo is totally off in IE11 (and probably older IE versions, too). All icons are displayed at the upper left corner instead of being centered.
We need a new guide/chapter which explains how to use jide.js with Browserify.
It needs to mention deamdify, browserify-jide-template and the different path name when using jide.js with browserify.
With AMD a module name starts with jidejs
, i.e. jidejs/ui/control/Button
, however, with Browserify, its name is jide/ui/control/Button
.
The little critical feedback I have received so far is focused on expecting people to be familiar with AMD/require.js or to read through their documentation. Which means that we currently require previous knowledge of jide.js or interrupt their learning by forwarding them to the require.js/browserify websites.
Thus we should introduce the require
and define
functions as part of the guide as if they were a part of jide.js. The same should be done for Browserify.
When I updated ObservableProperty.install to support settings (no-bubbling, etc), I seem to have forgotten to also update the dispose method.
This means that controls can not be disposed correctly.
Correct version:
installer.dispose = function(instance) {
for(var i = 0, len = names.length; i < len; ++i) {
var nameObj = names[i],
name = nameObj.name;
instance[name+'Property'].dispose();
}
};
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.