helios: workspace buttons

css/helios.css

@@ -76,6 +76,14 @@ i {
     background: transparent url('/images/modified.png') 50% 50% no-repeat;
 }
 
+.buttons_bar {
+    position: absolute;
+    bottom: 8px;
+    right: 20px;
+    z-index: 2;
+    transition: 0.4s all;
+}
+
 .btn, .btn-group > .btn, .btn-group > .dropdown-menu {
     padding: 2px 8px;
 }
@@ -644,7 +652,7 @@ i {
     background: white;
 }
 
-.doc code, .doc pre {
+.doc code .doc pre {
     font-size: 11px;
 }
 

js/Helios-Workspace.deploy.js

@@ -509,21 +509,59 @@ return self}, function($ctx1) {$ctx1.fill(self,"receiver:",{anObject:anObject},s
 messageSends: ["receiver:", "model"]}),
 smalltalk.HLCodeWidget);
 
+smalltalk.addMethod(
+smalltalk.method({
+selector: "renderButtonsOn:",
+fn: function (html){
+var self=this;
+return smalltalk.withContext(function($ctx1) { 
+var $1,$2,$3,$4,$5,$6;
+$1=_st(html)._button();
+_st($1)._class_("button");
+_st($1)._with_("DoIt");
+$2=_st($1)._onClick_((function(){
+return smalltalk.withContext(function($ctx2) {
+return _st(self)._doIt();
+}, function($ctx2) {$ctx2.fillBlock({},$ctx1)})}));
+$3=_st(html)._button();
+_st($3)._class_("button");
+_st($3)._with_("PintIt");
+$4=_st($3)._onClick_((function(){
+return smalltalk.withContext(function($ctx2) {
+return _st(self)._printIt();
+}, function($ctx2) {$ctx2.fillBlock({},$ctx1)})}));
+$5=_st(html)._button();
+_st($5)._class_("button");
+_st($5)._with_("InspectIt");
+$6=_st($5)._onClick_((function(){
+return smalltalk.withContext(function($ctx2) {
+return _st(self)._inspectIt();
+}, function($ctx2) {$ctx2.fillBlock({},$ctx1)})}));
+return self}, function($ctx1) {$ctx1.fill(self,"renderButtonsOn:",{html:html},smalltalk.HLCodeWidget)})},
+messageSends: ["class:", "button", "with:", "onClick:", "doIt", "printIt", "inspectIt"]}),
+smalltalk.HLCodeWidget);
+
 smalltalk.addMethod(
 smalltalk.method({
 selector: "renderContentOn:",
 fn: function (html){
 var self=this;
 return smalltalk.withContext(function($ctx1) { 
-var $1,$2;
+var $1,$2,$3,$4;
 self["@code"]=_st(html)._textarea();
 self["@state"]=_st(_st(html)._div())._class_("state");
-$1=self;
-_st($1)._setEditorOn_(_st(self["@code"])._element());
-_st($1)._configureEditor();
-$2=_st($1)._updateState();
+$1=_st(html)._div();
+_st($1)._class_("buttons_bar");
+$2=_st($1)._with_((function(){
+return smalltalk.withContext(function($ctx2) {
+return _st(self)._renderButtonsOn_(html);
+}, function($ctx2) {$ctx2.fillBlock({},$ctx1)})}));
+$3=self;
+_st($3)._setEditorOn_(_st(self["@code"])._element());
+_st($3)._configureEditor();
+$4=_st($3)._updateState();
 return self}, function($ctx1) {$ctx1.fill(self,"renderContentOn:",{html:html},smalltalk.HLCodeWidget)})},
-messageSends: ["textarea", "class:", "div", "setEditorOn:", "element", "configureEditor", "updateState"]}),
+messageSends: ["textarea", "class:", "div", "with:", "renderButtonsOn:", "setEditorOn:", "element", "configureEditor", "updateState"]}),
 smalltalk.HLCodeWidget);
 
 smalltalk.addMethod(
@@ -1303,6 +1341,25 @@ return self}, function($ctx1) {$ctx1.fill(self,"refresh",{},smalltalk.HLBrowserC
 messageSends: ["ifTrue:", "hasModification", "hasFocus", "contents:", "source", "selectedMethod", "browserModel"]}),
 smalltalk.HLBrowserCodeWidget);
 
+smalltalk.addMethod(
+smalltalk.method({
+selector: "renderButtonsOn:",
+fn: function (html){
+var self=this;
+return smalltalk.withContext(function($ctx1) { 
+var $1,$2;
+$1=_st(html)._button();
+_st($1)._class_("button");
+_st($1)._with_("SaveIt");
+$2=_st($1)._onClick_((function(){
+return smalltalk.withContext(function($ctx2) {
+return _st(self)._saveIt();
+}, function($ctx2) {$ctx2.fillBlock({},$ctx1)})}));
+smalltalk.HLNavigationCodeWidget.fn.prototype._renderButtonsOn_.apply(_st(self), [html]);
+return self}, function($ctx1) {$ctx1.fill(self,"renderButtonsOn:",{html:html},smalltalk.HLBrowserCodeWidget)})},
+messageSends: ["class:", "button", "with:", "onClick:", "saveIt", "renderButtonsOn:"]}),
+smalltalk.HLBrowserCodeWidget);
+
 smalltalk.addMethod(
 smalltalk.method({
 selector: "saveIt",

js/Helios-Workspace.js

@@ -684,6 +684,43 @@ referencedClasses: []
 }),
 smalltalk.HLCodeWidget);
 
+smalltalk.addMethod(
+smalltalk.method({
+selector: "renderButtonsOn:",
+category: 'rendering',
+fn: function (html){
+var self=this;
+return smalltalk.withContext(function($ctx1) { 
+var $1,$2,$3,$4,$5,$6;
+$1=_st(html)._button();
+_st($1)._class_("button");
+_st($1)._with_("DoIt");
+$2=_st($1)._onClick_((function(){
+return smalltalk.withContext(function($ctx2) {
+return _st(self)._doIt();
+}, function($ctx2) {$ctx2.fillBlock({},$ctx1)})}));
+$3=_st(html)._button();
+_st($3)._class_("button");
+_st($3)._with_("PintIt");
+$4=_st($3)._onClick_((function(){
+return smalltalk.withContext(function($ctx2) {
+return _st(self)._printIt();
+}, function($ctx2) {$ctx2.fillBlock({},$ctx1)})}));
+$5=_st(html)._button();
+_st($5)._class_("button");
+_st($5)._with_("InspectIt");
+$6=_st($5)._onClick_((function(){
+return smalltalk.withContext(function($ctx2) {
+return _st(self)._inspectIt();
+}, function($ctx2) {$ctx2.fillBlock({},$ctx1)})}));
+return self}, function($ctx1) {$ctx1.fill(self,"renderButtonsOn:",{html:html},smalltalk.HLCodeWidget)})},
+args: ["html"],
+source: "renderButtonsOn: html\x0a\x09html button \x0a\x09\x09class: 'button';\x0a\x09\x09with: 'DoIt';\x0a\x09\x09onClick: [ self doIt ].\x0a\x09html button \x0a\x09\x09class: 'button';\x0a\x09\x09with: 'PintIt';\x0a\x09\x09onClick: [ self printIt ].\x0a\x09html button \x0a\x09\x09class: 'button';\x0a\x09\x09with: 'InspectIt';\x0a\x09\x09onClick: [ self inspectIt ]",
+messageSends: ["class:", "button", "with:", "onClick:", "doIt", "printIt", "inspectIt"],
+referencedClasses: []
+}),
+smalltalk.HLCodeWidget);
+
 smalltalk.addMethod(
 smalltalk.method({
 selector: "renderContentOn:",
@@ -691,17 +728,23 @@ category: 'rendering',
 fn: function (html){
 var self=this;
 return smalltalk.withContext(function($ctx1) { 
-var $1,$2;
+var $1,$2,$3,$4;
 self["@code"]=_st(html)._textarea();
 self["@state"]=_st(_st(html)._div())._class_("state");
-$1=self;
-_st($1)._setEditorOn_(_st(self["@code"])._element());
-_st($1)._configureEditor();
-$2=_st($1)._updateState();
+$1=_st(html)._div();
+_st($1)._class_("buttons_bar");
+$2=_st($1)._with_((function(){
+return smalltalk.withContext(function($ctx2) {
+return _st(self)._renderButtonsOn_(html);
+}, function($ctx2) {$ctx2.fillBlock({},$ctx1)})}));
+$3=self;
+_st($3)._setEditorOn_(_st(self["@code"])._element());
+_st($3)._configureEditor();
+$4=_st($3)._updateState();
 return self}, function($ctx1) {$ctx1.fill(self,"renderContentOn:",{html:html},smalltalk.HLCodeWidget)})},
 args: ["html"],
-source: "renderContentOn: html\x0a\x09code := html textarea.\x0a\x09state := html div class: 'state'.\x0a\x09self \x0a\x09\x09setEditorOn: code element;\x0a\x09\x09configureEditor;\x0a\x09\x09updateState",
-messageSends: ["textarea", "class:", "div", "setEditorOn:", "element", "configureEditor", "updateState"],
+source: "renderContentOn: html\x0a\x09code := html textarea.\x0a\x09state := html div class: 'state'.\x0a\x09\x0a\x09html div \x0a\x09\x09class: 'buttons_bar';\x0a\x09\x09with: [ self renderButtonsOn: html ].\x0a\x09\x0a\x09self \x0a\x09\x09setEditorOn: code element;\x0a\x09\x09configureEditor;\x0a\x09\x09updateState",
+messageSends: ["textarea", "class:", "div", "with:", "renderButtonsOn:", "setEditorOn:", "element", "configureEditor", "updateState"],
 referencedClasses: []
 }),
 smalltalk.HLCodeWidget);
@@ -1713,6 +1756,30 @@ referencedClasses: []
 }),
 smalltalk.HLBrowserCodeWidget);
 
+smalltalk.addMethod(
+smalltalk.method({
+selector: "renderButtonsOn:",
+category: 'actions',
+fn: function (html){
+var self=this;
+return smalltalk.withContext(function($ctx1) { 
+var $1,$2;
+$1=_st(html)._button();
+_st($1)._class_("button");
+_st($1)._with_("SaveIt");
+$2=_st($1)._onClick_((function(){
+return smalltalk.withContext(function($ctx2) {
+return _st(self)._saveIt();
+}, function($ctx2) {$ctx2.fillBlock({},$ctx1)})}));
+smalltalk.HLNavigationCodeWidget.fn.prototype._renderButtonsOn_.apply(_st(self), [html]);
+return self}, function($ctx1) {$ctx1.fill(self,"renderButtonsOn:",{html:html},smalltalk.HLBrowserCodeWidget)})},
+args: ["html"],
+source: "renderButtonsOn: html\x0a\x09html button \x0a\x09\x09class: 'button';\x0a\x09\x09with: 'SaveIt';\x0a\x09\x09onClick: [ self saveIt ].\x0a\x09super renderButtonsOn: html",
+messageSends: ["class:", "button", "with:", "onClick:", "saveIt", "renderButtonsOn:"],
+referencedClasses: []
+}),
+smalltalk.HLBrowserCodeWidget);
+
 smalltalk.addMethod(
 smalltalk.method({
 selector: "saveIt",

st/Helios-Workspace.st

@@ -253,9 +253,29 @@ onSaveIt
 
 !HLCodeWidget methodsFor: 'rendering'!
 
+renderButtonsOn: html
+	html button 
+		class: 'button';
+		with: 'DoIt';
+		onClick: [ self doIt ].
+	html button 
+		class: 'button';
+		with: 'PintIt';
+		onClick: [ self printIt ].
+	html button 
+		class: 'button';
+		with: 'InspectIt';
+		onClick: [ self inspectIt ]
+!
+
 renderContentOn: html
 	code := html textarea.
 	state := html div class: 'state'.
+	
+	html div 
+		class: 'buttons_bar';
+		with: [ self renderButtonsOn: html ].
+	
 	self 
 		setEditorOn: code element;
 		configureEditor;
@@ -552,6 +572,14 @@ refresh
 	self contents: self browserModel selectedMethod source
 !
 
+renderButtonsOn: html
+	html button 
+		class: 'button';
+		with: 'SaveIt';
+		onClick: [ self saveIt ].
+	super renderButtonsOn: html
+!
+
 saveIt
 	self browserModel saveSourceCode
 !