From 5fb9189eacdaa46b4d3119fb4004f8b2e51641ae Mon Sep 17 00:00:00 2001 From: orphevs Date: Fri, 8 Dec 2017 23:21:05 +0100 Subject: [PATCH 1/3] Add Direction Tank --- assets/css/style.css | 45 +++++++++++++--- assets/img/tank_green.png | Bin 0 -> 18797 bytes assets/img/tank_orange.png | Bin 0 -> 18607 bytes assets/js/script.js | 106 +++++++++++++++++++++++-------------- index.html | 5 +- 5 files changed, 110 insertions(+), 46 deletions(-) create mode 100644 assets/img/tank_green.png create mode 100644 assets/img/tank_orange.png diff --git a/assets/css/style.css b/assets/css/style.css index 50199a8..f08e00e 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -27,13 +27,46 @@ body{ right: 0; margin-left: auto; margin-right: auto; + overflow: hidden; } -.block{ - height: 20px; - width: 20px; - background: green; +.tank1{ + height: 36px; + width: 70px; + background: url(../img/tank_green.png) no-repeat; + position: absolute; + border: solid 1px red; +} + +.tank2{ + height: 36px; + width: 70px; + background: url(../img/tank_orange.png) no-repeat; position: absolute; left: 50px; - top: 50px; -} \ No newline at end of file + top: 100px; +} + +.bullet{ + height: 6px; + width: 6px; + background: #fff; + position: absolute; + left: 70px; + top: 15px; +} + + +.directionLeft{ + transform: rotate(180deg); +} +.directionRight{ + transform: rotate(0deg); +} +.directionUp{ + transform: rotate(-90deg); +} +.directionDown{ + transform: rotate(90deg); +} + diff --git a/assets/img/tank_green.png b/assets/img/tank_green.png new file mode 100644 index 0000000000000000000000000000000000000000..49c9ef16e2fa2238ceb7bac7f6e6b99d7cb2b095 GIT binary patch literal 18797 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 PWeu1aSsCUU>^bs3H(^j$ literal 0 HcmV?d00001 diff --git a/assets/img/tank_orange.png b/assets/img/tank_orange.png new file mode 100644 index 0000000000000000000000000000000000000000..08e196efca76d1a413c2593f66f8fcbc58d3c933 GIT binary patch literal 18607 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
-
+
+
+
+
From bbac68a1eacba104b89c67939aa7cbdacf6a793c Mon Sep 17 00:00:00 2001 From: orphevs Date: Fri, 8 Dec 2017 23:34:23 +0100 Subject: [PATCH 2/3] Update direction --- assets/css/style.css | 3 ++- assets/js/script.js | 1 + 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/assets/css/style.css b/assets/css/style.css index f08e00e..a3abf24 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -20,7 +20,7 @@ body{ .map{ width: 1170px; height: 460px; - border: solid 3px red; + border: solid 3px #000; background: url(../img/bg_sand.png) repeat; position: absolute; left: 0; @@ -45,6 +45,7 @@ body{ position: absolute; left: 50px; top: 100px; + display: none; } .bullet{ diff --git a/assets/js/script.js b/assets/js/script.js index 32457c6..8e9d4c0 100644 --- a/assets/js/script.js +++ b/assets/js/script.js @@ -23,6 +23,7 @@ function checkKey(){ if(keyPressed == tank1_key_up || keyPressed == tank1_key_down || keyPressed == tank1_key_left || keyPressed == tank1_key_right){ tank1_checkDirection(); tank1_changeDirection(); + tank1_changePosition(); } function tank1_checkDirection(){ From 0d954a188b365f489b3a33c8372ec36330293f37 Mon Sep 17 00:00:00 2001 From: orphevs Date: Sat, 9 Dec 2017 00:44:51 +0100 Subject: [PATCH 3/3] de_tank v2 --- assets/css/style.css | 68 ++++-------- assets/img/tank_bg.png | Bin 0 -> 22136 bytes index.html | 239 +++++++++++++++++++++++++++++++++++++++-- 3 files changed, 252 insertions(+), 55 deletions(-) create mode 100644 assets/img/tank_bg.png diff --git a/assets/css/style.css b/assets/css/style.css index a3abf24..dd3ddba 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -3,6 +3,7 @@ body{ padding: 0; font-family: sans-serif; background: #232323; + user-select: none; } .header{ @@ -17,57 +18,32 @@ body{ color: #fff; } +.container{ + max-width: 1140px; + margin: auto; +} + .map{ - width: 1170px; - height: 460px; - border: solid 3px #000; + text-align: center; background: url(../img/bg_sand.png) repeat; - position: absolute; - left: 0; - right: 0; - margin-left: auto; - margin-right: auto; - overflow: hidden; + display: inline-block; + padding-top: 7px; + padding-bottom: 3px; } -.tank1{ - height: 36px; - width: 70px; - background: url(../img/tank_green.png) no-repeat; - position: absolute; - border: solid 1px red; +.line{ + display: inline-block; } -.tank2{ - height: 36px; - width: 70px; - background: url(../img/tank_orange.png) no-repeat; - position: absolute; - left: 50px; - top: 100px; - display: none; -} - -.bullet{ - height: 6px; - width: 6px; - background: #fff; - position: absolute; - left: 70px; - top: 15px; -} - - -.directionLeft{ - transform: rotate(180deg); -} -.directionRight{ - transform: rotate(0deg); -} -.directionUp{ - transform: rotate(-90deg); -} -.directionDown{ - transform: rotate(90deg); +.col{ + height: 50px; + width: 50px; + border: solid 0px #000; + display: inline-block; + } +.line-3 > .col-12{ + background: url(../img/tank_bg.png) no-repeat; + background-position: 0px 0px; +} \ No newline at end of file diff --git a/assets/img/tank_bg.png b/assets/img/tank_bg.png new file mode 100644 index 0000000000000000000000000000000000000000..86235940cb44d8a248de7c86c3a1388412a44932 GIT binary patch literal 22136 zcmeI42{@GB+xQ0xk*ntcH?CX|(7=V;>f&jo~PSn%0uy7$!NMsk1 zC&WZg58~-fawfXr0l>FA&6;3i{YF4zx_?r4TUbECHj))T3&ct{B7iSeN>-G0t!bEO z#xs7)yF3O4t2Z`Y2xE+j3W(≪=3b*2O#|ni+NCV%Vvs*%wDHx<0L(e)Vvnq*HU` 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%0ACit-){imARGYRIsyRt z3;?Vr#qGam2)?lFw28isjc@n6vlZu@ zm+u?lE>yyPiC(L`!9gKTOlEwu@d4X2X1#5S;c}-t?p;cZHNIcNp!U39W(?qgaQWP< z2xYuC`>+raaBS{#arD4#|7}4KZJB2A8}dQC#xjyIfBLd|dD2b8jS)zYddBckGGHSx z`DQb^eoh&dW%A0ub?t5L=gdGfp#H*E$@DmLb((R*uBgN28~axmUQ@bnZ$unS;sU0R zu}4duc3WjZ2u@I1HE_!O@y(inI#xYj{%WZJSSH)}Ip#1DW_|Ub^bX09%52VSK-VPn zs3`Fg*YollUfb?)KJN)qOyXOJ1{OGCPgwfpsE2f<1o$LT#Y`vBQ>7U5x!=h>e5b*TVK z`co0gaiNu{Vw$eom)`~Qd!VW zhQT)7#nYS*W@Q+1-jO3Y$Rc@S-z6R+fSSS)s1x9{nE{yB!9E&K!` zPEcB>TlZ5HkjA*KU^v^uzsRt?JICyXz)oqKlLucMVd!7H8GRSVs(fJeSjp+Z^-`BM zRL3tUMV7U8>@0-G%d!6Bf^Ga<_=;Tu63VC4Kb&R|IE}Z<8$fhpG*ZQe;EJ=^)gZoTW>zd&4 z$;0XILm4-RP7ZW^l-IKT8pU%-;WbZ!W!WWNp+o2D##AgQBHQ{;=Cw-&N z=e~P+!9s-G*{l|Go|&~WpxHQ6oxFAc%Ka=&*5a(EkV(S5og%Fr5>~uwCF;86QX$?c z{!oR&OBOQfeD)*q-eBE9F_Jjl5B6$;&;$)A3!3%|?$K|P} z40@UbixK(0rZi=px_w#KN~SoLa)9H$dY+ARuG~>m8#^0gHnYTq`#~*VQH`U@yDEkn{cJDn?*-X!_R|WP@rBg<2 z%l0nh?`u-b+jJ21a7q?;8Y!b={CRSO|ESfdi7a31>Ydj*FYMn*c;$YpB7dL7^>Mjl zm6I(Miy{>|i6tM{=YVHD*=m3BGjOy;&F10b z>jCjfCNJ)YAOG6Z?cTtWuHaDb96Z4AF@dL1#VLvxDwN>P_WW#z1b5Pf>XG2%)eMZ5 zU44=TZeioo+q*0C8LP=A;#yw?3IO}s$K{e2Vjf9L1$A+Cr0=1Yh^TmgB@EnqcNlU_STFic}57Bn;1*IR~jRqtvw!j!t&6?stc*B z93iI$$tRoVr`bn~eA#Yj3vP|#Ija1D`P>oV>CB47dy%5@Yj#68)C@hh7ztkdxL*LB zL(r((S=iesRNt#4;Ecb%$w|)m0IC*nE|Zq2dza>uo-}-PEK}mc{8VM2o4ESEM-dNt z!tXe2X}Q?yJU^9LR@$n_Ap)7^5y>lO4PkUq)Q^7Y_fqh#M|XV0=8YUXAzOj5;n+{o zb9R;+M!1;dVz$Z)nPWnvE_*$7EKFc!kI@?9IB|c^oSXkfK(czO$Lp z3!}Je-YfxkVJc{?vmeC=AO^K8b8RL2cMj}tY1132uDiNzwLF@YL98?ICd{nsm3!13c#9Y~FG|JH0cZ|n4 zbjf?yIVD(#2#UA&ylZOQ5PUngMLB=Hs0X);`(xyh2J3^Y$pue%j~yRo!tI1YPMQg2 ziDi^nHcz6>M3A3-qLZb>-uHj3P(v9w2f-H$Z;0yeqQkPC(Kpy)kV~ zUO{c&Wc3doZ`*5_rxe*3Szwzq8m|Yv4|?&;%WnrJGW~j4=tu9i{;Lb=pQ`$+q+71B zrwXQjI?-v4XfPp9*6fB)3EdwZm(>`7ziO%+`8@7-Dte9aaR&H + de_tank + -
-

de_tank

-
-
-
-
+
+

de_tank

+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
- \ No newline at end of file + +