Desktop Demo code : Desktop « GUI Components « JavaScript DHTML






Desktop Demo code

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">

<!-- 
$Id: new_core_test.html,v 1.43 2003/02/04 06:46:09 russcoon Exp $
Copyright (c) 2000-2003 Alex Russell
Licensed under the Academic Free License version 1.1
-->

<html>
<head>
  <title>A complex sample page</title>

  <script language="JavaScript" type="text/javascript">
    // possible config opts, use specially named array "NWconfig"
    var NWconfig = new Array();
    NWconfig["includeTooltips"]=true;
    // NWconfig["isProduction"]=true;
  </script>
  <script language="JavaScript" type="text/javascript" src="winScripts/netWindows.js"></script>
  <script language="JavaScript" type="text/javascript">
    with(__scripts__){
      //widget includes
      require(__config__.widgetPath+"button_widget.js");
      require(__config__.widgetPath+"tool_bar_widget.js");
      require(__config__.widgetPath+"split_pane_widget.js");
      require(__config__.widgetPath+"alert_box_widget.js");
      require(__config__.widgetPath+"window_widget.js");
      require(__config__.widgetPath+"menu_bar_widget.js");
    }

    // __env__.onLoad will be emitted when the page loads, so connect our init function to it
    __sig__.connect(__env__, __env__.onLoad, null, envInit);

    // test named searching
    // __config__.addSearchId("pyCal","pyMail");

    //keystroke handler for outputting theme information, shift-t
    __env__.setKeystroke('t', true, false, false, null, function(){__theme__.outputTheme();});
    
    function envInit(){
      __scripts__.endInitLoads();
      create_console('<<debugging console initialized>>', 0, 0, 'right', 'top', 400, 300, 100);
      var winObj = NW_WIDGET_window_create_load_append(300, 300, 100, 100, 'netWindows news', "on the web, no one knows you're a dog, but they sure as hell know you can't spell", 'news.html');
      winObj.setKeystroke('t', true, false, false, null, function(){stdout('foo');});
    }
   </script>
  <style type="text/css">
    body, div, span, p {
      font-family: helvetica, arial, sans-serif;
      letter-spacing: 1px;  
    }

    .hide {
      visibility: hidden;
    }

    .themeImg {
      position: absolute; 
      left: 0px; 
      padding: 0px;
    }
  </style>

</head>

<body onSelectStart="return false;">

<!-- theme buttons and the like -->
  <img onClick="__theme__.setThemeByName('blue');" src="images/blues_block.gif" width="20" height="20" style="top: 0px;" hspace=0 vspace=0 border="0" align="left" alt="blue theme" class="themeImg">
  <img onclick="__theme__.setThemeByName('green');" src="images/greens_block.gif" width="20" height="20" style="top: 20px;" hspace=0 vspace=0 border="0" align="left" alt="green theme" class="themeImg">
  <img onclick="__theme__.setThemeByName('red');" src="images/reds_block.gif" width="20" height="20" style="top: 40px;" hspace=0 vspace=0 border="0" align="left" alt="red theme" class="themeImg">
  <img onclick="__theme__.setThemeByName('orange');" src="images/oranges_block.gif" width="20" height="20" style="top: 60px;" hspace=0 vspace=0 border="0" align="left" alt="orange theme" class="themeImg">
  <img onclick="__theme__.setThemeByName('yellow');" src="images/yellows_block.gif" width="20" height="20" style="top: 80px;" hspace=0 vspace=0 border="0" align="left" alt="yellow theme" class="themeImg">
  <img onclick="__theme__.setThemeByName('system');" src="images/tans_block.gif" width="20" height="20" style="top: 100px;" hspace=0 vspace=0 border="0" align="left" alt="default theme" class="themeImg">
  <div nwType="button" class="hide" width="100" height="20">
    <div nwProperty="text">News</div>
    <div nwProperty="doOnClick">NW_WIDGET_window_create_load_append(300, 300, 100, 100, 'netWindows news', 'news', 'news.html');</div>
    <div nwProperty="styleList">left: 23px; top: 1px; position:absolute;</div>
  </div>
  <div nwType="button" class="hide" width="100" height="20" tooltip="EXPERIMENTAL: click this button to toggle alpha-selection on or off.">
    <div nwProperty="text">Alpha Focus</div>
    <div nwProperty="doOnClick">if(__env__.alphaFocus){__env__.alphaFocus=false; this.setText('Alpha: Off');}else{__env__.alphaFocus=true; this.setText('Alpha: On');}</div>
    <div nwProperty="styleList">left: 23px; top: 23px; position:absolute;</div>
  </div>

  <!-- the NetWindows logo, bottom right -->
  <div width=205 height=35 style="position: absolute; bottom: 0px; right: 100px; width: 205px; height: 35px; padding: 0px 0px 0px 0px; overflow:hidden;">
    <a href="http://netWindows.org">
    <img src="images/netWindows_bottom_left.gif" border=0 hspace="0" vspace="0">
    </a>
  </div>

  <div width=225 height=20 style="position: absolute; bottom: 0px; right: 283px; width: 260px; height: 25px; padding: 0px 0px 0px 0px; overflow: hidden; filter: Alpha(Opacity=50); z-Index: 1000;"><p style="font: normal normal normal xx-small sans-serif; padding: 5px; left:225px; top:0px; height: 15px;">netWindows.org is &copy; 2000-2001 <a href="mailto:alex@netWindows.org">Alex Russell.</a></p></div>

</body>
</html>


           
       








Related examples in the same category

1.Window system (Desktop) in JavaScript (IE only)