You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@allura.apache.org by he...@apache.org on 2015/10/30 17:51:00 UTC

allura git commit: [#7919] Fix toolbar reorder bug that prevented drag/dop from working

Repository: allura
Updated Branches:
  refs/heads/hs/7919 4599f00ea -> 0b884ade7


[#7919] Fix toolbar reorder bug that prevented drag/dop from working


Project: http://git-wip-us.apache.org/repos/asf/allura/repo
Commit: http://git-wip-us.apache.org/repos/asf/allura/commit/0b884ade
Tree: http://git-wip-us.apache.org/repos/asf/allura/tree/0b884ade
Diff: http://git-wip-us.apache.org/repos/asf/allura/diff/0b884ade

Branch: refs/heads/hs/7919
Commit: 0b884ade7e6f7ad69f577564f2f2edf085eece6c
Parents: 4599f00
Author: Heith Seewald <hs...@hsmb.local>
Authored: Fri Oct 30 12:50:53 2015 -0400
Committer: Heith Seewald <hs...@hsmb.local>
Committed: Fri Oct 30 12:50:53 2015 -0400

----------------------------------------------------------------------
 Allura/allura/public/nf/css/navbar.css   | 40 +++++++++++--
 Allura/allura/public/nf/js/navbar.es6.js | 82 +++++++++++++--------------
 2 files changed, 74 insertions(+), 48 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/allura/blob/0b884ade/Allura/allura/public/nf/css/navbar.css
----------------------------------------------------------------------
diff --git a/Allura/allura/public/nf/css/navbar.css b/Allura/allura/public/nf/css/navbar.css
index 15091a7..db2ae4e 100644
--- a/Allura/allura/public/nf/css/navbar.css
+++ b/Allura/allura/public/nf/css/navbar.css
@@ -30,7 +30,6 @@
 }
 
 .draggable-handle, .draggable-handle-sub {
-    float: none;
     margin-left: 2px;
     cursor: move;
 }
@@ -53,6 +52,28 @@
     height: 24px;
 }
 
+.react-reorderable-item-active,
+.draggable-element {
+  /*min-width: 150px;*/
+  /*min-height: 70px;*/
+  /*margin-top: 5px;*/
+}
+.draggable-element {
+    /*opacity: 0.7;*/
+  /*border: 3px solid #444;*/
+  /*border-radius: 3px;*/
+}
+.draggable-handle {
+  /*background-color: grey;*/
+  /*width: 30px;*/
+  /*height: 50px;*/
+  /*float: left;*/
+  cursor: move;
+  /*color: white;*/
+  /*font-size: 60px;*/
+  /*padding: 10px;*/
+}
+
 .react-reorderable-item-active div {
     display: none;
 }
@@ -67,10 +88,10 @@
 }
 
 #top_nav_admin .tb-item a {
-    margin: 10px 10px 10px 0;
-    border-right: 1px solid #ccc;
-    padding-right: 10px;
-    padding-left: 4px;
+    margin: 10px;
+    /*border-right: 1px solid #ccc;*/
+    /*padding-right: 10px;*/
+    /*padding-left: 4px;*/
 }
 
 .react-drag {
@@ -117,7 +138,7 @@
 
 }
 
-#top_nav_admin .tb-sub-menu .tb-item a {
+#top_nav_admin .tb-sub-menu a {
     border-right: none;
     margin: 3px 20px 0 2px;
     padding: 5px;
@@ -333,3 +354,10 @@
     -o-user-select: none;
     user-select: none;
 }
+
+/*.react-drag{*/
+    /*display: block;*/
+    /*max-width: 150px;*/
+    /*float: left;*/
+    /*!*border: 1px solid black;*!*/
+/*}*/
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/allura/blob/0b884ade/Allura/allura/public/nf/js/navbar.es6.js
----------------------------------------------------------------------
diff --git a/Allura/allura/public/nf/js/navbar.es6.js b/Allura/allura/public/nf/js/navbar.es6.js
index 3281b6c..8c4ae96 100644
--- a/Allura/allura/public/nf/js/navbar.es6.js
+++ b/Allura/allura/public/nf/js/navbar.es6.js
@@ -219,7 +219,6 @@ var NormalNavBar = React.createClass({
  */
 var AdminNav = React.createClass({
     propTypes: {
-        isSubmenu: React.PropTypes.bool,
         tools: React.PropTypes.arrayOf(
             React.PropTypes.objectOf(ToolsPropType))
     },
@@ -242,55 +241,56 @@ var AdminNav = React.createClass({
         });
     },
 
-    buildMenu: function (item, isSubMenu=false) {
+    buildMenu: function (items, isSubMenu=false) {
         var _this = this;
         var [tools, anchored_tools, end_tools] = [[], [], []];
-        var subMenu;
-        if (item.children) {
-            subMenu = [];
-            for(let subItem of item.children){
-                subMenu.push(this.buildMenu(subItem, true));
+
+        for (let item of items) {
+            var subMenu;
+            if (item.children) {
+
+                    subMenu.push(this.buildMenu(item.children, true));
             }
-        }
 
-        var _handle = subMenu ? ".draggable-handle-sub" : '.draggable-handle';
-
-        //var classes = subMenu ? 'draggable-element tb-item-grouper' : 'draggable-element';
-        var core_item = <NavBarItem
-            {..._this.props}
-            mount_point={ item.mount_point }
-            name={ item.name }
-            handleType={_handle}
-            url={ item.url }
-            key={ 'tb-item-' + _.uniqueId() }
-            is_anchored={ item.is_anchored || item.mount_point === 'admin'}/>;
-        if (item.mount_point === 'admin') {
-            // force admin to end, just like 'Project.sitemap()' does
-            end_tools.push(core_item);
-        } else if (item.is_anchored) {
-            anchored_tools.push(core_item);
-        } else {
-            tools.push(
-                <div className={" draggable-element " }>
-                    { core_item }
+            var _handle = subMenu ? ".draggable-handle-sub" : '.draggable-handle';
+
+            //var classes = subMenu ? 'draggable-element tb-item-grouper' : 'draggable-element';
+            var core_item = <NavBarItem
+                {..._this.props}
+                mount_point={ item.mount_point }
+                name={ item.name }
+                handleType={_handle}
+                url={ item.url }
+                key={ 'tb-item-' + _.uniqueId() }
+                is_anchored={ item.is_anchored || item.mount_point === 'admin'}/>;
+            if (item.mount_point === 'admin') {
+                // force admin to end, just like 'Project.sitemap()' does
+                end_tools.push(core_item);
+            } else if (item.is_anchored) {
+                anchored_tools.push(core_item);
+            } else {
+                tools.push(
+                    <div className={" draggable-element "}>
+                        { core_item }
 
-                    {subMenu &&
-                    <AdminItemGroup key={'tb-group-' + _.uniqueId()}>
-                        {subMenu}
-                    </AdminItemGroup>
+                        {subMenu &&
+                        <AdminItemGroup key={'tb-group-' + _.uniqueId()}>
+                            {subMenu}
+                        </AdminItemGroup>
 
-                        }
-                </div>
-            );
+                            }
+                    </div>
+                );
+            }
         }
+
         return (
-            <div className='react-drag edit-mode'>
+        <div className='react-drag'>
                 { anchored_tools }
                 <ReactReorderable
                     key={ 'reorder-' + _.uniqueId() }
                     handle={_handle}
                     mode='grid'
-                    onDragStart={ _this.props.onDragStart }
                     onDrop={ _this.props.onToolReorder }
                     onChange={ _this.props.onChange }>
                     { tools }
@@ -301,7 +301,7 @@ var AdminNav = React.createClass({
     },
 
     render: function () {
-        var tools = this.props.tools.map(this.buildMenu);
+        var tools = this.buildMenu(this.props.tools);
         return (
             <div>
                 {tools}
@@ -438,6 +438,7 @@ var Main = React.createClass({
      * @param {array} data - Array of tools
      */
     onToolReorder: function(data) {
+        console.ll
         var tools = this.state.data;
         var params = {
             _session_id: $.cookie('_session_id')
@@ -480,7 +481,6 @@ var Main = React.createClass({
     },
 
     render: function() {
-        var editMode = this.state.visible ? 'edit-mode' : '';
         var _this = this;
         var navBarSwitch = (showAdmin) => {
             if (showAdmin) {
@@ -489,7 +489,6 @@ var Main = React.createClass({
                         tools={ _this.state.data.menu }
                         data={ _this.state.data }
                         onToolReorder={ _this.onToolReorder }
-                        onUpdateMountOrder={ _this.onUpdateMountOrder }
                         editMode={ _this.state.visible } />
                 );
             } else {
@@ -507,8 +506,7 @@ var Main = React.createClass({
 
         return (
             <div
-                ref={ _.uniqueId() }
-                className={ 'nav_admin ' + editMode }>
+                className={ 'nav_admin '}>
                 { navBar }
                 <div id='bar-config'>
                     <GroupingThreshold