SOURCE CODE: Widget Visual Samplers
VIEW EXAMPLE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Widget Visual Samplers | JavaScript Examples | UIZE JavaScript Framework</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <meta name="keywords" content="widget Uize.Widgets.VisualSampler.Widget"/>
  <meta name="description" content="See the visual samplers for one or more widget classes that implement visual samplers. Use this page to visually browse and discover available widgets."/>
  <link rel="alternate" type="application/rss+xml" title="UIZE JavaScript Framework - Latest News" href="http://www.uize.com/latest-news.rss"/>
  <link rel="stylesheet" href="../css/page.css"/>
  <link rel="stylesheet" href="../css/page.example.css"/>
</head>

<body>

<script type="text/javascript" src="../js/Uize.js"></script>

<h1 class="header">
  <a id="page-homeLink" href="../index.html" title="UIZE JavaScript Framework home"></a>
  <a href="../index.html" class="homeLinkText" title="UIZE JavaScript Framework home">UIZE JavaScript Framework</a>
</h1>

<div class="main">
  <h1 class="document-title">
    <a href="../javascript-examples.html" class="breadcrumb breadcrumbWithArrow">JAVASCRIPT EXAMPLES</a>
    Widget Visual Samplers
    <div class="pageActionsShell">
      <div id="page-actions" class="pageActions"><a href="source-code/widget-visual-samplers.html" class="buttonLink">SOURCE</a></div>
    </div>
  </h1>

  <!-- explanation copy -->

  <div class="explanation">
    <p>This example lets you view all the available widget visual samplers under a specific namespace. Simply select a namespace from the dropdown menu (only namespaces under which there are widget visual samplers will be listed in this menu). Upon selecting a namespace, all the widget visual samplers under that namespace will be generated in the page. From any of the widget visual samplers, you will be able to navigate to the corresponding widget class' reference documentation.</p>
  </div>

  <div id="page-widgetViewer"></div>
</div>

<script type="text/javascript">

Uize.require (
  [
    'UizeSite.Page.Example',
    'UizeSite.ModulesTree',
    'Uize.Url',
    'Uize.Data.PathsTree',
    'Uize.Widgets.WidgetViewer.VisualSamplersViewer.Widget'
  ],
  function () {
    'use strict';

    /*** create the example page widget ***/
      var _page = window.page = UizeSite.Page.Example ();

    /*** add the visual samplers viewer ***/
      var _modulesTree = Uize.copy (UizeSite.ModulesTree ());
      delete _modulesTree.Uize.Build;

      _page.addChild (
        'widgetViewer',
        Uize.Widgets.WidgetViewer.VisualSamplersViewer.Widget,
        {
          modules:Uize.Data.PathsTree.toList (_modulesTree),
          value:Uize.Url.fromParams (location.href).namespace || 'Uize.Widgets',
          built:false
        }
      );

    /*** wire up the page widget ***/
      _page.wireUi ();
  }
);

</script>

</body>
</html>