| 1 | <!doctype html public "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
---|
| 2 | <html>
|
---|
| 3 |
|
---|
| 4 | <head>
|
---|
| 5 | <title>Yahoo! UI Library - Tree Control</title>
|
---|
| 6 | <link rel="stylesheet" type="text/css" href="yui/css/screen.css">
|
---|
| 7 | </head>
|
---|
| 8 |
|
---|
| 9 | <body onload="treeInit()">
|
---|
| 10 |
|
---|
| 11 | <link rel="stylesheet" type="text/css" href="yui/css/folders/tree.css">
|
---|
| 12 |
|
---|
| 13 | <div id="pageTitle">
|
---|
| 14 | <h3>Tree Control</h3>
|
---|
| 15 | </div>
|
---|
| 16 |
|
---|
| 17 | <script type="text/javascript" src="js/yahoo/yahoo.js" ></script>
|
---|
| 18 |
|
---|
| 19 | <!-- The following are required for the logger -->
|
---|
| 20 | <script type="text/javascript" src="js/event/event.js"></script>
|
---|
| 21 | <script type="text/javascript" src="js/dom/dom.js"></script>
|
---|
| 22 | <script type="text/javascript" src="js/logger/logger.js"></script>
|
---|
| 23 | <!-- End logger reqs -->
|
---|
| 24 |
|
---|
| 25 | <script type="text/javascript" src="js/treeview/treeview.js" ></script>
|
---|
| 26 |
|
---|
| 27 | <div id="content">
|
---|
| 28 | <form name="form_tree" method="post" action="<!--{$smarty.server.PHP_SELF}-->">
|
---|
| 29 | <input type="hidden" name="now_date" value="">
|
---|
| 30 | <div class="newsItem">
|
---|
| 31 | <h3>Folders</h3>
|
---|
| 32 | <p></p>
|
---|
| 33 | <div id="expandcontractdiv">
|
---|
| 34 | <a href="javascript:tree.expandAll()">Expand all</a>
|
---|
| 35 | <a href="javascript:tree.collapseAll()">Collapse all</a>
|
---|
| 36 | </div>
|
---|
| 37 | <div id="treeDiv0"></div>
|
---|
| 38 | <div id="treeDiv1"></div>
|
---|
| 39 | <div id="treeDiv2"></div>
|
---|
| 40 | <div id="treeDiv3"></div>
|
---|
| 41 | <div id="treeDiv4"></div>
|
---|
| 42 | </div>
|
---|
| 43 | </form>
|
---|
| 44 | </div>
|
---|
| 45 |
|
---|
| 46 | <div id="footerContainer">
|
---|
| 47 | <div id="footer">
|
---|
| 48 | <p> </p>
|
---|
| 49 | </div>
|
---|
| 50 | </div>
|
---|
| 51 |
|
---|
| 52 |
|
---|
| 53 | <script type="text/javascript">
|
---|
| 54 |
|
---|
| 55 | var tree;
|
---|
| 56 | var nodes = new Array();
|
---|
| 57 | var nodeIndex;
|
---|
| 58 |
|
---|
| 59 | function treeInit() {
|
---|
| 60 | //buildRandomTextNodeTree();
|
---|
| 61 | }
|
---|
| 62 |
|
---|
| 63 | function buildRandomTextNodeTree() {
|
---|
| 64 | tree = new YAHOO.widget.TreeView("treeDiv1");
|
---|
| 65 |
|
---|
| 66 | for (var i = 0; i < <!--{$tpl_days}-->; i++) {
|
---|
| 67 | var tmpNode = new YAHOO.widget.TextNode("unko-" + i, tree.getRoot(), false);
|
---|
| 68 | buildRandomTextBranch(tmpNode);
|
---|
| 69 | }
|
---|
| 70 |
|
---|
| 71 | tree.draw();
|
---|
| 72 | }
|
---|
| 73 |
|
---|
| 74 | var callback = null;
|
---|
| 75 |
|
---|
| 76 | function buildRandomTextBranch(node) {
|
---|
| 77 |
|
---|
| 78 | if (node.depth < 4) {
|
---|
| 79 | for ( var i = 0; i < Math.floor(0.6 * 4) ; i++ ) {
|
---|
| 80 | var tmpNode = new YAHOO.widget.TextNode(node.label + "-" + i, node, false);
|
---|
| 81 | buildRandomTextBranch(tmpNode);
|
---|
| 82 | }
|
---|
| 83 | }
|
---|
| 84 | }
|
---|
| 85 |
|
---|
| 86 |
|
---|
| 87 | // ツリーデータ
|
---|
| 88 | var data = <!--{$data}-->
|
---|
| 89 |
|
---|
| 90 | //ここから下は触らなくてもOK
|
---|
| 91 | //(namespaceは使わなくても動作します)
|
---|
| 92 | YAHOO.namespace('treefolder');//カスタマイズした関数など用に名前空間を用意しておきます
|
---|
| 93 | YAHOO.treefolder.tree = function(tree,data) {
|
---|
| 94 | this.data = data;
|
---|
| 95 | this.tree = tree;
|
---|
| 96 |
|
---|
| 97 | //Tree描画
|
---|
| 98 | this.mkTree = function (oj,node){
|
---|
| 99 | for(var i in oj){
|
---|
| 100 | if(typeof oj[i] != "number" && i != "_href"){
|
---|
| 101 | if(typeof oj[i]["_index"] == "number"){
|
---|
| 102 | var tmpNode = new YAHOO.widget.TextNode("" + i, node, false, oj[i]["_index"]);
|
---|
| 103 | }else{
|
---|
| 104 | var tmpNode = new YAHOO.widget.TextNode("" + i, node, false);
|
---|
| 105 | }
|
---|
| 106 |
|
---|
| 107 | if(typeof oj[i] == "string")tmpNode.href= oj[i];
|
---|
| 108 | if(typeof oj[i] == "object"){
|
---|
| 109 | if(typeof oj[i]["_href"] == "string")tmpNode.href= oj[i]["_href"];
|
---|
| 110 | if(oj[i]["_open"]==1)tmpNode.expand();
|
---|
| 111 | this.mkTree(oj[i],tmpNode);
|
---|
| 112 | }
|
---|
| 113 | }
|
---|
| 114 | }
|
---|
| 115 | tree.draw();
|
---|
| 116 | }
|
---|
| 117 | }
|
---|
| 118 |
|
---|
| 119 | //初期化
|
---|
| 120 | YAHOO.treefolder.treeIni = function(){
|
---|
| 121 |
|
---|
| 122 | var tree = new YAHOO.widget.TreeView("treeDiv1");//treeDiv1は表示するDIVのID名です
|
---|
| 123 | test1 = new YAHOO.treefolder.tree(tree,data);//ここでTreeデータを渡します
|
---|
| 124 | test1.mkTree(test1.data, tree.getRoot());
|
---|
| 125 | }
|
---|
| 126 |
|
---|
| 127 | //ページ読み込み後にカスタマイズ関数YAHOO.treefolder.treeIni()を起動します
|
---|
| 128 | YAHOO.util.Event.addListener(window, 'load', YAHOO.treefolder.treeIni);
|
---|
| 129 |
|
---|
| 130 | </script>
|
---|
| 131 |
|
---|
| 132 | </body>
|
---|
| 133 | </html>
|
---|
| 134 |
|
---|