From aed8e43d9251b34d5dd6e273195d4ddcd646cae3 Mon Sep 17 00:00:00 2001
From: "Steve \"uru\" West" <steven.david.west@gmail.com>
Date: Fri, 11 Sep 2015 15:44:41 +0100
Subject: [PATCH] Adds basic JS to allow the menu structure to be opened and
 closed.

---
 README.md               |  16 ++++++++++++++++
 assets/img/triangle.png | Bin 0 -> 244 bytes
 assets/js/setui.js      |  16 ++++++++++++++++
 assets/triangle3.png    | Bin 0 -> 244 bytes
 classes/Menu.php        |   1 +
 views/setui/leaf.php    |  15 ++++++++++++++-
 6 files changed, 47 insertions(+), 1 deletion(-)
 create mode 100644 assets/img/triangle.png
 create mode 100644 assets/js/setui.js
 create mode 100644 assets/triangle3.png

diff --git a/README.md b/README.md
index 9a2ab32..ceaf3c9 100644
--- a/README.md
+++ b/README.md
@@ -98,7 +98,23 @@ the correct paths then make sure your nested set's tree config has the `title_fi
 setting set to the correct column name. While SetUI does not care what this is it is
 often best to use a URL friendly property, such as one generated with the slug observer.
 
+# JavaScript
+
+The module also includes some basic javascript to allow a slightly nicer user interaction.
+To enable this you will want to symlink the files in `assets` to the appropriate asset
+folders. While you can copy the files, doing so means you will manually have to update
+the assets when the module is updated.
+
+Once the JS is included in the page it will automatically collapse non-active
+branches and allow branches to be opened and closed.
+
+jQuery 1.7 or higher is required. 
+
 # Testing
 
 Currently the module is not unit tested due to the complications of testing FuelPHP
 v1 modules outside of an application.
+
+# Acknowledgements
+
+Triangle icon by <a href="http://www.flaticon.com/authors/elegant-themes" title="Elegant Themes">Elegant Themes</a> from <a href="http://www.flaticon.com" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0">CC BY 3.0</a>
diff --git a/assets/img/triangle.png b/assets/img/triangle.png
new file mode 100644
index 0000000000000000000000000000000000000000..7d0439caf135d7922b86731d0e08bd3427c5b1a2
GIT binary patch
literal 244
zcmeAS@N?(olHy`uVBq!ia0vp^0wB!61|;P_|4#%`yFFbTLoEFFPI}1OWFXL58S7wv
zQBcBBeZn@L2Wol;3auLZ8l)|_^e#*?zPLcdDKn{lTW$QkyVWOz_=UbkS~YaYF_>}B
zHBne3b|8!MK=pqX<NUeBzB(>PyjK3%+PrF2nb*qf9`5IN_UW9yo!;pZ!tlUS;Qiih
z*XBKaAI{}c!cs7+>B~{(hL|g*x=#*sJW1-&{FQ%DuE&Ax(Sm04zsu#zlYQihOmDfQ
s#d+^hnzUofwOo+|KdH&ee|Rr2&P;Z$D}2u*1M~)ir>mdKI;Vst0FGr}tpET3

literal 0
HcmV?d00001

diff --git a/assets/js/setui.js b/assets/js/setui.js
new file mode 100644
index 0000000..e4b666a
--- /dev/null
+++ b/assets/js/setui.js
@@ -0,0 +1,16 @@
+$(document).ready(function(){
+
+    // Hide any children as long as the branch is not active
+    $('.setui-leaf')
+        .not('.setui-active')
+        .find('ul')
+        .hide();
+
+    // Make sure the content can be shown and hidden
+    $('.setui-link').on('click', function(element){
+        element.preventDefault();
+        $('#' + $(this).data('parent'))
+            .find('ul')
+            .slideToggle(200);
+    });
+});
diff --git a/assets/triangle3.png b/assets/triangle3.png
new file mode 100644
index 0000000000000000000000000000000000000000..7d0439caf135d7922b86731d0e08bd3427c5b1a2
GIT binary patch
literal 244
zcmeAS@N?(olHy`uVBq!ia0vp^0wB!61|;P_|4#%`yFFbTLoEFFPI}1OWFXL58S7wv
zQBcBBeZn@L2Wol;3auLZ8l)|_^e#*?zPLcdDKn{lTW$QkyVWOz_=UbkS~YaYF_>}B
zHBne3b|8!MK=pqX<NUeBzB(>PyjK3%+PrF2nb*qf9`5IN_UW9yo!;pZ!tlUS;Qiih
z*XBKaAI{}c!cs7+>B~{(hL|g*x=#*sJW1-&{FQ%DuE&Ax(Sm04zsu#zlYQihOmDfQ
s#d+^hnzUofwOo+|KdH&ee|Rr2&P;Z$D}2u*1M~)ir>mdKI;Vst0FGr}tpET3

literal 0
HcmV?d00001

diff --git a/classes/Menu.php b/classes/Menu.php
index d314495..3e23a8f 100644
--- a/classes/Menu.php
+++ b/classes/Menu.php
@@ -123,6 +123,7 @@ protected function buildBranch(Model_Nestedset $node)
 				'name' => $node->{$nameProperty},
 				'branches' => $branchView,
 				'active' => $active,
+				'node' => $node,
 			]
 		);
 	}
diff --git a/views/setui/leaf.php b/views/setui/leaf.php
index e157749..6b01fec 100644
--- a/views/setui/leaf.php
+++ b/views/setui/leaf.php
@@ -1,4 +1,17 @@
-<li class="<?php echo ($active) ? 'active' : ''; ?>">
+<li class="setui-leaf <?php echo ($active) ? 'setui-active setui-open' : ''; ?>"
+	id="setui_<?php echo $node->tree_id.'_'.$node->id; ?>"
+	>
+
 	<a href="<?php echo $url; ?>"><?php echo $name; ?></a>
+
+	<?php if (!empty($branches))
+	{
+		echo Asset::img('triangle.png', [
+			'class' => 'setui-link',
+			'data-parent' => 'setui_' . $node->tree_id . '_' . $node->id
+		]);
+	}
+	?>
+
 	<?php echo $branches; ?>
 </li>