Browse Source

Possibilité d'ajouter un item à la racine de l'arbre

feature/remote-launch
William Petit 3 years ago
parent
commit
3d3a93ab26

+ 1
- 0
css/style.css View File

@@ -272,6 +272,7 @@ html, body {
272 272
 .edit .profile-tree {
273 273
   padding: 0 5px;
274 274
   width: 100%;
275
+  height: 100%;
275 276
 }
276 277
 
277 278
 .edit .profile-tree ul {

+ 13
- 13
src/components/common/app-icon.js View File

@@ -11,7 +11,7 @@ module.exports = React.createClass({
11 11
   mixins: [LazyLoad],
12 12
 
13 13
   getInitialState: function() {
14
-    return { icon: DEFAULT_ICON, currentTheme: '' };
14
+    return { icon: DEFAULT_ICON, iconPath: DEFAULT_ICON, currentTheme: '' };
15 15
   },
16 16
 
17 17
   onInViewport: function() {
@@ -20,16 +20,20 @@ module.exports = React.createClass({
20 20
 
21 21
   updateIconIfInViewport: function() {
22 22
 
23
+    var currentIcon = this.state.icon;
24
+    var newIcon = this.props.icon;
23 25
     var currentTheme = this.state.currentTheme;
24 26
     var newTheme = this.props.theme;
25 27
 
26
-    if( !this.isInViewport() ||  newTheme === currentTheme ) return;
28
+    var shouldUpdate = this.isInViewport() &&
29
+      ( (newTheme && newTheme !== currentTheme) || (newIcon && newIcon !== currentIcon) )
30
+    ;
27 31
 
28
-    this.setState({ icon: LOADING_ICON, currentTheme: newTheme });
32
+    if( !shouldUpdate ) return;
29 33
 
30
-    var desktopEntry = this.props.desktopEntry;
34
+    this.setState({ icon: newIcon, iconPath: LOADING_ICON, currentTheme: newTheme });
31 35
 
32
-    this._findIcon(this.props.icon, newTheme);
36
+    this._findIcon(newIcon, newTheme);
33 37
 
34 38
   },
35 39
 
@@ -39,7 +43,7 @@ module.exports = React.createClass({
39 43
 
40 44
   render: function() {
41 45
 
42
-    var icon = this.state.icon;
46
+    var icon = this.state.iconPath;
43 47
 
44 48
     var style = {
45 49
       backgroundImage: 'url('+icon+')'
@@ -59,12 +63,7 @@ module.exports = React.createClass({
59 63
 
60 64
     Util.DesktopApps.findIcon(iconPath || DEFAULT_ICON, theme)
61 65
       .then(function(iconPath) {
62
-        if( !iconPath || /\.xpm$/.test(iconPath) ) {
63
-          return Util.DesktopApps.findIcon(DEFAULT_ICON, theme);
64
-        }
65
-        return iconPath;
66
-      })
67
-      .then(function(iconPath) {
66
+        if(!iconPath) return DEFAULT_ICON;
68 67
         return Util.System.exists(iconPath)
69 68
           .then(function(exists) {
70 69
             return exists ? iconPath : DEFAULT_ICON;
@@ -72,7 +71,8 @@ module.exports = React.createClass({
72 71
         ;
73 72
       })
74 73
       .then(function(iconPath) {
75
-        self.setState({ icon: iconPath });
74
+        debug('Found icon %s', iconPath);
75
+        self.setState({ iconPath: iconPath });
76 76
       })
77 77
     ;
78 78
 

+ 1
- 0
src/components/edit/item-form.js View File

@@ -1,4 +1,5 @@
1 1
 var React = require('react');
2
+var _ = require('lodash');
2 3
 
3 4
 var ItemForm = React.createClass({
4 5
 

+ 38
- 2
src/components/edit/profile-tree.js View File

@@ -2,6 +2,8 @@ var React = require('react');
2 2
 var connect = require('react-redux').connect;
3 3
 var actions = require('../../store/actions');
4 4
 var TreeItem = require('./tree-item.js');
5
+var DropTarget = require('react-dnd').DropTarget;
6
+var _ = require('lodash');
5 7
 
6 8
 var TreeNode = React.createClass({
7 9
 
@@ -53,7 +55,9 @@ var ProfileTree = React.createClass({
53 55
 
54 56
   render: function() {
55 57
 
56
-    return (
58
+    var connectDropTarget = this.props.connectDropTarget;
59
+
60
+    return connectDropTarget(
57 61
       <div className="profile-tree">
58 62
         {this.renderTreeNode(this.props.profile)}
59 63
       </div>
@@ -93,4 +97,36 @@ function select(state) {
93 97
   };
94 98
 }
95 99
 
96
-module.exports = connect(select)(ProfileTree);
100
+var dropTargetSpec = {
101
+
102
+  drop: function(props, monitor, component) {
103
+    if(!monitor.didDrop()) {
104
+      return props.profile;
105
+    }
106
+  },
107
+
108
+  canDrop: function(props, monitor) {
109
+    var draggedItem = monitor.getItem();
110
+    return !_.isEqual(draggedItem, props.data);
111
+  }
112
+
113
+};
114
+
115
+function dragSourceCollect(connect, monitor) {
116
+  return {
117
+    connectDragSource: connect.dragSource(),
118
+    isDragging: monitor.isDragging()
119
+  };
120
+}
121
+
122
+function dropTargetCollect(connect, monitor) {
123
+  return {
124
+    connectDropTarget: connect.dropTarget(),
125
+    isOver: monitor.isOver(),
126
+    canDrop: monitor.canDrop()
127
+  };
128
+}
129
+
130
+module.exports = connect(select)(
131
+  DropTarget(['ITEM', 'NEW_ITEM'], dropTargetSpec, dropTargetCollect)(ProfileTree)
132
+);

+ 2
- 3
src/components/edit/tree-item.js View File

@@ -10,8 +10,7 @@ var TreeItem = React.createClass({
10 10
     render: function() {
11 11
 
12 12
       var data = this.props.data;
13
-      var appIcon = data.icon ? <AppIcon icon={data.icon} theme={this.props.theme} /> : null;
14
-
13
+    
15 14
       var connectDragSource = this.props.connectDragSource;
16 15
       var connectDropTarget = this.props.connectDropTarget;
17 16
 
@@ -28,7 +27,7 @@ var TreeItem = React.createClass({
28 27
 
29 28
       return connectDropTarget(connectDragSource(
30 29
         <div className={classes} style={style} onClick={this.handleClick}>
31
-          {appIcon}
30
+          <AppIcon icon={data.icon} theme={this.props.theme} />
32 31
           <span className="app-label">{data.label}</span>
33 32
           <button type="button" className="close pull-right" onClick={this.handleRemoveClick}>
34 33
             <span>&times;</span>

+ 2
- 2
src/store/middlewares/logger.js View File

@@ -4,9 +4,9 @@ module.exports = function loggerMiddleware(store) {
4 4
   return function(next) {
5 5
     return function(action) {
6 6
       debug('Action %j', action);
7
-      debug('Store current state %j', store.getState());
7
+      //debug('Store current state %j', store.getState());
8 8
       next(action);
9
-      debug('Store new state %j', store.getState());
9
+      //debug('Store new state %j', store.getState());
10 10
       if(action.error) {
11 11
         console.error(action.error.stack || action.error);
12 12
       }

+ 1
- 1
test/desktop.js View File

@@ -1,4 +1,4 @@
1
-var DesktopApps = require('../js/util/desktop-apps');
1
+var DesktopApps = require('../src/util/desktop-apps');
2 2
 
3 3
 var DesktopSuite = exports.DesktopSuite = {};
4 4
 

Loading…
Cancel
Save