Permalink
Browse files

Merge branch 'master' of https://github.com/winwu/nko2013.tw

  • Loading branch information...
2 parents 288940b + 963fd2b commit 7f652e423b473d0d1fef45f6d37d19a078741894 @eminaz eminaz committed Nov 10, 2013
Showing with 50 additions and 43 deletions.
  1. +8 −6 public/js/style.js
  2. +33 −30 public/stylesheets/style.css
  3. +9 −7 views/index.ejs
View
@@ -56,10 +56,12 @@ $(function(){
$('#choose_range').change(function(){
ctx.lineWidth = $('#choose_range').val();
+ // console.log($(this).val() );
+ $( ".color_plate > li" ).css({'width': 40 + ctx.lineWidth , 'height': 40 + ctx.lineWidth });
});
// 設定color
- $( "#color_plate > li" ).click(function() {
+ $( ".color_plate > li" ).click(function() {
$(this).attr("class")
ctx.strokeStyle = $(this).attr("class");
@@ -70,7 +72,7 @@ $(function(){
//清除 = 新增圖面
$('#add_canvas').click(function(e){
- $('#redo_canvas, #undo_canvas, #save_canvas').removeAttr('disabled');
+ $('#redo_canvas, #undo_canvas, #save_canvas, #allbackground_picker').removeAttr('disabled');
newColor = '#ffffff';
ctx.fillStyle='';
myCanvas.style.background='';
@@ -99,7 +101,7 @@ var saved_dataURL;
myCanvas.style.background = newColor;
//ctx.fill();
- ctx.fillRect(0, 0, 700, 350);
+ ctx.fillRect(0,0,canvas.width,canvas.height);
ctx.fill();
saved_dataURL = canvas.toDataURL('image/jpeg');
@@ -123,7 +125,7 @@ var saved_dataURL;
prop_msg('Broadcase Your Works!');
- $('#redo_canvas, #undo_canvas, #save_canvas').attr('disabled','disabled');
+ $('#redo_canvas, #undo_canvas, #save_canvas, #allbackground_picker').attr('disabled','disabled');
$('#myCanvas').css('cursor','not-allowed');
canvas = document.getElementById('myCanvas');
ctx = canvas.getContext('2d');
@@ -134,8 +136,8 @@ var saved_dataURL;
// B.接收別人的圖片要接 data_obj
socket.on('receivePic',function(data_obj){
- console.log( data_obj.name );
- console.log('理我一下');
+ //console.log( data_obj.name );
+ //console.log('理我一下');
var author_talking_dom = '<p><code>'+ data_obj.name +'</code>\'s works:</p>'
//var new_saved_dom = '<img src="' + data_obj.pic + '"/>';
@@ -102,42 +102,44 @@ border-bottom: 1px solid #EEE;height: 40px;line-height: 40px;text-indent: 20px;f
/*#div_link_group a:not(:first-child):not(:last-child):after{content:" | ";}*/
#div_link_group a:not(:last-child):after{content:" | ";}
/*http://stackoverflow.com/questions/7788018/css-selector-for-other-than-the-first-child-and-last-child*/
-#div_link_group a{color: #B4B4B4;}
-#div_link_group a:hover{color:#fff;}
+#div_link_group a{color: #B4B4B4}
+#div_link_group a:hover{color:#fff}
+
#myCanvas{
- margin: 10px;
-}
-/*#painter_ctrl li{
- display: block;
- height: 50px;
- line-height: 50px;
- text-indent: 20px;
-}*/
-#color_plate {
-text-align: center;
+ margin: 10px;
}
-#color_plate li{
- display: inline-block;
- height: 50px;
- width: 50px;
- border-radius: 100%;
- cursor: pointer;
- margin: 10px;
-
+.color_plate {
+ text-align: center;
+ height: 80px;
+}
+.color_plate li{
+ display: inline-block;
+ height: 50px;
+ width: 50px;
+ border-radius: 100%;
+ cursor: pointer;
+ margin: 10px;
+}
+.color_plate li:hover{
+ border: 2px dashed #FFF;
}
-#color_plate .red{background: red}
-#color_plate .yellow{background: yellow}
-#color_plate .blue{background: blue}
-#color_plate .orange{background: orange}
-#color_plate .green{background: rgb(139, 204, 23)}
-#color_plate .white{background: white}
-#color_plate .pink{background: rgb(233, 75, 103)}
+.color_plate .red{background: red}
+.color_plate .yellow{background: yellow}
+.color_plate .blue{background: blue}
+.color_plate .orange{background: orange}
+.color_plate .green{background: rgb(139, 204, 23)}
+.color_plate .white{background: white}
+.color_plate .pink{background: rgb(233, 75, 103)}
+
+
+#show_history{
+ text-align: center;
+ height: 400px;
+ overflow: scroll;
+}
-#show_history{text-align: center;
-height: 400px;
-overflow: scroll;}
#show_history .title{
background:#ddddd9;
margin:0;
@@ -146,6 +148,7 @@ overflow: scroll;}
position: absolute;
width: 255px;
}
+
#show_history img{
width: 90%;
border: 1px solid #eee;
View
@@ -68,16 +68,18 @@
</div><!--hd-->
- <div id="containter" class="pure-g-r">
+ <div id="containter" class="pure-g">
<div id="nav_link" class="pure-u-1-5">
<nav class="content">
- <ul id="color_plate">
- <li class="red"></li>
- <li class="pink"></li>
+ <ul class="color_plate">
+ <li class="yellow"></li>
<li class="orange"></li>
- <li class="blue"></li>
<li class="green"></li>
- <li class="yellow"></li>
+ </ul>
+ <ul class="color_plate">
+ <li class="pink"></li>
+ <li class="red"></li>
+ <li class="blue"></li>
</ul>
<!--label for="choose_color">Choose Other:<input id="choose_color" type="color"/></label-->
<label for="choose_range"><i class="icon-pencil"></i> Choose brush's width:<input id="choose_range" type="range" max="15" min="1" value="4" step="1"/></label>
@@ -121,7 +123,7 @@
<a href="">Contact Us</a>
<a href="">Partner</a>
</div-->
- <div id="copyright">Cagod Team at node.js knockout 2013 &copy; All Rights Reserved.</div>
+ <div id="copyright">Cagod Team at <a href="http://nodeknockout.com/">nodeknockout 2013</a></div>
</div><!--#ft-->
<div id="hellobox_shadow"></div>

0 comments on commit 7f652e4

Please sign in to comment.