From e1095b3d4afea40ed80f0c69e4b5e8dd9716d030 Mon Sep 17 00:00:00 2001
From: Sam El-Husseini <16690124+samelhusseini@users.noreply.github.com>
Date: Tue, 1 May 2018 14:12:42 -0400
Subject: [PATCH] Integrating field music icons (#549)
* Use the music icons provided by lego in the music field editor
---
fieldeditors/field_music.ts | 15 +-
legoresources/musicicons/animals.svg | 107 ++++
legoresources/musicicons/colors.svg | 117 ++++
legoresources/musicicons/communication.svg | 107 ++++
legoresources/musicicons/expressions.svg | 116 ++++
legoresources/musicicons/information.svg | 128 ++++
legoresources/musicicons/mechanical.svg | 125 ++++
legoresources/musicicons/movements.svg | 124 ++++
legoresources/musicicons/numbers.svg | 139 ++++
legoresources/musicicons/sounds_icons_2.ai | 633 +++++++++++++++++++
legoresources/musicicons/system.svg | 194 ++++++
libs/music/icons.jres | 33 +
libs/music/jres/icons/animals-icon.png | Bin 0 -> 2169 bytes
libs/music/jres/icons/colors-icon.png | Bin 0 -> 3257 bytes
libs/music/jres/icons/communication-icon.png | Bin 0 -> 2383 bytes
libs/music/jres/icons/expressions-icon.png | Bin 0 -> 2778 bytes
libs/music/jres/icons/information-icon.png | Bin 0 -> 2524 bytes
libs/music/jres/icons/mechanical-icon.png | Bin 0 -> 2885 bytes
libs/music/jres/icons/movements-icon.png | Bin 0 -> 1939 bytes
libs/music/jres/icons/numbers-icon.png | Bin 0 -> 1972 bytes
libs/music/jres/icons/system-icon.png | Bin 0 -> 1842 bytes
libs/music/pxt.json | 1 +
22 files changed, 1836 insertions(+), 3 deletions(-)
create mode 100644 legoresources/musicicons/animals.svg
create mode 100644 legoresources/musicicons/colors.svg
create mode 100644 legoresources/musicicons/communication.svg
create mode 100644 legoresources/musicicons/expressions.svg
create mode 100644 legoresources/musicicons/information.svg
create mode 100644 legoresources/musicicons/mechanical.svg
create mode 100644 legoresources/musicicons/movements.svg
create mode 100644 legoresources/musicicons/numbers.svg
create mode 100644 legoresources/musicicons/sounds_icons_2.ai
create mode 100644 legoresources/musicicons/system.svg
create mode 100644 libs/music/icons.jres
create mode 100644 libs/music/jres/icons/animals-icon.png
create mode 100644 libs/music/jres/icons/colors-icon.png
create mode 100644 libs/music/jres/icons/communication-icon.png
create mode 100644 libs/music/jres/icons/expressions-icon.png
create mode 100644 libs/music/jres/icons/information-icon.png
create mode 100644 libs/music/jres/icons/mechanical-icon.png
create mode 100644 libs/music/jres/icons/movements-icon.png
create mode 100644 libs/music/jres/icons/numbers-icon.png
create mode 100644 libs/music/jres/icons/system-icon.png
diff --git a/fieldeditors/field_music.ts b/fieldeditors/field_music.ts
index 96028db4..ac3759e1 100644
--- a/fieldeditors/field_music.ts
+++ b/fieldeditors/field_music.ts
@@ -10,6 +10,7 @@ export interface FieldMusicOptions extends pxtblockly.FieldImagesOptions {
declare const pxtTargetBundle: any;
let soundCache: any;
+let soundIconCache: any;
export class FieldMusic extends pxtblockly.FieldImages implements Blockly.FieldCustom {
public isFieldCustom_ = true;
@@ -18,8 +19,6 @@ export class FieldMusic extends pxtblockly.FieldImages implements Blockly.FieldC
private categoriesCache_: string[];
- private static MUSIC_DATA_URI = `data:image/svg+xml;base64,PHN2ZyBpZD0ic3ZnNDEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDIzIDIzIj48cGF0aCBpZD0ibWVudV9pY25fbXVzaWMiIGQ9Ik0xMy45IDEyLjhjMS43LjMgMy4zIDEuMiA0LjMgMi42aDFzMS41LTQuNC0xLjgtNy41LTkuNy0zLjEtMTIuMSAwYy0xLjcgMi4xLTIuMyA1LTEuNCA3LjVoLjhzMS43LTIuNSA0LjQtMi42QzkgMTcuMiA5IDIxIDkgMjFjLTEuOS0uNC0zLjUtMS42LTQuNC0zLjQtMi0uNC0zLjYtMi4yLTMuNi00LjRDMSA2LjcgNS45IDMgMTEuNSAzczEwLjggNC4zIDEwLjQgMTAuMmMtLjIgNC4xLTMuNiA0LjQtMy42IDQuNC0uOCAxLjgtMi40IDMuMS00LjMgMy40LS4xLTQuNS0uMS04LjItLjEtOC4yeiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg==`;
-
constructor(text: string, options: FieldMusicOptions, validator?: Function) {
super(text, { sort: true, data: options.data }, validator);
@@ -33,6 +32,9 @@ export class FieldMusic extends pxtblockly.FieldImages implements Blockly.FieldC
if (!pxt.BrowserUtils.isIE() && !soundCache) {
soundCache = JSON.parse(pxtTargetBundle.bundledpkgs['music']['sounds.jres']);
}
+ if (!soundIconCache) {
+ soundIconCache = JSON.parse(pxtTargetBundle.bundledpkgs['music']['icons.jres']);
+ }
}
/**
@@ -214,7 +216,7 @@ export class FieldMusic extends pxtblockly.FieldImages implements Blockly.FieldC
contentDiv.removeAttribute('aria-activedescendant');
});
let buttonImg = document.createElement('img');
- buttonImg.src = FieldMusic.MUSIC_DATA_URI;
+ buttonImg.src = this.getSoundIcon(category);
//buttonImg.alt = icon.alt;
// Upon click/touch, we will be able to get the clicked element as e.target
// Store a data attribute on all possible click targets so we can match it to the icon.
@@ -308,4 +310,11 @@ export class FieldMusic extends pxtblockly.FieldImages implements Blockly.FieldC
private stopSounds() {
pxsim.AudioContextManager.stop();
}
+
+ private getSoundIcon(category: string) {
+ if (soundIconCache && soundIconCache[category]) {
+ return soundIconCache[category].icon;
+ }
+ return undefined;
+ }
}
diff --git a/legoresources/musicicons/animals.svg b/legoresources/musicicons/animals.svg
new file mode 100644
index 00000000..8cadd615
--- /dev/null
+++ b/legoresources/musicicons/animals.svg
@@ -0,0 +1,107 @@
+
+
+
+
diff --git a/legoresources/musicicons/colors.svg b/legoresources/musicicons/colors.svg
new file mode 100644
index 00000000..e97f7662
--- /dev/null
+++ b/legoresources/musicicons/colors.svg
@@ -0,0 +1,117 @@
+
+
+
+
diff --git a/legoresources/musicicons/communication.svg b/legoresources/musicicons/communication.svg
new file mode 100644
index 00000000..8649ed75
--- /dev/null
+++ b/legoresources/musicicons/communication.svg
@@ -0,0 +1,107 @@
+
+
+
+
diff --git a/legoresources/musicicons/expressions.svg b/legoresources/musicicons/expressions.svg
new file mode 100644
index 00000000..7c5f84e1
--- /dev/null
+++ b/legoresources/musicicons/expressions.svg
@@ -0,0 +1,116 @@
+
+
+
+
diff --git a/legoresources/musicicons/information.svg b/legoresources/musicicons/information.svg
new file mode 100644
index 00000000..f9412f98
--- /dev/null
+++ b/legoresources/musicicons/information.svg
@@ -0,0 +1,128 @@
+
+
+
+
diff --git a/legoresources/musicicons/mechanical.svg b/legoresources/musicicons/mechanical.svg
new file mode 100644
index 00000000..5842ad9d
--- /dev/null
+++ b/legoresources/musicicons/mechanical.svg
@@ -0,0 +1,125 @@
+
+
+
+
diff --git a/legoresources/musicicons/movements.svg b/legoresources/musicicons/movements.svg
new file mode 100644
index 00000000..c602c748
--- /dev/null
+++ b/legoresources/musicicons/movements.svg
@@ -0,0 +1,124 @@
+
+
+
+
diff --git a/legoresources/musicicons/numbers.svg b/legoresources/musicicons/numbers.svg
new file mode 100644
index 00000000..e9e1e6f6
--- /dev/null
+++ b/legoresources/musicicons/numbers.svg
@@ -0,0 +1,139 @@
+
+
+
+
diff --git a/legoresources/musicicons/sounds_icons_2.ai b/legoresources/musicicons/sounds_icons_2.ai
new file mode 100644
index 00000000..a89f1122
--- /dev/null
+++ b/legoresources/musicicons/sounds_icons_2.ai
@@ -0,0 +1,633 @@
+%PDF-1.5
%âãÏÓ
+1 0 obj
<>/OCGs[5 0 R 6 0 R 7 0 R 8 0 R 9 0 R 10 0 R 11 0 R 12 0 R 13 0 R 14 0 R 15 0 R 16 0 R 17 0 R 18 0 R 19 0 R 20 0 R 21 0 R 22 0 R 23 0 R 24 0 R 25 0 R 26 0 R 27 0 R 28 0 R 29 0 R 30 0 R 31 0 R 32 0 R 110 0 R 111 0 R 112 0 R 113 0 R 114 0 R 115 0 R 116 0 R 117 0 R 118 0 R 119 0 R 120 0 R 121 0 R 122 0 R 123 0 R 124 0 R 125 0 R 126 0 R 127 0 R 128 0 R]>>/Pages 3 0 R/Type/Catalog>>
endobj
2 0 obj
<>stream
+
+
+
+
+ xmp.did:568309c5-b0de-42e8-9d0c-5f69b0a05445
+ uuid:2169725c-7891-144e-a80c-d1087aadd4cb
+ xmp.did:af2d7283-7fe2-4841-b029-0ac5306ad7a8
+ proof:pdf
+
+ xmp.iid:af2d7283-7fe2-4841-b029-0ac5306ad7a8
+ xmp.did:af2d7283-7fe2-4841-b029-0ac5306ad7a8
+ xmp.did:af2d7283-7fe2-4841-b029-0ac5306ad7a8
+ proof:pdf
+
+
+
+
+ saved
+ xmp.iid:af2d7283-7fe2-4841-b029-0ac5306ad7a8
+ 2018-04-19T12:10:09+02:00
+ Adobe Illustrator CC 22.1 (Macintosh)
+ /
+
+
+ saved
+ xmp.iid:568309c5-b0de-42e8-9d0c-5f69b0a05445
+ 2018-04-24T20:00:40+02:00
+ Adobe Illustrator CC 22.1 (Macintosh)
+ /
+
+
+
+ application/pdf
+ Adobe Illustrator CC 22.1 (Macintosh)
+ 2018-04-24T20:00:40+02:00
+ 2018-04-24T20:02:01+02:00
+ 2018-04-24T20:02:01+02:00
+
+
+
+ 256
+ 80
+ JPEG
+ /9j/4AAQSkZJRgABAgEASABIAAD/7QAsUGhvdG9zaG9wIDMuMAA4QklNA+0AAAAAABAASAAAAAEA
AQBIAAAAAQAB/+4ADkFkb2JlAGTAAAAAAf/bAIQABgQEBAUEBgUFBgkGBQYJCwgGBggLDAoKCwoK
DBAMDAwMDAwQDA4PEA8ODBMTFBQTExwbGxscHx8fHx8fHx8fHwEHBwcNDA0YEBAYGhURFRofHx8f
Hx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8f/8AAEQgAUAEAAwER
AAIRAQMRAf/EAaIAAAAHAQEBAQEAAAAAAAAAAAQFAwIGAQAHCAkKCwEAAgIDAQEBAQEAAAAAAAAA
AQACAwQFBgcICQoLEAACAQMDAgQCBgcDBAIGAnMBAgMRBAAFIRIxQVEGE2EicYEUMpGhBxWxQiPB
UtHhMxZi8CRygvElQzRTkqKyY3PCNUQnk6OzNhdUZHTD0uIIJoMJChgZhJRFRqS0VtNVKBry4/PE
1OT0ZXWFlaW1xdXl9WZ2hpamtsbW5vY3R1dnd4eXp7fH1+f3OEhYaHiImKi4yNjo+Ck5SVlpeYmZ
qbnJ2en5KjpKWmp6ipqqusra6voRAAICAQIDBQUEBQYECAMDbQEAAhEDBCESMUEFURNhIgZxgZEy
obHwFMHR4SNCFVJicvEzJDRDghaSUyWiY7LCB3PSNeJEgxdUkwgJChgZJjZFGidkdFU38qOzwygp
0+PzhJSktMTU5PRldYWVpbXF1eX1RlZmdoaWprbG1ub2R1dnd4eXp7fH1+f3OEhYaHiImKi4yNjo
+DlJWWl5iZmpucnZ6fkqOkpaanqKmqq6ytrq+v/aAAwDAQACEQMRAD8A9U4q7FXYq7FXYq7FXYq7
FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7F
XYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FX
Yq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXY
q7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq
7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7
FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7F
XYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FX
Yq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXY
q7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq
7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7
FXYq7FXYq7FXYq7FXYq7FX//2Q==
+
+
+
+ 1
+ False
+ False
+
+ 4880.568933
+ 2662.542062
+ Pixels
+
+
+
+
+ Default Swatch Group
+ 0
+
+
+
+ K=51
+ PROCESS
+ 100.000000
+ RGB
+ 124
+ 124
+ 124
+
+
+ K=51 1
+ PROCESS
+ 100.000000
+ RGB
+ 124
+ 124
+ 124
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
endstream
endobj
3 0 obj
<>
endobj
34 0 obj
<>/Resources<>/Properties<>>>/Thumb 133 0 R/TrimBox[0.0 0.0 4880.57 2662.54]/Type/Page>>
endobj
130 0 obj
<>stream
+H‰Ü—ÍŽ·…÷÷)ú.Åß"¹xeŽy !ñF2àH ·ÏwªØš)^8Þ‚=—Ý$»~N:õîÏï¯wß¿Ï×þøþzüé{þ÷.•xôË#_Õ¬¦ÑëÕ×Êiؾž_ýão¿^??ÊõÓãÝw?æë§>~¹Ê•ùW®ºkMyŒ}Õ¼-ÕÜìúðé¡—ŸÏÕR+›ßùm©™~?×NeôëYR±v=wIuÎëÙ¸§_|g¼ß©òme¦RÊ˺Ždkúþó¤õ´–NXšu\Ï®ç•{jjÛXïdméÄΩlÞŒÊß8±>–Vµë¶û^ÀŸû÷LJ%û²*\ÒWê÷ÏrökÁýÇHýÒ¡ìÿ><þþøáM'ž[YWÙm¥UrÁÚSÁK`Ëiúïg3ª‹ïß|ÇÎâüùøåA¯~ô¾“õô¾ý,åæùé^ær/¹üÜÀ¯s¥;yûx\Ìåל\$¡¯=~«“땓뵓ëk'×ÿæäouñWÌüÎýÿå`¹ôï/ß=æõïë»ÐDÛcQöc¤])ä/îf/ >>~ü
+ëpJ«Ù8V(okåÍ1ê1ïÿrlB-ÛzùÇ,õ9^N³´0:{jñ‰1*‡l%2úšÐpº¯ëiNŒö*ðÄÄêóƒYD•‚h~Z¢$0èï±jSšõ¤w]ÓÚy?®Gu]¦kT†S—¾Ñ—Sf«Û?\E˜ÚÊE#åeZÍEû~«‹Ò,v5÷_&BøU¯¹½ N/¡ò “ûr©$«g3_©;aíÀYG`2Ù]yÖö+ƒªÎ=˜2…eÉõe9“‰u_¶÷DcHÝ_€y‡ÏúÅP¹¦Š_K‡c¥L!Ü»®—Ë#)*&ÚLQʺÉ|[Cßî+–r1ûF½¢1DÉ¥¿ÐT„›¢,ÒSÑY~P®ç^÷‡]ÀÆú)?€-sé'·c®}?PsÚ„³¨óÔ—%+ïigý,êŠ*ù8-«ji×}ý½ÖÓú²Ä‡†A÷é³¼/¿—çÓ:x[õÖêà€×’¡†døáwŠ†¶Èø¨
´uî_jLxí‚à mÜV<,Jýœ4¥',‘Iz>ôºVŽ)íÚ„[‰‘SID‹{"ðaeú@Q-ùK·‚Ýøô„.s8v奥¢" 1äÐ,Ž\´ ĉ݆ï.|“+ÌKߊˆ„Št si™‡&»03Wõ‹”;+0Äw(^6Âg8 ›²*wU¡Êp„ò©Ú†NêÄÍEQºDv©*UTÃ4 ”·!/Z:õ¢hPëd´‡‰û©x˜<ç¡mÒ4ÌCM4ÐÔ‚&ØlÃÔfú(³Il$³0”°Üb‘A%BKl§ÿk»…wÖ#Ãq^,ÉtÑBø†O[÷J˜‚VÓƒ&YRwƒp(í³D]í†Ñ1ž,IÈ©šÆ=“u¸§ ™ñ–CƒB×ßnË>½{='¬¨#s°ÏÔG›\ãt]Xmþ11o›t–c¹H®b6ºIÆCè+«’å7hJ£G\Ì_P‚UdJÀ¶E•š¯“AÔt”’Z˜.Ó]Äx³*¾¸CG¾D»êM݇{¦¿_â’d[EižÏéõ"ú_¡L$ïÁ‹/‰hP=fx‰ÐÁ%Ñ×òÓs;¶F´þ@À’×h4(*ø=QøTMs[XÒéŬoC,£k“.jH
¹¸-<=Dã¬ã
+£¨Ö˜„\ª\œÝÅÊ5Å\—P¼½ö|+”Ò½«Hi¯>é-ª:!‘ª§;Ö}F)ŽÜ4yP´æžQ.r¸*UË%NmÅ×jo‘Óå¥Y¥y¤»ßhU"Äcºq:嬷yh©‹¬É‘¦ jþm¬ÙÛç¨âSŒèLó¤YœÐ|Ââ[M“àuZDb¶ìŽññð'â.Õ¾ÈkSŠß,F1}JT¡%0+1UÄêÊ49-–á`ô çRyÆwG,k=vÝÙé•zŽÖfKÜY}ðMrGä§Ä»-Lh¡²×¦°å'(gÂ,ú«ô
+m8‚ԪʿÅõ-EŸLûlJñï-|õT»µ $Sd(èPBA³?h‚Ôdº4÷k…?iëîãm‰“KÌ)9ÅÕÎ šG=RΙ#$û¬~kÙ ªiÞv¶ÓÃNQ{:PH¨—ÿ:²J8åcp8e+ Ö¼vÚEUq:íÙƒ³î„W±[ÎQ¢ý&ñÁµozÔ7CUËàe©SØʵ¯uÂ’ÜBA'S;Ä·Ô ×Kß7[㈀âÆ9t"ƒžÔêô¼¯§kµ£J³‰#z¢r a]¸UÑ×X‡Ž%#C¥èO:â áP@è:Øg?„µrí°àœÞÃmF·g8°º“Üõ3VÓ¬£4ù+u#€•˜B¢ÀèJMð5zêÈòXyv7G8>··æAU…Ù!ŒÒ§L¡Ñc ¦ò¼U¬$ ¼³¥³*ÝUΉΈvøôQ¬{<‡â*1•##'“mÕ[-)îq»ªZSB(æKåèÝi_•$
·.Í)Ó¦
+a"Fvq@²æ¤ŠèV½ÜšŒU°Q] ‚°Iv4=Ò4æhä NÚª3XÄîûÑþ¡Ù%œ¨ýÓ
àˆ%™M× þØvr/5Kèeè0'–ª¨'ŠEÁàpö,R“4a(Á¦e»hëP#G1D$¥››T‚ú·š¤ÅrûîéÀÑî¶Nëé S~hB$—´p ™¡n¯À”;åªx9í Ñ`ÇÕU™=FM)^±{º<¡‹8aM%Ú´t{m‘n(Œ¦²›
+¿üÃMÈa{J†H^ԘļýK]@W
ÃzÄMÓ ÁåµCLÃÛÔÙÈj®6Ä:ò˜ªÄBmÓÁ®“§Wú
c›‰lÔ8L/o²ÑÐàCd43ŠÉJ.ŒÞÔÛXv6/‚ɲE_Ò4!¦”ÇÕuõâßòÚgš5êö§ÚNÊ"ö£Ìhß
+çWÍ'ÄMi(qÑaøIç½=ðl‘4º¾Š5#!EcþioÌ
+ââGƪ$ÏÀnp"yäºgŠÜuŽk.²,¥ÊðA–%¡gÌjï”’®‡›Vñ±Ã•Æ- Ÿ!œ}1æìQoæ‚‘Ó±ºâÖö%=B±œËÌÚÑfYfí°dºüšŠ—ãL–DëVB± ÄA}9·ùÊÞàî¥(zŸíz BYYÃOwÑ+IØÓMhBÚͺ£èZ %βd/6¤7 2[ª»¹±Šˆ$ɉ…ð¶æLèRNãš›¤ðS3\ô~ÅCBd‰‡ÔB(š½bè
+EÜçâEF®hœ ¡…h0W°Ý-Pn›ÑŠä-hÕ¤ $øRu‚’JVfjv†çT@ˆÏ²ä×Ö`ÚMZÚb ”l‡É6U¨Å~£j&™£iRèjùµÈGß;¤(àU„W*ŸUÀ9úaVŒ·†Wªtš¶ÅÿŽÞN
/5Ò‘NãÕm1!}vç¬uýëe“#ÇDá}¢.Ðä?¹µlx%xá… ÚŒ¼°9ÿ¼ï³ºª-µ5š«#+É$#âý9Q±'TÞÝÌŠ‹_…W…-¼³š‹¼ÍÃm#;ÿS’Ž(
$òõß>AÅNá šia¨NC…‰É/4Iê´ÍY—Ï û‡¯ò$&XyÝ(Ïm\„Éåß!ï[8