From 814566b3e8ed450157b772aa5cf3d427aa046501 Mon Sep 17 00:00:00 2001 From: Filippo Valsorda Date: Mon, 30 Jun 2014 17:34:43 +0200 Subject: [PATCH 001/240] original zipfile --- css/draggable_builder.css | 421 ++++++ draggable_builder.html | 99 ++ img/triangle.png | Bin 0 -> 34942 bytes js/draggable_builder.js | 604 +++++++++ js/vendor/jquery.html5-placeholder-shim.js | 109 ++ js/vendor/underscore1.6.0.js | 1343 ++++++++++++++++++++ 6 files changed, 2576 insertions(+) create mode 100644 css/draggable_builder.css create mode 100644 draggable_builder.html create mode 100644 img/triangle.png create mode 100644 js/draggable_builder.js create mode 100644 js/vendor/jquery.html5-placeholder-shim.js create mode 100644 js/vendor/underscore1.6.0.js diff --git a/css/draggable_builder.css b/css/draggable_builder.css new file mode 100644 index 000000000..d45acdb47 --- /dev/null +++ b/css/draggable_builder.css @@ -0,0 +1,421 @@ +/*** xBlock styles ***/ +.xblock--drag-and-drop { + width: 770px; + margin: 0; + padding: 0; + background: #fff; +} + +.xblock--drag-and-drop h1, +.xblock--drag-and-drop h2, +.xblock--drag-and-drop h3, +.xblock--drag-and-drop h4, +.xblock--drag-and-drop h5, +.xblock--drag-and-drop h6, +.xblock--drag-and-drop p, +.xblock--drag-and-drop li, +.xblock--drag-and-drop a { + font-family: Arial; +} + +.xblock--drag-and-drop h1 { + color: #adadad; +} + +.xblock--drag-and-drop h2 { + color: #333; + margin: 0; + text-transform: uppercase; +} + +.xblock--drag-and-drop header p, +.xblock--drag-and-drop footer p { + color: #adadad; + line-height: 1.5em; +} + +.xblock--drag-and-drop .small { + font-size: 0.6em; +} + +.xblock--drag-and-drop .drag-container { + width: 760px; + background: #ebf0f2; + position: relative; +} + + +/** Draggable Items **/ +.xblock--drag-and-drop .items { + width: 210px; + margin: 10px; + padding: 0; + font-size: 14px; + position: relative; + display: inline; + float: left; + list-style-type: none; +} + +.xblock--drag-and-drop .items .option { + width: 190px; + background: #2e83cd; + color: #fff; + position: relative; + float: left; + display: inline; + z-index: 100; + margin-bottom: 5px; + padding: 10px; +} + +.xblock--drag-and-drop .option.hover { background: #ccc; } +.xblock--drag-and-drop .option.fade { opacity: 0.6; } + + +/*** Drop Target ***/ +.xblock--drag-and-drop .target { + width: 515px; + height: 510px; + position: relative; + display: inline; + float: left; + margin: 10px 0 15px 5px; + background: #fff; + z-index: 1; +} + +.xblock--drag-and-drop .target-img { + background: url(../img/triangle.png) no-repeat; + width: 100%; + height: 100%; +} + +.xblock--drag-and-drop .zone { + /*border: 1px solid #000;*/ + position: absolute; + + display: -webkit-box; + display: -moz-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + + /* Internet Explorer 10 */ + -ms-flex-pack:center; + -ms-flex-align:center; + + /* Firefox */ + -moz-box-pack:center; + -moz-box-align:center; + + /* Safari, Opera, and Chrome */ + -webkit-box-pack:center; + -webkit-box-align:center; + + /* W3C */ + box-pack:center; + box-align:center; + +} + +.xblock--drag-and-drop .zone p { + width: 100%; + font-family: Arial; + font-size: 16px; + font-weight: bold; + text-align: center; + text-transform: uppercase; + margin-top: auto; + margin-bottom: auto; +} + +.xblock--drag-and-drop .zone.one { + height: 75px; + width: 115px; + top: 130px; + left: 200px; +} +.xblock--drag-and-drop .zone.two { + height: 120px; + width: 200px; + top: 220px; + left: 157px; +} +.xblock--drag-and-drop .zone.three { + height: 120px; + width: 200px; + bottom: 30px; + left: 157px; +} + +/*** IE9 alignment fix ***/ +.lt-ie10 .xblock--drag-and-drop .zone { + display: table; +} + +.lt-ie10 .xblock--drag-and-drop .zone p { + display: table-cell; + vertical-align: middle; + text-align: center; +} + +/*** FEEDBACK ***/ +.xblock--drag-and-drop .feedback { + width: 740px; + border-top: #ccc 1px solid; + margin: 20px 10px; + padding-top: 10px; +} + +.xblock--drag-and-drop .feedback .message { + margin: 5px 0 0; +} + +/** Builder **/ +.xblock--drag-and-drop .hidden { + display: none!important; +} + +.xblock--drag-and-drop .drag-builder .tab { + width: 98%; + background: #eee; + padding: 3px 0; + position: relative; +} + +.xblock--drag-and-drop .drag-builder .tab:after, +.xblock--drag-and-drop .drag-builder .tab-footer:after, +.xblock--drag-and-drop .drag-builder .target:after { + content: ""; + display: table; + clear: both; +} + +.xblock--drag-and-drop .drag-builder .tab h3 { + margin: 10px 0; +} + +.xblock--drag-and-drop .drag-builder .tab-header, +.xblock--drag-and-drop .drag-builder .tab-content, +.xblock--drag-and-drop .drag-builder .tab-footer { + width: 96%; + margin: 2%; +} + +.xblock--drag-and-drop .drag-builder .tab-footer { + height: 25px; + position: relative; + display: block; + float: left; +} + +.xblock--drag-and-drop .drag-builder .continue { + position: absolute; + right: 0; + top: -5px; +} + +.xblock--drag-and-drop .drag-builder .items { + width: calc(100% - 515px); + margin: 10px 0 0 0; +} + +.xblock--drag-and-drop .drag-builder .target { + margin-left: 0; +} + +.xblock--drag-and-drop .zones-form .zone-row label { + display: inline-block; + width: 18%; +} + +.xblock--drag-and-drop .zones-form .zone-row .title { + width: 60%; + margin: 0 0 5px; +} + +.xblock--drag-and-drop .zones-form .zone-row .layout { + margin-bottom: 15px; +} + + +.xblock--drag-and-drop .zones-form .zone-row .layout .size, +.xblock--drag-and-drop .zones-form .zone-row .layout .coord { + width: 15%; + margin: 0 19px 5px 0; +} + +.xblock--drag-and-drop .drag-builder .target { + margin-bottom: 40px; +} + +.xblock--drag-and-drop .drag-builder .zone { + width: 200px; + height: 100px; + border: 1px dotted #666; +} + +.xblock--drag-and-drop .feedback-form textarea { + width: 99%; + height: 128px; + margin-bottom: 30px; +} + +.xblock--drag-and-drop .items-form { + margin-bottom: 30px; +} + +.xblock--drag-and-drop .items-form .item { + background: #73bde7; + padding: 10px 0 1px; + margin: 15px 0; +} + +.xblock--drag-and-drop .items-form label { + margin: 0 1%; +} + +.xblock--drag-and-drop .items-form input, +.xblock--drag-and-drop .items-form select { + width: 35%; +} + +.xblock--drag-and-drop .items-form textarea { + width: 97%; + margin: 0 1%; +} + +.xblock--drag-and-drop .items-form .row { + margin-bottom: 20px; +} + + +/** Buttons **/ +.xblock--drag-and-drop .btn { + background: #2e83cd; + color: #fff; + border: 1px solid #156ab4; + border-radius: 6px; + padding: 5px 10px; +} + +.xblock--drag-and-drop .btn:hover { + opacity: 0.8; + cursor: pointer; +} + +.xblock--drag-and-drop .btn:focus { + outline: none; + opacity: 0.5; +} + +.xblock--drag-and-drop .add-element { + text-decoration: none; + color: #2e83cd; +} + +.xblock--drag-and-drop .remove-zone { + float: right; + margin-top: 2px; + margin-right: 16px; +} + +.xblock--drag-and-drop .remove-item { + display: inline-block; + margin-left: 95px; +} + +.xblock--drag-and-drop .icon { + width: 14px; + height: 14px; + border-radius: 7px; + background: #2e83cd; + position: relative; + float: left; + margin: 0 5px 0 0; +} + +.xblock--drag-and-drop .add-zone:hover, +.xblock--drag-and-drop .add-zone:hover .icon, +.xblock--drag-and-drop .remove-zone:hover, +.xblock--drag-and-drop .remove-zone:hover .icon { + opacity: 0.7; +} + +.xblock--drag-and-drop .icon.add:before { + content: ''; + height: 10px; + width: 2px; + background: #fff; + position: relative; + display: inline; + float: left; + top: 2px; + left: 6px; +} + +.xblock--drag-and-drop .icon.add:after { + content: ''; + height: 2px; + width: 10px; + background: #fff; + position: relative; + display: inline; + float: left; + top: 6px; + left: 0; +} + +.xblock--drag-and-drop .icon.remove:before { + content: ''; + height: 10px; + width: 2px; + background: #fff; + position: relative; + display: inline; + float: left; + top: 2px; + left: 6px; + -webkit-transform: rotate(45deg); + -ms-transform: rotate(45deg); + transform: rotate(45deg); +} + +.xblock--drag-and-drop .icon.remove:after { + content: ''; + height: 2px; + width: 10px; + background: #fff; + position: relative; + display: inline; + float: left; + top: 6px; + left: 0; + -webkit-transform: rotate(45deg); + -ms-transform: rotate(45deg); + transform: rotate(45deg); +} + +.xblock--drag-and-drop .remove-item .icon.remove { + background: #fff; +} +.xblock--drag-and-drop .remove-item .icon.remove:before, +.xblock--drag-and-drop .remove-item .icon.remove:after { + background: #2e83cd; +} + +/*** Temp. styles for surrounding area & dev ***/ +body, +.container { + margin: 0; + padding: 0; + background: #e5ebee; +} + +.xblock--drag-and-drop { + margin: 20px auto 0; + padding: 10px 0 10px 10px; +} + +.reset { margin: 0 0 15px 700px; } \ No newline at end of file diff --git a/draggable_builder.html b/draggable_builder.html new file mode 100644 index 000000000..b981ea17a --- /dev/null +++ b/draggable_builder.html @@ -0,0 +1,99 @@ + + + + + + + + + draggable demo + + + + + + +
+
+ + +
+ + + + + + + +
+ + + +
+

Feedback

+

+
+
+
+ + + + + + + + \ No newline at end of file diff --git a/img/triangle.png b/img/triangle.png new file mode 100644 index 0000000000000000000000000000000000000000..3ade6b6489ee3d35c8925d81b9d2e5b9294359b4 GIT binary patch literal 34942 zcmeFabySpF`#(HGhp2#npa_!EIYUXw&?!Sncf%mvAu5d`A|)_@bhk7jrF3_gAl(h~ z-s5@BbIzCNJig!cTfaZv^)6>EVD`TDb?s|^uGn?oi!e16St0@|0uTs9BrgY32Z1m! zKp^mUJRG0~?D@SN_=E2x_rL`NA|yrsfI&&GuY*7$1~wWxt~$y}!e$5uP7`y4sRgH} zgA>pi1iCBk>11MNXW>d~YGGyLC`z|c-%LkqV=hXk4N>M+c9OENwvqF8wt#!9Xqb81 znF*QGiHi~3^%MpKI9Rxv(0V%9JGuyaiqid*D-3)`S98(P{%qoECrT%Y?vPeTS&dc- z;cP(*;e>FQar5%f3J7uXK=_4tc-U!qxq0}wc(}QEg*bS4g!u)8d7!la`p}6H0N?I9 zn_CL2!({%|9Z(XbvvzfL66WIa@bKXD;NwI%TXFFS2?=p=^K$X>asVwjT)Z4zO*}aq zUFiQ1@~0e_g^QW9jgzYl!jTp&*TfXz<|;}@hwkX#pMQHk@fv^${PzefAN5G3tx z;pqC0q5zxyTF^iBZ*KN)9w#?v`=3CYn{ip#TQ~syxBwXN{38HP)(BUGi#6iEbop=c zPZ0m9V^HP?VL0Rh?}B_cyVJABh4oX;S&_%y(b9e6#X~${}2tcaJF%` zFqd&gIQ$G4ClhBE3$*i!(*5bZ|BkSKq59MPg>C**CqW(yUK0yb9u9MU9so^Kh#7|v z)Rd1y(8QdNU%-M7YAIlGm+L>+|I!KQ;O-w}^Z!#@{RjJB(*K0xZ$ti1XOXjUaYZboon2T}!$@pi*MV7l zn+aPYoE=PD#cUi*tSq>k9Ifth{Z;w5mj9l}g{2Vo2xmYo3o*XCT>n)4H!k!Pj-GUZ z$T#_!<9P0J{YTx!_B!a<#@_8`djVc<-~%igfzQ8K|4zQh`ry~BeHntG z3$lK9asiNE7k|U`YkV$Hf5UYFkY5*n!}V)?E>M5NbpeoH7k|U`YkV$Hf5UYFkY5*n z!}V)?E>M5NbpeoH7k|U`YkV$Hf5UYFkY5*n!}V)?E>M5NbpeoH7k|U`YkV$Hf5UYF zkY5*n!}V)?E>M5NbpeoH7k|U`YkV$Hf5UYFkY5*n!}V)?E>M5NbpeoH7k|U`YkV$H zf5UYFkY5*n!}V)?E>M5NbpeoH7k|U`YkV$Hf5UYFkY5*n!}V)?E>M5NbpeoH7k|U` zYkV$Hf5UYFkY5*n!}V)?E>M5NbpeoH7k|U`YkV$Hf5UYFkY5*n!}V)?E>M5NbpeoH z7k|U`YkV$Hf5UYFkY5*n2^Ya%@61{_0x!yX0B^*82`#V&-lnBBlT%j)fxH<(puk`d z=m-V;{Q&~Gaf3k1#vqVz0tiHbcwy8o0|F@}%flo!Jf~J?y&BBj{1#FDHPw0^8&Qr) z**578454%iFkToh!y)a9>r8?j-(=-NADY~xyG>=nor||D*v!z;#&E82jpyj7n}KwP zFE*El$MGr=EA6a=N5$@34Pw4(tio4(r*k%cId!TAu35tTETev9tmvDIO3KD!L%*el zCJ5AG9IghuL2Qi$s2&CUAc=ur{6I}0pde@f5BNm|27x5#fiM4Ojp{7rU{E*?Ag=|a zUWFiyc?QQf-n_1vMbKhg1OAflEzxEV=~%rMLqCE=OAO)`v}q}#tJ7=?5A}Z(4r0In z;p7laWY}H_?`qqolZ*^oC6CF;Ba)y4AyLDD)8k1XVq!AlvrBPcIV{j_z>QM)s2C&N zhZpUSu9JGDhpuMHfWkn5P0E<3^)UY0*BIAk3PYF9H1L3~25OW88`avx=;+FLBXD?_ zyz@fuDpi3W6?Xk!{tXp{g8Upnc;QPOeX8z9BMysH;~O5gghSq<{h7<{g=zR=IqakxnF8 z*N%HDlBbM_?z6gPAPgkY&yTU*OIKGh=ZC3)&}t+mJ|ki!Kx>uA)RJ7eeDi7y2gd{B zgtrttTRg-c;09=(!y7>!Rr&Zj{!Iy?bN4LJJ%2)AR6lUL9NuNENI}J9NzcT?Nk^G~ z2@r&bpm(w=NDj2Q>xw zIx5(((K+QTv~Uwe%tDtK&BYjZfn#FQcsXZ8eDkx^B$_RS*Kwcx&^o7{p#L z^1x`TuTpuPggo8{(LEI5F|)(@zj*8=c_NVn~_o8VW&={I8Pp(Nyzu0hhIh;#FgrK(@;$!Vt48!T1LiYu&e7$ zsGyQGt*_}z&{B*{OTWLI&*n|hrd~#RrY(0fQyMc?v^P^N97U9DIqWMo9-n8%+`kbK z9T}Fu4kyK<*e3?vQyGmognFoQ1>h9ahH7p=vzgEdLZ!IbDY&Zk#OKTfMo&)?5v>xM zAf3&MCS^lx1WX*(&l;UyO2pCQwdH$Iz{!xrAT|1V)n;i}|5`|Y#&See?KI4l9!`#T z1xf@;SH^rj*dXAd2CLrd#gL_Y5$bRlK*zL2p3RMxh%v4@JEf`|7#bQ*Hviop4y)mL zg7#yJLugI=mKBh{VDlWV40K@=9b7U>pZAn((2fu4=bYorAU!LMHU6R8PSJ1aFAekH z%>n~ScV#GWRi$9P*YBLNJ%7ha$pLvH*v@^Gx7gsVA}sdoj79TqvX|Rks(A+n=jVBs z0fSs6?$74B{<2_?BL^eRBp(xiO=}1g@X1k=`uRpy_+pL`Wf&tTFUb)P932}t4fr|@ z8l%nr&&4VbE~Z5;;&2)O0-V%Et~oY3%Tlqba4UFx?nIjTWgzzlf>kiTm#CL%U-@ih zq=3DB<&q&O77zwki8bdv{g3C~IX+fjESO+RxB<)<#vt5xPgXQmErRti3%tspC~S2w zatBa%w{dq&o4p|jU94d*?K4?7M%`h2c)CLJu<@^0~JCKmqQU1 z2c2}8)6#9~#7HS+K}JyB`~2ixhkZ`gvW^{!>ipyJ`}jzg34V~Pe4psi^w{@v1nYfv z;^~H~5z&q$JYu6jSO=afVcPq*PR*=on2L_4rKwdRGDv{AZlLBS;yaXh@*d+Dd=Kzq zaf(5~QS>;QzD%!b74#KpWT>-p$7@s}(n%yv%ASD+Odc$D(d2tKOEa=YbV9wimfGHi zez;Erm~n|PHEk+uxiLy%M2!t0mc85@s{kYqiTN(UkahT808pPm027#i*}s1rDi8n3 zVgop5dVT&Tp3Z>BFdy>(z*=~T+u7%@DQ;fUGWrqTC_kWc106hM^_BF~ikEPQM5 zxY0`;*KN{4xozQ}GSjU_qb#;V_QRKMA%At9zeUt5HWXmI zJ)hlPGpQ;||6cniKzIl$W0&`oi(UT2vyu?q6oO0LPNtnt=qzbQK}ntWF(qz%ZOHQ& zz^Y^;>k7BxJGhSzpo;fHA}+N@xHFY}P+22W*^WErO(cW6A)To|3<3;;R%3fTZyxB3 z%g*KVQC>g%Cl6V_(M+n_Gn%V|#QB5YtFH4gWJ=ZhE41B}`^j_DCeUNKksnO0fX&ZU z+`NfR%%gz`#6n%)o|VVqOr9SdRSs2(0yYUR?`}gu6zn|A7Hvpvp}8JhYYgEO0>RJT zE(aCtn1G{j3V??x^!5x@8HM}ztZE95nLAFhm6nk{s}h0rk}8w=A*ZyOrT7Z>VmoVw=YD zzL=Cc;v6OsGy9CdA?KEKHW!!rXeClUN7_ z3Eb1k1y{WR&;6*6V?r|5LOF`XQHxtkU;E)i#-c!aA58)sj41jge<7(6RTw4hOm38c z_2r=bT1}uc?Wi;qqLJa@1!asD@G+vR-V#?sM{(|hKGBD9h#hTsn4v1R@58g&H1$CW zI1%!?2qA`rj++vz$EIY#QFpEk4g0DR?CBQ~|CgZ-O^<&%m8RFhh#Non44Awhp4P_a z9&`QCoe)v!ku_^G>VCoc6OGJg~pugU|MGu``mq)jO z0o?h1l(z+NVA9o9?a$jDc!a{QS2B|c+6hyNyCjF|;9qDfqN{$&gp4I} zO-SA=6=2cb_p6(mdFAQ)eh)|wB?&u{bRY@+024*l8Wb{AX#`4prPZTzch5?pqbBDm z>9j!j^=AmQ9zm*@(eo@B5Pq;?fYD02$mCU5Z)3v~`;Og@R)ef1IRyb8XSHRIXPu<@ zd7WwIL4dV`U*mXI)T2^-eR~Jy1fFHF4Iyd|v96qwTMHXW{p!;pgfcv(5q(?*Zug&4);V)&y1&uXo8+f&To5j`8_h9;b zk|%Pc1sLmk0@K38C@>3YE8^mD+`N-?y)^PuZjhlIj*{d(?rZZ*@1;ZpsKR>g-vBW4 z>&Z8BUJvu>-dLOex_OUufQ?e>T^eh#hwj~gt@k6?{J`{-1MV!TS=P@lKNsI!aGHaa zKM-8=b8FjDY1SMS56*ui16msAZ~1QKg;;iE9TeA1Y!RG`^mN}c(;x%b(>~V81{jPs z(?;6mrp#I8%#E+?i%F+=`e~}(^f)HUKcDo~12&Gkl=GG$JL`G%t#wbQKKKz*O{NcC zhmRZUuSnVX^{I?@Zdm~VEcQ+S2awsE1@24t2%VrFRlPEU5*{qP4xgqqS`(VSfrXV4 zJ`vmCu}q=axN|rL>?fC!`DsOec=Bzelk8o7@eQ{}*HO{T*F{-d;Bu=|!-I!sPx`s9 zAm<-anqG=@Jx}xqTgqmYQh5im$iEcnK;@k*h%4#SXM`LLC@=r$_;IvI->s@AQ+Rd> ztMQ7__S^@yFN0fzQDGb3ZansH$A7|o^=`n!>3jQS!F0U3@5kwkC0GU5N_qAmSZvJ| z$5t)5cN9a)5=TEhT-&ga9YWSvE8u)52)3OZw=UhvI}d-?Y}QtIK6HFwraLxMs8UyM zBfHta{pv326U=@m%Qpf@$h)N)>n$ny!n*w%FQY{Z7O$&KPu!_I&cTTmePY*TG5)Hm zF97#$2##MiIV09y)n&^yfyxC^3JCU-WO7@-Cf#hSPkRikqRk3@Lg(c=uAeQ4NdpoP zB!H9N`s(en$Z1X!a1Tb}<_pony<$MkTxq^!|ILG$Vg9{JGZ9=J!Bfr|!}Bd*a^xIi zMa)=K`_)Yv|95jR`)=u0&0Ms4##GP6H_wlg0$U*+t!|5tf~4$dgx*7(3+=_#Vv?YQ z2~a;)_%^>{GRugyJe;<`MsmPsVCdc4ODMs+jf%N$MXQudijE9YaWbB;jm;K3YdgW*GV+|Lkb%ICD9HAc3i+OLec9Keexmk% zLG3o~!9i_7->ZHcDI%V#Uv|7q2#g6imG62k-dxhxEpxuv%;7TpZF;EL;wbww*Zk^n zvTj*H{Htmr0Vg1OI1ASMc~a0L3VrQ!D*na=w`q1};7!3a?pxaX&$0-f1n{xdN^&H_ zKHgAXPXyAJ0|n13-C$rrQmb@6$;8DxojQv#n66<`PMZ$cS34k0Px$<~fy1eg`k8Xu~ z*ttA`E}sEkUpi6#`i)!`YplS5Y;b?0;b`;QTFK1aO-bW0O<7>QBd%TcFdx_*(E1Yo z@C57})Pakt!U<#ok*Nm}SFI~+U;shX1q^Av(9}bqZr^AI

TgVB79Sc=tms^SMs@ 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 KMNUMnLSTYdEnj*7 literal 0 HcmV?d00001 diff --git a/js/draggable_builder.js b/js/draggable_builder.js new file mode 100644 index 000000000..38c6e19e4 --- /dev/null +++ b/js/draggable_builder.js @@ -0,0 +1,604 @@ +var dragAndDrop = (function() { + var _fn = { + + // DOM Elements + $block: $('.xblock--drag-and-drop'), + $app: $('.xblock--drag-and-drop .drag-container'), + $ul: $('.xblock--drag-and-drop .items'), + $target: $('.xblock--drag-and-drop .target-img'), + $feedback: $('.xblock--drag-and-drop .feedback .message'), + + // Cannot set until items added to DOM + $items: {}, // $('.xblock--drag-and-drop .items .option'), + $zones: {}, // $('.xblock--drag-and-drop .target .zone'), + + // jQuery UI Draggable options + options: { + drag: { + containment: '.xblock--drag-and-drop .drag-container', + cursor: 'move', + stack: '.xblock--drag-and-drop .items .option' + }, + drop: { + accept: '.xblock--drag-and-drop .items .option', + tolerance: 'pointer' + } + }, + + // item template + tpl: { + item: '

  • <%= displayName %>
    • ', + zoneInput: function() { + return [ + '
    ', + '', + '', + '', + '
    ', + '', + '', + '', + '', + '', + '', + '', + '', + '
    ', + '
    ' + ].join(''); + }, + zoneElement: function() { + return [ + '
    ', + '

    <%= title %>

    ', + '
    ' + ].join(''); + }, + zoneDropdown: '', + itemInput: function() { + return [ + '
    ', + '
    ', + '', + '', + '', + '', + '', + '
    ', + '
    ', + '', + '', + '
    ', + '
    ', + '', + '', + '
    ', + '
    ' + ].join(''); + } + }, + + init: function() { + // Add the items to the page + _fn.items.draw(); + _fn.zones.draw(); + + // Load welcome feedback + _fn.feedback.set( _fn.data.feedback.start ); + + // Init drag and drop plugin + _fn.$items.draggable( _fn.options.drag ); + _fn.$zones.droppable( _fn.options.drop ); + + // Init click handlers + _fn.clickHandlers.init( _fn.$items, _fn.$zones ); + + // Get count of all active items + _fn.items.init(); + }, + + build: { + $el: { + feedback: { + form: $('.xblock--drag-and-drop .drag-builder .feedback-form'), + tab: $('.xblock--drag-and-drop .drag-builder .feedback-tab') + }, + zones: { + form: $('.xblock--drag-and-drop .drag-builder .zones-form'), + tab: $('.xblock--drag-and-drop .drag-builder .zones-tab') + }, + items: { + form: $('.xblock--drag-and-drop .drag-builder .items-form'), + tab: $('.xblock--drag-and-drop .drag-builder .items-tab') + }, + target: $('.xblock--drag-and-drop .drag-builder .target-img') + }, + init: function() { + _fn.build.clickHandlers(); + _fn.build.form.zone.add(); + }, + clickHandlers: function() { + var $fbkTab = _fn.build.$el.feedback.tab, + $zoneTab = _fn.build.$el.zones.tab, + $itemTab = _fn.build.$el.items.tab; + + $fbkTab.on( 'click', '.goto-zones', function(e) { + e.preventDefault(); + _fn.build.form.feedback( _fn.build.$el.feedback.form ); + + $fbkTab.addClass('hidden'); + $zoneTab.removeClass('hidden'); + + // Placeholder shim for IE9 + $.placeholder.shim(); + }); + + $zoneTab + .on( 'click', '.add-zone', _fn.build.form.zone.add ) + .on( 'click', '.remove-zone', _fn.build.form.zone.remove ) + .on( 'click', '.goto-items', function(e) { + e.preventDefault(); + _fn.build.form.zone.setAll(); + _fn.build.form.item.add(); + + $zoneTab.addClass('hidden'); + $itemTab.removeClass('hidden'); + + // Placeholder shim for IE9 + $.placeholder.shim(); + }); + + $itemTab + .on( 'click', '.add-item', _fn.build.form.item.add ) + .on( 'click', '.remove-item', _fn.build.form.item.remove ) + .on( 'click', '.goto-exercise', function(e) { + e.preventDefault(); + _fn.build.form.submit(); + }); + }, + form: { + zone: { + count: 0, + formCount: 0, + dropdown: '', + list: [], + obj: [], + add: function(e) { + var inputTemplate = _fn.tpl.zoneInput(), + zoneTemplate = _fn.tpl.zoneElement(), + name = 'zone-', + $elements = _fn.build.$el, + num, + obj; + + if (e) { + e.preventDefault(); + } + + _fn.build.form.zone.count++; + _fn.build.form.zone.formCount++; + num = _fn.build.form.zone.count; + name += num; + + // Update zone obj + zoneObj = { + title: 'Zone ' + num, + id: name, + active: false, + index: num, + width: 200, + height: 100, + x: 0, + y: 0 + }; + + _fn.build.form.zone.obj.push( zoneObj ); + + // Add fields to zone position form + $elements.zones.form.append( _.template( inputTemplate, { + title: 'Zone ' + num, + name: name + })); + _fn.build.form.zone.enableDelete(); + + // Add zone div to target + $elements.target.append( _.template( zoneTemplate, zoneObj ) ); + + // Listen to changes in form to update zone div + _fn.build.form.zone.clickHandler( num ); + + // Placeholder shim for IE9 + $.placeholder.shim(); + }, + remove: function(e) { + var $el = $(e.currentTarget).closest('.zone-row'), + classes = $el.attr('class'), + id = classes.slice(classes.indexOf('zone-row') + 9); + + e.preventDefault(); + $el.detach(); + $('#' + id).detach(); + + _fn.build.form.zone.formCount--; + _fn.build.form.zone.disableDelete(); + + // Placeholder shim for IE9 + $.placeholder.shim(); + }, + enableDelete: function() { + if ( _fn.build.form.zone.formCount > 1 ) { + _fn.build.$el.zones.form.find('.remove-zone').removeClass('hidden'); + } + }, + disableDelete: function() { + if ( _fn.build.form.zone.formCount === 1 ) { + _fn.build.$el.zones.form.find('.remove-zone').addClass('hidden'); + } + }, + setAll: function() { + var zones = [], + $form = _fn.build.$el.zones.form.find('.title'); + + $form.each(function(i, el) { + var val = $(el).val(); + + if ( val.length > 0 ) { + zones.push( val ); + } + }); + + _fn.build.form.zone.list = zones; + _fn.build.form.createDropdown(zones); + }, + clickHandler: function( num ) { + var $div = $('#zone-' + num), + $form = _fn.build.$el.zones.form.find('.zone-row.zone-' + num); + + // Listen to form changes and update zone div position + $form.on('keyup', '.title', function(e) { + var text = $(e.currentTarget).val(), + record = _.findWhere( _fn.build.form.zone.obj, { + index: num + }); + + $div.find('p').html(text); + record.title = text; + + if ( !record.active ) { + record.active = true; + } + }).on('keyup', '.width', function(e) { + var width = $(e.currentTarget).val(), + record = _.findWhere( _fn.build.form.zone.obj, { + index: num + }); + + $div.css('width', width + 'px'); + record.width = width; + }).on('keyup', '.height', function(e) { + var height = $(e.currentTarget).val(), + record = _.findWhere( _fn.build.form.zone.obj, { + index: num + }); + + $div.css('height', height + 'px'); + record.height = height; + }).on('keyup', '.x', function(e) { + var x = $(e.currentTarget).val(), + record = _.findWhere( _fn.build.form.zone.obj, { + index: num + }); + + $div.css('left', x + 'px'); + record.x = x; + }).on('keyup', '.y', function(e) { + var y = $(e.currentTarget).val(), + record = _.findWhere( _fn.build.form.zone.obj, { + index: num + }); + + $div.css('top', y + 'px'); + record.y = y; + }); + }, + cleanObject: function( arr ) { + var clean = [], + i, + len = arr.length; + + for ( i=0; i 1 ) { + _fn.build.$el.items.form.find('.remove-item').removeClass('hidden'); + } + }, + disableDelete: function() { + if ( _fn.build.form.item.count === 1 ) { + _fn.build.$el.items.form.find('.remove-item').addClass('hidden'); + } + } + }, + submit: function() { + var items = [], + $form = _fn.build.$el.items.form.find('.item'); + + $form.each( function(i, el) { + var $el = $(el), + name = $el.find('.item-text').val(); + + if (name.length > 0) { + items.push({ + displayName: name, + zone: $el.find('.zone-select').val(), + id: i, + feedback: { + correct: $el.find('.success-feedback').val(), + incorrect: $el.find('.error-feedback').val() + } + }); + } + }); + + _fn.data.items = items; + _fn.data.zones = _fn.build.form.zone.cleanObject( _fn.build.form.zone.obj ); + _fn.init(); + _fn.build.$el.items.tab.addClass('hidden'); + _fn.$app.removeClass('hidden'); + _fn.$block.children('header, footer').removeClass('hidden'); + } + } + }, + + // DEV-ONLY: For easier testing + reset: function() { + _fn.clickHandlers.drag.reset( _fn.$items ); + _fn.feedback.set( _fn.data.feedback.start ); + _fn.$items.draggable('enable'); + _fn.test.completed = 0; + }, + + finish: function() { + // Disable any decoy items + _fn.$items.draggable('disable'); + + // Show final feedback - append so can still show last item's feedback + _fn.$feedback.append( '
    ' + _fn.data.feedback.finish ); + }, + + clickHandlers: { + init: function( $drag, $dropzone ) { + var clk = _fn.clickHandlers; + + $drag.on( 'dragstart', clk.drag.start ); + $drag.on( 'dragstop', clk.drag.stop ); + + $dropzone.on( 'drop', clk.drop.success ); + $dropzone.on( 'dropover', clk.drop.hover.in ); + $dropzone.on( 'dropout', clk.drop.hover.out ); + + _fn.$block.find('.reset').on('click', _fn.reset ) + }, + drag: { + start: function( event, ui ) { + $(event.currentTarget).removeClass('within-dropzone fade'); + }, + + stop: function( event, ui ) { + var $el = $(event.currentTarget), + val = $el.data('value'), + zone = $el.data('zone') || null; + + if ( $el.hasClass('within-dropzone') && _fn.test.match( val, zone ) ) { + $el.removeClass('hover') + .draggable('disable'); + + _fn.test.completed++; + _fn.feedback.set( _fn.feedback.get(val, true) ); + + if ( _fn.items.allSubmitted() ) { + _fn.finish(); + } + } else { + // Return to original position + _fn.clickHandlers.drag.reset( $el ); + _fn.feedback.set( _fn.feedback.get(val, false) ); + } + }, + + reset: function( $el ) { + $el.removeClass('within-dropzone fade hover') + .css({ + top: '', + left: '' + }); + } + }, + drop: { + hover: { + in: function( event, ui ) { + var zone = $(event.currentTarget).data('zone'); + + ui.draggable.addClass('hover').data('zone', zone); + }, + out: function( event, ui ) { + ui.draggable.removeClass('hover'); + } + }, + success: function( event, ui ) { + ui.draggable.addClass('within-dropzone') + } + } + }, + + items: { + count: 0, + init: function() { + var items = _fn.data.items, + i, + len = items.length, + total = 0; + + for ( i=0; i')[0]) ); + }, + shim: function(opts) { + var config = { + color: '#888', + cls: 'placeholder', + selector: 'input[placeholder], textarea[placeholder]' + }; + $.extend(config,opts); + return !this.browser_supported() && $(config.selector)._placeholder_shim(config); + } + }}); + + $.extend($.fn,{ + _placeholder_shim: function(config) { + function calcPositionCss(target) + { + var op = $(target).offsetParent().offset(); + var ot = $(target).offset(); + + return { + top: ot.top - op.top, + left: ot.left - op.left, + width: $(target).width() + }; + } + function adjustToResizing(label) { + var $target = label.data('target'); + if(typeof $target !== "undefined") { + label.css(calcPositionCss($target)); + $(window).one("resize", function () { adjustToResizing(label); }); + } + } + return this.each(function() { + var $this = $(this); + + if( $this.is(':visible') ) { + + if( $this.data('placeholder') ) { + var $ol = $this.data('placeholder'); + $ol.css(calcPositionCss($this)); + return true; + } + + var possible_line_height = {}; + if( !$this.is('textarea') && $this.css('height') != 'auto') { + possible_line_height = { lineHeight: $this.css('height'), whiteSpace: 'nowrap' }; + } + + var isBorderBox = ($this.css('box-sizing') === 'border-box'); + + var ol = $('