Skip to content

Commit 3dc0161

Browse files
victordiazvictordiaz
committed
added styles & message to contribute in editor
1 parent ec54896 commit 3dc0161

4 files changed

Lines changed: 63 additions & 8 deletions

File tree

‎nw-miniblip/index.html‎

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<!DOCTYPE html>
22
<html>
33
<head>
4-
<title>Hello World!</title>
4+
<title>MiniBlip Studio</title>
55
<link rel="stylesheet/less" type="text/css" href="styles/main.less" />
66
<link rel="stylesheet" href="styles/font-awesome/css/font-awesome.min.css">
77
<script src="javascript/jquery-2.1.4.min.js" type="text/javascript"></script>
@@ -13,6 +13,7 @@
1313
var editor;
1414
$( document ).ready(function() {
1515
bind_buttons();
16+
bind_drag_and_drop_area();
1617
hide_all_sections();
1718
show_section_firmware_list();
1819
//get_list_firmwares_local();
@@ -33,17 +34,17 @@
3334
<div id = "toolbar">
3435
<ul>
3536
<li id = "list"> <i class="fa fa-list fa-2x"></i></li>
36-
<li id = "console"> <i class="fa fa-terminal fa-2x"></i></li>
3737
<li id = "code"> <i class="fa fa-code fa-2x"></i></li>
38-
38+
<li class = "disabled" id = "console"> <i class="fa fa-terminal fa-2x"></i></li>
3939

4040
</ul>
4141
</div>
4242

4343
<div id = "main">
4444

4545
<div id = "firmware-list">
46-
46+
<h1> FIRMWARES </h1>
47+
<div id = "list"> </div>
4748
</div>
4849

4950
<div id = "board">
@@ -77,7 +78,13 @@
7778
tick.attach(detect, 1.0 / 40.0);
7879
}
7980

80-
</div>
81+
</div>
82+
83+
<div id = "info_todo">
84+
85+
El editor/compilador offline podria funcionar, pero aun no lo hace! echas una mano? <a href="https://github.com/hack-miniblip/hack-miniblip.github.io"> Hack MiniBlip </a>
86+
87+
</div>
8188
</div>
8289

8390

‎nw-miniblip/javascript/main.js‎

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,7 @@ console.log(file_url);
8282
file_url = get_local_firmware_path(obj.name);
8383
}
8484

85-
$("#firmware-list").append('<div class="item" id = '+obj.id +'><div class="name">' + obj.name +'</div><div class="author">'+obj.author+'</div></div>');
85+
$("#firmware-list #list").append('<div class="item" id = '+obj.id +'><div class="name">' + obj.name +'</div><div class="author">'+obj.author+'</div></div>');
8686
$("#firmware-list #" + obj.id).click(function() {
8787

8888
if (isRemote) {
@@ -153,6 +153,20 @@ function bind_buttons() {
153153
});
154154
}
155155

156+
function bind_drag_and_drop_area() {
157+
var holder = document.getElementById('board');
158+
holder.ondragover = function () { this.className = 'hover'; return false; };
159+
holder.ondragleave = function () { this.className = ''; return false; };
160+
holder.ondrop = function (e) {
161+
e.preventDefault();
162+
163+
for (var i = 0; i < e.dataTransfer.files.length; ++i) {
164+
console.log(e.dataTransfer.files[i].path);
165+
}
166+
return false;
167+
};
168+
}
169+
156170

157171
function hide_all_sections() {
158172
$("#main #editor-container").hide();

‎nw-miniblip/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"version": "0.0.1",
44
"main": "index.html",
55
"window": {
6-
"toolbar": false,
6+
"toolbar": true,
77
"width": 960,
88
"height": 800,
99
"resizable": false

‎nw-miniblip/styles/main.less‎

Lines changed: 35 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,11 @@ body {
9595

9696

9797
li {
98-
padding: 10px;
98+
padding: 10px;
99+
100+
&:hover {
101+
color: black;
102+
}
99103
}
100104

101105
}
@@ -108,6 +112,15 @@ body {
108112
height: 500px;
109113
font-size: 1.2em;
110114

115+
h1 {
116+
font-size: 1em;
117+
text-transform: uppercase;
118+
font-weight: 800;
119+
color: gray;
120+
padding: 18px 0px;
121+
text-align: center;
122+
}
123+
111124
.item {
112125
border-bottom: 1px dotted black;
113126
padding: 11px;
@@ -128,6 +141,21 @@ body {
128141
}
129142
}
130143

144+
#info_todo {
145+
z-index: 10;
146+
background: rgb(245, 105, 105);
147+
bottom: 0;
148+
position: absolute;
149+
width: 500px;
150+
border-radius: 2px 2px 0px 0px;
151+
padding: 18px;
152+
font-size: 2em;
153+
color: white;
154+
box-shadow: 2px 2px 16px black;
155+
left: 144px;
156+
font-weight: 800;
157+
}
158+
131159
#editor {
132160
width: 875px;
133161
height: 800px;
@@ -145,6 +173,12 @@ body {
145173
img {
146174
width: 300px;
147175
opacity: 0.5;
176+
margin-top: 15%;
148177
}
149178
}
150179

180+
.disabled {
181+
opacity: 0.5;
182+
pointer-events:none;
183+
}
184+

0 commit comments

Comments
 (0)