Skip to content

Commit f07a64f

Browse files
SamyPesseSamyPesse
committed
Add base for statusbar
1 parent 557fc08 commit f07a64f

File tree

16 files changed

+148
-12
lines changed

16 files changed

+148
-12
lines changed

‎addons/cb.files.editor/views/file.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,13 @@ define([
8181
'flags': "disabled"
8282
});
8383

84+
// Statusbar
85+
this.editorStatusCommand = new Command({}, {
86+
'title': "Line 1, Column 1",
87+
'type': "label"
88+
});
89+
this.tab.statusbar.add(this.editorStatusCommand);
90+
8491
// Tab menu
8592
this.tab.menu.menuSection([
8693
{
@@ -181,6 +188,7 @@ define([
181188
this.editor.getSession().selection.on('changeCursor', function(){
182189
var cursor = that.editor.getSession().getSelection().getCursor();
183190
that.sync.updateUserCursor(cursor.column, cursor.row);
191+
that.editorStatusCommand.set("title", "Line "+(cursor.row+1)+", Column "+(cursor.column+1));
184192
});
185193

186194
var $doc = this.editor.session.doc;

‎addons/cb.theme.dark/main.js

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,17 @@ define([
3434
}
3535
},
3636

37+
// Statusbar
38+
statusbar: {
39+
'background': bgDarker,
40+
'color': colorDark,
41+
'border-color': "#111",
42+
43+
button: {
44+
'border-color': bgNormal
45+
}
46+
},
47+
3748
// Lateral bar panels
3849
lateralbar: {
3950
'background': bgDark,

‎client/core/app.js

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ define([
1313
'core/files',
1414
'core/commands/toolbar',
1515
'core/commands/menu',
16+
'core/commands/statusbar',
1617
'core/commands/palette',
1718
'core/tabs',
1819
'core/panels',
@@ -24,7 +25,7 @@ define([
2425
'core/search/tags',
2526
'core/search/addons'
2627
], function (hr, url, dialogs, alerts, loading, GridView, templateFile,
27-
box, session, addons, box, files, commands, menu, palette, tabs, panels, operations, localfs, themes) {
28+
box, session, addons, box, files, commands, menu, statusbar, palette, tabs, panels, operations, localfs, themes) {
2829

2930
// Define base application
3031
var Application = hr.Application.extend({
@@ -128,6 +129,10 @@ box, session, addons, box, files, commands, menu, palette, tabs, panels, operati
128129
// Add menu
129130
menu.$el.appendTo(this.$(".cb-menubar"));
130131
menu.render();
132+
133+
// Add statusbar
134+
statusbar.$el.appendTo(this.$(".cb-statusbar"));
135+
statusbar.render();
131136

132137
// Add commands
133138
commands.$el.appendTo(this.$(".cb-commands"));

‎client/core/commands/statusbar.js

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
define([
2+
'hr/utils',
3+
'hr/hr',
4+
'views/commands/statusbar'
5+
], function (_, hr, StatusbarView) {
6+
// Collection for all statusbar commands
7+
var statusbar = new StatusbarView();
8+
9+
// Feedback
10+
statusbar.register("statusbar.sendfeedback", {
11+
title: "Send Feedback",
12+
position: 5,
13+
offline: false,
14+
search: false
15+
}, function() {
16+
window.open("https://github.com/FriendCode/codebox/issues");
17+
});
18+
19+
return statusbar;
20+
});

‎client/core/themes.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -83,6 +83,10 @@ define([
8383
'menubar': ".cb-menubar",
8484
'menubar button': ".cb-menubar .cb-commands-menubar .menu-command-item>.btn",
8585

86+
// statusbar
87+
'statusbar': ".cb-statusbar",
88+
'statusbar button': ".cb-statusbar .cb-commands-menubar .menu-command-item>.btn",
89+
8690
// lateral bar
8791
'lateralbar': ".cb-lateralbar",
8892
'lateralbar commands': ".cb-lateralbar .lateral-commands",

‎client/resources/stylesheets/main.less

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@
1515
@import "ui/alert.less";
1616
@import "ui/loading.less";
1717
@import "ui/menubar.less";
18+
@import "ui/statusbar.less";
1819
@import "ui/lateralbar.less";
1920
@import "ui/operations.less";
2021
@import "ui/body.less";

‎client/resources/stylesheets/ui/body.less

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@
22
.cb-body {
33
position: absolute;
44
top: @codeboxMenubarHeight;
5-
left: @codeboxToolbarWidth;
5+
bottom: @codeboxStatusbarHeight;
6+
left: @codeboxToolbarWidth;
67
right: 0px;
7-
bottom: 0px;
88
z-index: 10;
99
background: @codeboxBodyBackground;
1010
.transition(left @lateralTransitionSpeed);

‎client/resources/stylesheets/ui/lateralbar.less

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
position: absolute;
44
top: @codeboxMenubarHeight;
55
left: 0px;
6-
bottom: 0px;
6+
bottom: @codeboxStatusbarHeight;
77
width: @codeboxToolbarWidth;
88
.transition(width @lateralTransitionSpeed);
99
.user-select(none);

‎client/resources/stylesheets/ui/menubar.less

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
top: 0px;
44
right: 0px;
55
left: 0px;
6-
height: @codeboxMenubarHeight+1;
6+
height: @codeboxMenubarHeight;
77
border-bottom: 1px solid #ccc;
88
z-index: 1000;
99

@@ -17,7 +17,7 @@
1717
margin: 0px 4px;
1818
cursor: default;
1919
position: relative;
20-
height: 26px;
20+
height: @codeboxMenubarHeight - 1;
2121
color: inherit;
2222

2323
& > .btn {

‎client/resources/stylesheets/ui/statusbar.less

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
.cb-statusbar {
2+
position: fixed;
3+
bottom: 0px;
4+
right: 0px;
5+
left: 0px;
6+
height: @codeboxStatusbarHeight;
7+
border-top: 1px solid #ccc;
8+
z-index: 1000;
9+
10+
.cb-commands-menubar {
11+
margin: 0px;
12+
padding: 0px;
13+
list-style: none;
14+
font-size: 13px;
15+
16+
.menu-item {
17+
color: inherit;
18+
margin: 0px 4px;
19+
cursor: default;
20+
position: relative;
21+
height: @codeboxStatusbarHeight - 1;
22+
color: inherit;
23+
float: right;
24+
display: inline-block;
25+
26+
&.menu-item-label {
27+
float: left;
28+
padding: 3px 3px;
29+
}
30+
31+
& > a {
32+
border-radius: 0px;
33+
background: transparent;
34+
padding: 1px 8px;
35+
cursor: default;
36+
color: inherit;
37+
-webkit-font-smoothing: antialiased;
38+
border: 1px solid transparent;
39+
border-top: 0px;
40+
border-bottom: 0px;
41+
display: inline-block;
42+
}
43+
44+
&:hover {
45+
& > a {
46+
background: rgba(0,0,0,0.10);
47+
text-decoration: none;
48+
}
49+
}
50+
51+
&.disabled {
52+
opacity: 0.4;
53+
}
54+
}
55+
}
56+
}

‎client/resources/stylesheets/variables.less

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,10 @@
1111
@codeboxActiveColor2Darker: #27ae60;
1212

1313
/* Menu bar */
14-
@codeboxMenubarHeight: 26px;
14+
@codeboxMenubarHeight: 27px;
15+
16+
/* Status bar */
17+
@codeboxStatusbarHeight: 22px;
1518

1619
/* Commands toolbar */
1720
@codeboxToolbarWidth: 34px;

‎client/resources/templates/main.html

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,9 @@
1212

1313
<!-- Body -->
1414
<div class="cb-body"></div>
15-
<div class="cb-alerts"></div>
15+
16+
<!-- Status bar -->
17+
<div class="cb-statusbar"></div>
1618
</div>
1719
<div class="cb-loading-alert"><div class="cb-loadings-spinner"></div><div class="cb-loading-message"></div></div>
1820
<% } else { %>

‎client/views/commands/menu.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,7 @@ define([
8585

8686
var $li = this.$el;
8787
$li.empty();
88-
$li.attr("class", this.className+" "+this.getFlagsClass());
88+
$li.attr("class", this.className+" "+this.getFlagsClass()+" menu-item-"+itemType);
8989

9090
if (itemType == "action") {
9191
var $a = this.buildAction();

‎client/views/commands/statusbar.js

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
define([
2+
"hr/hr",
3+
"views/commands/manager",
4+
"views/commands/menu"
5+
], function(hr, CommandsView, MenuView) {
6+
var StatusbarView = MenuView.extend({
7+
className: "cb-commands-menubar"
8+
});
9+
10+
return StatusbarView;
11+
});

‎client/views/tabs/base.js

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,9 @@ define([
55
"utils/dragdrop",
66
"utils/keyboard",
77
"utils/contextmenu",
8-
"models/command"
9-
], function(_, $, hr, DragDrop, Keyboard, ContextMenu, Command) {
8+
"models/command",
9+
"collections/commands"
10+
], function(_, $, hr, DragDrop, Keyboard, ContextMenu, Command, Commands) {
1011
// Tab body view
1112
var TabPanelView = hr.View.extend({
1213
className: "component-tab-panel",
@@ -29,6 +30,7 @@ define([
2930
initialize: function() {
3031
TabPanelView.__super__.initialize.apply(this, arguments);
3132
var menu = require("core/commands/menu");
33+
var statusbar = require("core/commands/statusbar");
3234

3335
this.tabs = this.parent;
3436
this.tab = this.options.tab;
@@ -41,15 +43,28 @@ define([
4143
});
4244
if (this.tab.manager.options.tabMenu) menu.collection.add(this.menu);
4345

46+
// Create statusbar commands
47+
this.statusbar = new Commands();
48+
this.statusbar.pipe(statusbar.collection);
49+
4450
// Bind tab event
4551
this.listenTo(this.tab.manager, "active", function(tab) {
4652
var state = tab.id == this.tab.id;
4753

4854
this.trigger("tab:state", state);
55+
56+
// Toggle visibility of commands
4957
this.menu.toggleFlag("hidden", !state);
58+
this.statusbar.each(function (command){
59+
command.toggleFlag("hidden", !state);
60+
});
5061
});
5162
this.on("tab:close", function() {
5263
this.menu.destroy();
64+
this.statusbar.each(function (command){
65+
command.destroy();
66+
});
67+
this.statusbar.stopListening();
5368
}, this);
5469

5570
// Keyboard shortcuts

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
"event-stream": "3.0.11",
1313
"readable-stream": "1.0.2",
1414
"request": "2.27.0",
15-
"hr.js": "git+https://github.com/FriendCode/hr.js.git#ec91c467883c8cb2d068ba9e3766edfff346a40d",
15+
"hr.js": "0.6.3",
1616
"commander": "1.1.1",
1717
"googlediff": "0.1.0",
1818
"eventemitter2": "0.4.13",

0 commit comments

Comments
 (0)