JSLibsUI

(Difference between revisions)
m
 
Line 1: Line 1:
 +
__TOC__
== JavaScript Libraries Customiser ==
== JavaScript Libraries Customiser ==
Current UI supports downloading libraries from CDNJS. As we are going to support Bower and Npm, this customiser need to be reworked:
Current UI supports downloading libraries from CDNJS. As we are going to support Bower and Npm, this customiser need to be reworked:
Line 174: Line 175:
|                                                                                |
|                                                                                |
+--------------------------------------------------------------------------------+</pre>
+--------------------------------------------------------------------------------+</pre>
 +
== New Web Project ==
 +
In current new HTML5 Application wizard there is a step to add JavaScript Libraries to the newly created project. Let's remove this step completely.

Current revision as of 08:57, 3 September 2014

Contents

JavaScript Libraries Customiser

Current UI supports downloading libraries from CDNJS. As we are going to support Bower and Npm, this customiser need to be reworked:

 +-----------------------------------------------------------------------------------+
 |                                Project Properties                                 |
 |+------------------------+                                                         |
 || * Sources              |  CDNJS Libraries:                                       |
 || * CSS Preprocessors    | +-------------------------------------------+   +------+|
 || * JavaScript Files     | |Library              |  Version  | Latest  |   |Add   ||
 || ==* CDNJS==            | +---------------------+-----------+---------+   +------+|
 ||   * NPM                | | jQuery-mobile       |  1.1.0    | 1.4.0   |   +------+|
 ||   * Bower              | |                     |           |         |   |Remove||
 || * Run                  | |                     |           |         |   +------+|
 || * Codova               | |                     |           |         |           |
 || * JavaScript Testing   | |                     |           |         |           |
 || * License Headers      | |                     |           |         |           |
 || * Formatting           | |                     |           |         |           |
 ||                        | +-------------------------------------------+           |
 ||                        |                   +-------------------------+   +------+|
 ||                        |  Libraries Folder:|js/libs                  |   |Browse||
 ||                        |                   +-------------------------+   +------+|
 |+------------------------+                                                         |
 +-----------------------------------------------------------------------------------+

When user invokes [Add] button. Following dialog will allow to search and download requested javascript library.

+--------------------------------------------------------------------------------+
|                                 CDNS Libraries                                 |
|         +---------------------------------------------------------------------+|
|  Search:|jquery                                                               ||
|         +---------------------------------------------------------------------+|
|                                 Description:                                   |
|  +----------------------------+ +---------------------------------------------+|
|  |jquery                      | |  jQuery is a fast and concise JavaScript    ||
|  |jquery-mobile               | |  Library that simplifies HTML document      ||
|  |                            | |  traversing, event handling, animating,     ||
|  |                            | |  and Ajax interactions for rapid web        ||
|  |                            | |  development. jQuery is designed to change  ||
|  |                            | |  the way that you write JavaScript          ||
|  |                            | |                                             ||
|  |                            | |                                             ||
|  |                            | |                                             ||
|  |                            | |                                             ||
|  |                            | |                                             ||
|  |                            | |                                             ||
|  |                            | |                                             ||
|  |                            | |                                             ||
|  |                            | |                                             ||
|  |                            | +---------------------------------------------+|
|  |                            |           +-----------------------------------+|
|  |                            |  Version: |1.4.3                             V||
|  +----------------------------+           +-----------------------------------+|
|                                                                   +-----------+|
|                                                                   |Add Library||
|                                                                   +-----------+|
+--------------------------------------------------------------------------------+

Bower customiser is very similar.

 +-----------------------------------------------------------------------------------+
 |                                 Project Properties                                |
 |+------------------------+                                                         |
 || * Sources              |  Bower Packages :                                       |
 || * CSS Preprocessors    | +-------------------------------------------+   +------+|
 || * JavaScript Files     | |Library              |  Version  | Latest  |   |Add   ||
 ||   * CDNJS              | +---------------------+-----------+---------+   +------+|
 ||   * NPM                | | jQuery-mobile       |  1.1.0    | 1.4.0   |   +------+|
 || ==* Bower ==           | |                     |           |         |   |Remove||
 || * Run                  | |                     |           |         |   +------+|
 || * Codova               | |                     |           |         |           |
 || * JavaScript Testing   | |                     |           |         |           |
 || * License Headers      | |                     |           |         |           |
 || * Formatting           | |                     |           |         |           |
 ||                        | +-------------------------------------------+           |
 ||                        |             +-------------------------------+   +------+|
 ||                        |  Bower file:|bower.json                     |   |Browse||
 ||                        |             +-------------------------------+   +------+|
 |+------------------------+                                                         |
 +-----------------------------------------------------------------------------------+

Add button will allow to install bower packages using following dialog.

 +--------------------------------------------------------------------------------+
 |                                 Bower Packages                                 |
 |         +---------------------------------------------------------------------+|
 |  Search:|jquery                                                               ||
 |         +---------------------------------------------------------------------+|
 |                                 Description:                                   |
 |  +----------------------------+ +---------------------------------------------+|
 |  |jquery                      | |  jQuery is a fast and concise JavaScript    ||
 |  |jquery-mobile               | |  Library that simplifies HTML document      ||
 |  |                            | |  traversing, event handling, animating,     ||
 |  |                            | |  and Ajax interactions for rapid web        ||
 |  |                            | |  development. jQuery is designed to change  ||
 |  |                            | |  the way that you write JavaScript          ||
 |  |                            | |                                             ||
 |  |                            | |                                             ||
 |  |                            | |                                             ||
 |  |                            | |                                             ||
 |  |                            | |                                             ||
 |  |                            | |                                             ||
 |  |                            | +---------------------------------------------+|
 |  |                            |              +--------------------------------+|
 |  |                            |  Version:    |1.4.3                          V||
 |  |                            |              +--------------------------------+|
 |  |                            |  [ ] Save Dependencies (--save)                |
 |  |                            |  [ ] Save devDependencies (--save-dev)         |
 |  |                            |              +--------------------------------+|
 |  |                            |      Options |                                ||
 |  +----------------------------+              +--------------------------------+|
 |                                                                   +-----------+|
 |                                                                   |Install    ||
 |                                                                   +-----------+|
 +--------------------------------------------------------------------------------+

And similar approach to npm modules:

 +-----------------------------------------------------------------------------------+
|                                  Project Properties                               |
|+------------------------+                                                         |
|| * Sources              |  Node Modules:                                          |
|| * CSS Preprocessors    | +-------------------------------------------+   +------+|
|| * JavaScript Files     | |Library              |  Version  | Latest  |   |Add   ||
||   * CDNJS              | +---------------------+-----------+---------+   +------+|
|| ==* NPM ==             | | jQuery-mobile       |  1.1.0    | 1.4.0   |   +------+|
||   * Bower              | |                     |           |         |   |Remove||
|| * Run                  | |                     |           |         |   +------+|
|| * Codova               | |                     |           |         |           |
|| * JavaScript Testing   | |                     |           |         |           |
|| * License Headers      | |                     |           |         |           |
|| * Formatting           | |                     |           |         |           |
||                        | +-------------------------------------------+           |
||                        |                +----------------------------+   +------+|
||                        |  Package File: |package.json                |   |Browse||
||                        |                +----------------------------+   +------+|
|+------------------------+                                                         |
+-----------------------------------------------------------------------------------+
+--------------------------------------------------------------------------------+
|                                   Node Modules                                 |
|         +---------------------------------------------------------------------+|
|  Search:|jquery                                                               ||
|         +---------------------------------------------------------------------+|
|                                 Description:                                   |
|  +----------------------------+ +---------------------------------------------+|
|  |jquery                      | |  jQuery is a fast and concise JavaScript    ||
|  |jquery-mobile               | |  Library that simplifies HTML document      ||
|  |                            | |  traversing, event handling, animating,     ||
|  |                            | |  and Ajax interactions for rapid web        ||
|  |                            | |  development. jQuery is designed to change  ||
|  |                            | |  the way that you write JavaScript          ||
|  |                            | |                                             ||
|  |                            | |                                             ||
|  |                            | |                                             ||
|  |                            | |                                             ||
|  |                            | |                                             ||
|  |                            | |                                             ||
|  |                            | +---------------------------------------------+|
|  |                            |              +--------------------------------+|
|  |                            |  Version:    |1.4.3                          V||
|  |                            |              +--------------------------------+|
|  |                            |  [ ] Global                                    |
|  |                            |  [ ] Save Dependencies (--save)                |
|  |                            |  [ ] Save devDependencies (--save-dev)         |
|  |                            |              +--------------------------------+|
|  |                            |      Options |                                ||
|  +----------------------------+              +--------------------------------+|
|                                                                   +-----------+|
|                                                                   |Install    ||
|                                                                   +-----------+|
|                                                                                |
+--------------------------------------------------------------------------------+

New Web Project

In current new HTML5 Application wizard there is a step to add JavaScript Libraries to the newly created project. Let's remove this step completely.

Not logged in. Log in, Register

By use of this website, you agree to the NetBeans Policies and Terms of Use. © 2012, Oracle Corporation and/or its affiliates. Sponsored by Oracle logo