[{"data":1,"prerenderedAt":84031},["ShallowReactive",2],{"article_list_ckeefer_":3},[4,3520,3839,4450,7327,8799,9499,12727,13797,17533,18909,21542,23208,26512,32571,32934,35811,35973,38066,39200,40886,46728,49371,50921,55750,58422,58662,59686,59988,62823,64583,67005,69099,69891,70542,80639],{"_path":5,"_dir":6,"_draft":7,"_partial":7,"_locale":8,"title":9,"description":10,"excerpt":10,"tags":11,"image":15,"publishDate":16,"body":17,"_type":3511,"_id":3512,"_source":3513,"_file":3514,"_stem":3515,"_extension":3516,"author":3517},"/ckeefer/2024-7/vpubsub","2024-7",false,"","Vue 3 Pub / Sub: All aboard the (event) bus","We like Vue at A+L. We think it's one of the best frontend frameworks, and a great choice pretty much anywhere you might otherwise be tempted to use React.",[12,13,14],"js","vue","pub/sub","/ckeefer/2024-7/img/event_bus.png","2024-08-15",{"type":18,"children":19,"toc":3495},"root",[20,45,50,57,79,84,99,104,134,139,144,149,163,169,192,199,583,589,610,928,934,954,1072,1078,1091,1466,1485,1491,1496,1502,1515,1600,1613,1753,1758,1897,1902,1938,1965,1970,2823,2872,2877,2890,3407,3413,3456,3462,3467,3489],{"type":21,"tag":22,"props":23,"children":24},"element","p",{},[25,28,35,37,43],{"type":26,"value":27},"text","We ",{"type":21,"tag":29,"props":30,"children":32},"a",{"href":31},"/search/user:ckeefer/why/vue",[33],{"type":26,"value":34},"like Vue at A+L",{"type":26,"value":36},". We think it's ",{"type":21,"tag":29,"props":38,"children":40},{"href":39},"/search/user:phendry/frontend/frameworks/in/2024",[41],{"type":26,"value":42},"one of the best frontend frameworks",{"type":26,"value":44},", and a great choice pretty much anywhere you might otherwise be tempted to use React.",{"type":21,"tag":22,"props":46,"children":47},{},[48],{"type":26,"value":49},"That said, it's not going to solve every need out of the box. Its robust ecosystem is actually one of its strongest points; chances are that a decent option (or more than one) exists to satisfy a variety of common needs. Let's talk today about our own contribution to this flourishing ecosystem, and why you'd want to use it.",{"type":21,"tag":51,"props":52,"children":54},"h3",{"id":53},"hit-that-subscribe-button",[55],{"type":26,"value":56},"Hit That Subscribe Button",{"type":21,"tag":22,"props":58,"children":59},{},[60,62,69,71,77],{"type":26,"value":61},"In Vue, you've probably run into cases where you need one component to know about some event, or gain access to some bit of data, that's sequestered off in another component. If they were in relationship with one another - parent -> child, or grandparent -> parent -> child, etc., you could ",{"type":21,"tag":63,"props":64,"children":66},"code",{"className":65},[],[67],{"type":26,"value":68},"$emit",{"type":26,"value":70}," an event; and you can send data back down the other way through ",{"type":21,"tag":63,"props":72,"children":74},{"className":73},[],[75],{"type":26,"value":76},"props",{"type":26,"value":78}," (although this can sometimes be a little awkward). Crossing from one unrelated component to another, though, is a problem Vue isn't going to directly help you with.",{"type":21,"tag":22,"props":80,"children":81},{},[82],{"type":26,"value":83},"We don't want to couple our disparate components though, by directly sharing data or having one call the other - that's nasty design that limits their flexibility and reusability.",{"type":21,"tag":22,"props":85,"children":86},{},[87,89,97],{"type":26,"value":88},"One way we can solve this conundrum is with data stores, like vuex or ",{"type":21,"tag":29,"props":90,"children":94},{"href":91,"rel":92},"https://pinia.vuejs.org/",[93],"nofollow",[95],{"type":26,"value":96},"pinia",{"type":26,"value":98}," - we've been using the latter to good effect. There's an upcoming article there - but this isn't that one.",{"type":21,"tag":22,"props":100,"children":101},{},[102],{"type":26,"value":103},"In this one, let's talk about another way we can communicate between disparate components: the event bus, or rather it's older cousin, the Publish / Subscribe pattern.",{"type":21,"tag":22,"props":105,"children":106},{},[107,109,116,118,124,126,132],{"type":26,"value":108},"The ",{"type":21,"tag":29,"props":110,"children":113},{"href":111,"rel":112},"https://en.wikipedia.org/wiki/Publish%E2%80%93subscribe_pattern",[93],[114],{"type":26,"value":115},"Publish/Subscribe pattern",{"type":26,"value":117}," allows you to ",{"type":21,"tag":63,"props":119,"children":121},{"className":120},[],[122],{"type":26,"value":123},"subscribe",{"type":26,"value":125}," to messages of interest, and ",{"type":21,"tag":63,"props":127,"children":129},{"className":128},[],[130],{"type":26,"value":131},"publish",{"type":26,"value":133}," those same messages from elsewhere within your application - your subscribers then receive these messages (via callback functions).",{"type":21,"tag":22,"props":135,"children":136},{},[137],{"type":26,"value":138},"If you're not familiar with this pattern, it's a very flexible form of event handling. It allows communications between different components or services while keeping them decoupled - the publisher of an event never needs to know the identity of any potential subscribers, and vice-versa.",{"type":21,"tag":22,"props":140,"children":141},{},[142],{"type":26,"value":143},"Keeping components of your application from being tightly coupled is generally good design, but you'll need to consider whether it's appropriate and helpful in your particular use-case - no tool is always the right tool, not every problem is a nail in want of a hammer. Pub/sub can become a problem in a complex application where events are coming in hot-and-heavy, because it can be difficult to track down just where any given event is coming from.",{"type":21,"tag":22,"props":145,"children":146},{},[147],{"type":26,"value":148},"You should be careful in making events easily referenceable (e.g. don't use a bare string as your key, have a central place where all event names are visible and importable from), and opt for single-hops as often as possible (e.g. avoid having an event publication trigger a subscriber to publish another event which causes a subscriber to publish another event, etc. - instead, have a single publication trigger subscribers, without allowing the subscribers to publish their own events in turn).",{"type":21,"tag":22,"props":150,"children":151},{},[152,154,161],{"type":26,"value":153},"If you know pub/sub is what you need, or you're considering it, you may want to check out our plugin, ",{"type":21,"tag":29,"props":155,"children":158},{"href":156,"rel":157},"https://www.npmjs.com/package/vpubsub",[93],[159],{"type":26,"value":160},"VPubSub",{"type":26,"value":162},". You can use it with or without Vue; and if you use it with Vue, it does a little extra magic to make your life easier. Let's dive in.",{"type":21,"tag":51,"props":164,"children":166},{"id":165},"how-does-it-work",[167],{"type":26,"value":168},"How Does It Work?",{"type":21,"tag":22,"props":170,"children":171},{},[172,174,181,183,190],{"type":26,"value":173},"Let's look at some common and uncommon use-cases, both in general, and then including Vue - both with the ",{"type":21,"tag":29,"props":175,"children":178},{"href":176,"rel":177},"https://vuejs.org/api/#options-api",[93],[179],{"type":26,"value":180},"Options API",{"type":26,"value":182},", and the ",{"type":21,"tag":29,"props":184,"children":187},{"href":185,"rel":186},"https://vuejs.org/api/#composition-api",[93],[188],{"type":26,"value":189},"Composition API",{"type":26,"value":191},":",{"type":21,"tag":193,"props":194,"children":196},"h4",{"id":195},"subscribe-to-a-single-event",[197],{"type":26,"value":198},"Subscribe to a single event",{"type":21,"tag":200,"props":201,"children":204},"pre",{"className":202,"code":203,"language":12,"meta":8,"style":8},"language-js shiki shiki-themes github-light github-dark","import {vent} from \"vpubsub\";\n\nconst EVENTS = {\n    PLAYER:{\n        START:'start.player',\n        END:'end.player',\n    }\n};\n\nvent.on(EVENTS.PLAYER.START, (arg1, arg2, ...rst) => {\n    // Do something useful with the event and arguments.\n    // The arguments will be whatever was passed during the call to `trigger`.\n});\n\n// ... elsewhere in your application ...\nvent.trigger(EVENTS.PLAYER.START, 'event', 'args', 40, 'or', 'as', 'many as you like',)\n",[205],{"type":21,"tag":63,"props":206,"children":207},{"__ignoreMap":8},[208,242,252,277,286,305,323,332,341,349,442,452,461,470,478,487],{"type":21,"tag":209,"props":210,"children":213},"span",{"class":211,"line":212},"line",1,[214,220,226,231,237],{"type":21,"tag":209,"props":215,"children":217},{"style":216},"--shiki-default:#D73A49;--shiki-dark:#F97583",[218],{"type":26,"value":219},"import",{"type":21,"tag":209,"props":221,"children":223},{"style":222},"--shiki-default:#24292E;--shiki-dark:#E1E4E8",[224],{"type":26,"value":225}," {vent} ",{"type":21,"tag":209,"props":227,"children":228},{"style":216},[229],{"type":26,"value":230},"from",{"type":21,"tag":209,"props":232,"children":234},{"style":233},"--shiki-default:#032F62;--shiki-dark:#9ECBFF",[235],{"type":26,"value":236}," \"vpubsub\"",{"type":21,"tag":209,"props":238,"children":239},{"style":222},[240],{"type":26,"value":241},";\n",{"type":21,"tag":209,"props":243,"children":245},{"class":211,"line":244},2,[246],{"type":21,"tag":209,"props":247,"children":249},{"emptyLinePlaceholder":248},true,[250],{"type":26,"value":251},"\n",{"type":21,"tag":209,"props":253,"children":255},{"class":211,"line":254},3,[256,261,267,272],{"type":21,"tag":209,"props":257,"children":258},{"style":216},[259],{"type":26,"value":260},"const",{"type":21,"tag":209,"props":262,"children":264},{"style":263},"--shiki-default:#005CC5;--shiki-dark:#79B8FF",[265],{"type":26,"value":266}," EVENTS",{"type":21,"tag":209,"props":268,"children":269},{"style":216},[270],{"type":26,"value":271}," =",{"type":21,"tag":209,"props":273,"children":274},{"style":222},[275],{"type":26,"value":276}," {\n",{"type":21,"tag":209,"props":278,"children":280},{"class":211,"line":279},4,[281],{"type":21,"tag":209,"props":282,"children":283},{"style":222},[284],{"type":26,"value":285},"    PLAYER:{\n",{"type":21,"tag":209,"props":287,"children":289},{"class":211,"line":288},5,[290,295,300],{"type":21,"tag":209,"props":291,"children":292},{"style":222},[293],{"type":26,"value":294},"        START:",{"type":21,"tag":209,"props":296,"children":297},{"style":233},[298],{"type":26,"value":299},"'start.player'",{"type":21,"tag":209,"props":301,"children":302},{"style":222},[303],{"type":26,"value":304},",\n",{"type":21,"tag":209,"props":306,"children":308},{"class":211,"line":307},6,[309,314,319],{"type":21,"tag":209,"props":310,"children":311},{"style":222},[312],{"type":26,"value":313},"        END:",{"type":21,"tag":209,"props":315,"children":316},{"style":233},[317],{"type":26,"value":318},"'end.player'",{"type":21,"tag":209,"props":320,"children":321},{"style":222},[322],{"type":26,"value":304},{"type":21,"tag":209,"props":324,"children":326},{"class":211,"line":325},7,[327],{"type":21,"tag":209,"props":328,"children":329},{"style":222},[330],{"type":26,"value":331},"    }\n",{"type":21,"tag":209,"props":333,"children":335},{"class":211,"line":334},8,[336],{"type":21,"tag":209,"props":337,"children":338},{"style":222},[339],{"type":26,"value":340},"};\n",{"type":21,"tag":209,"props":342,"children":344},{"class":211,"line":343},9,[345],{"type":21,"tag":209,"props":346,"children":347},{"emptyLinePlaceholder":248},[348],{"type":26,"value":251},{"type":21,"tag":209,"props":350,"children":352},{"class":211,"line":351},10,[353,358,364,369,374,379,384,388,393,398,404,409,414,418,423,428,433,438],{"type":21,"tag":209,"props":354,"children":355},{"style":222},[356],{"type":26,"value":357},"vent.",{"type":21,"tag":209,"props":359,"children":361},{"style":360},"--shiki-default:#6F42C1;--shiki-dark:#B392F0",[362],{"type":26,"value":363},"on",{"type":21,"tag":209,"props":365,"children":366},{"style":222},[367],{"type":26,"value":368},"(",{"type":21,"tag":209,"props":370,"children":371},{"style":263},[372],{"type":26,"value":373},"EVENTS",{"type":21,"tag":209,"props":375,"children":376},{"style":222},[377],{"type":26,"value":378},".",{"type":21,"tag":209,"props":380,"children":381},{"style":263},[382],{"type":26,"value":383},"PLAYER",{"type":21,"tag":209,"props":385,"children":386},{"style":222},[387],{"type":26,"value":378},{"type":21,"tag":209,"props":389,"children":390},{"style":263},[391],{"type":26,"value":392},"START",{"type":21,"tag":209,"props":394,"children":395},{"style":222},[396],{"type":26,"value":397},", (",{"type":21,"tag":209,"props":399,"children":401},{"style":400},"--shiki-default:#E36209;--shiki-dark:#FFAB70",[402],{"type":26,"value":403},"arg1",{"type":21,"tag":209,"props":405,"children":406},{"style":222},[407],{"type":26,"value":408},", ",{"type":21,"tag":209,"props":410,"children":411},{"style":400},[412],{"type":26,"value":413},"arg2",{"type":21,"tag":209,"props":415,"children":416},{"style":222},[417],{"type":26,"value":408},{"type":21,"tag":209,"props":419,"children":420},{"style":216},[421],{"type":26,"value":422},"...",{"type":21,"tag":209,"props":424,"children":425},{"style":400},[426],{"type":26,"value":427},"rst",{"type":21,"tag":209,"props":429,"children":430},{"style":222},[431],{"type":26,"value":432},") ",{"type":21,"tag":209,"props":434,"children":435},{"style":216},[436],{"type":26,"value":437},"=>",{"type":21,"tag":209,"props":439,"children":440},{"style":222},[441],{"type":26,"value":276},{"type":21,"tag":209,"props":443,"children":445},{"class":211,"line":444},11,[446],{"type":21,"tag":209,"props":447,"children":449},{"style":448},"--shiki-default:#6A737D;--shiki-dark:#6A737D",[450],{"type":26,"value":451},"    // Do something useful with the event and arguments.\n",{"type":21,"tag":209,"props":453,"children":455},{"class":211,"line":454},12,[456],{"type":21,"tag":209,"props":457,"children":458},{"style":448},[459],{"type":26,"value":460},"    // The arguments will be whatever was passed during the call to `trigger`.\n",{"type":21,"tag":209,"props":462,"children":464},{"class":211,"line":463},13,[465],{"type":21,"tag":209,"props":466,"children":467},{"style":222},[468],{"type":26,"value":469},"});\n",{"type":21,"tag":209,"props":471,"children":473},{"class":211,"line":472},14,[474],{"type":21,"tag":209,"props":475,"children":476},{"emptyLinePlaceholder":248},[477],{"type":26,"value":251},{"type":21,"tag":209,"props":479,"children":481},{"class":211,"line":480},15,[482],{"type":21,"tag":209,"props":483,"children":484},{"style":448},[485],{"type":26,"value":486},"// ... elsewhere in your application ...\n",{"type":21,"tag":209,"props":488,"children":490},{"class":211,"line":489},16,[491,495,500,504,508,512,516,520,524,528,533,537,542,546,551,555,560,564,569,573,578],{"type":21,"tag":209,"props":492,"children":493},{"style":222},[494],{"type":26,"value":357},{"type":21,"tag":209,"props":496,"children":497},{"style":360},[498],{"type":26,"value":499},"trigger",{"type":21,"tag":209,"props":501,"children":502},{"style":222},[503],{"type":26,"value":368},{"type":21,"tag":209,"props":505,"children":506},{"style":263},[507],{"type":26,"value":373},{"type":21,"tag":209,"props":509,"children":510},{"style":222},[511],{"type":26,"value":378},{"type":21,"tag":209,"props":513,"children":514},{"style":263},[515],{"type":26,"value":383},{"type":21,"tag":209,"props":517,"children":518},{"style":222},[519],{"type":26,"value":378},{"type":21,"tag":209,"props":521,"children":522},{"style":263},[523],{"type":26,"value":392},{"type":21,"tag":209,"props":525,"children":526},{"style":222},[527],{"type":26,"value":408},{"type":21,"tag":209,"props":529,"children":530},{"style":233},[531],{"type":26,"value":532},"'event'",{"type":21,"tag":209,"props":534,"children":535},{"style":222},[536],{"type":26,"value":408},{"type":21,"tag":209,"props":538,"children":539},{"style":233},[540],{"type":26,"value":541},"'args'",{"type":21,"tag":209,"props":543,"children":544},{"style":222},[545],{"type":26,"value":408},{"type":21,"tag":209,"props":547,"children":548},{"style":263},[549],{"type":26,"value":550},"40",{"type":21,"tag":209,"props":552,"children":553},{"style":222},[554],{"type":26,"value":408},{"type":21,"tag":209,"props":556,"children":557},{"style":233},[558],{"type":26,"value":559},"'or'",{"type":21,"tag":209,"props":561,"children":562},{"style":222},[563],{"type":26,"value":408},{"type":21,"tag":209,"props":565,"children":566},{"style":233},[567],{"type":26,"value":568},"'as'",{"type":21,"tag":209,"props":570,"children":571},{"style":222},[572],{"type":26,"value":408},{"type":21,"tag":209,"props":574,"children":575},{"style":233},[576],{"type":26,"value":577},"'many as you like'",{"type":21,"tag":209,"props":579,"children":580},{"style":222},[581],{"type":26,"value":582},",)\n",{"type":21,"tag":193,"props":584,"children":586},{"id":585},"subscribe-to-all-events-on-a-channel",[587],{"type":26,"value":588},"Subscribe to all events on a channel",{"type":21,"tag":22,"props":590,"children":591},{},[592,594,600,602,608],{"type":26,"value":593},"Did you notice the ",{"type":21,"tag":63,"props":595,"children":597},{"className":596},[],[598],{"type":26,"value":599},"event.channel",{"type":26,"value":601}," structure of the event name in our example above? All events within VPubSub belong to a ",{"type":21,"tag":63,"props":603,"children":605},{"className":604},[],[606],{"type":26,"value":607},"channel",{"type":26,"value":609}," - a way of organizing events together. This also allows us to perform operations on a channel-basis, like subscribe to all events for that channel.",{"type":21,"tag":200,"props":611,"children":613},{"className":202,"code":612,"language":12,"meta":8,"style":8},"import {vent} from \"vpubsub\";\n\nconst EVENTS = {\n    PLAYER:{\n        START:'start.player',\n        END:'end.player',\n    }\n};\n\n/**\n * Subscribers to wildcard events will receive the channelEvent as the last argument,\n * allowing for disambiguation within the handler.\n */\nvent.on('*.player', (arg1, arg2, ..., channelEvent) => {\n    switch(channelEvent){\n        case 'start.player':\n            break;\n        case 'end.player':\n            break;\n        default:\n            break;\n    }\n});\n",[614],{"type":21,"tag":63,"props":615,"children":616},{"__ignoreMap":8},[617,640,647,666,673,688,703,710,717,724,732,740,748,756,814,827,845,858,875,887,900,912,920],{"type":21,"tag":209,"props":618,"children":619},{"class":211,"line":212},[620,624,628,632,636],{"type":21,"tag":209,"props":621,"children":622},{"style":216},[623],{"type":26,"value":219},{"type":21,"tag":209,"props":625,"children":626},{"style":222},[627],{"type":26,"value":225},{"type":21,"tag":209,"props":629,"children":630},{"style":216},[631],{"type":26,"value":230},{"type":21,"tag":209,"props":633,"children":634},{"style":233},[635],{"type":26,"value":236},{"type":21,"tag":209,"props":637,"children":638},{"style":222},[639],{"type":26,"value":241},{"type":21,"tag":209,"props":641,"children":642},{"class":211,"line":244},[643],{"type":21,"tag":209,"props":644,"children":645},{"emptyLinePlaceholder":248},[646],{"type":26,"value":251},{"type":21,"tag":209,"props":648,"children":649},{"class":211,"line":254},[650,654,658,662],{"type":21,"tag":209,"props":651,"children":652},{"style":216},[653],{"type":26,"value":260},{"type":21,"tag":209,"props":655,"children":656},{"style":263},[657],{"type":26,"value":266},{"type":21,"tag":209,"props":659,"children":660},{"style":216},[661],{"type":26,"value":271},{"type":21,"tag":209,"props":663,"children":664},{"style":222},[665],{"type":26,"value":276},{"type":21,"tag":209,"props":667,"children":668},{"class":211,"line":279},[669],{"type":21,"tag":209,"props":670,"children":671},{"style":222},[672],{"type":26,"value":285},{"type":21,"tag":209,"props":674,"children":675},{"class":211,"line":288},[676,680,684],{"type":21,"tag":209,"props":677,"children":678},{"style":222},[679],{"type":26,"value":294},{"type":21,"tag":209,"props":681,"children":682},{"style":233},[683],{"type":26,"value":299},{"type":21,"tag":209,"props":685,"children":686},{"style":222},[687],{"type":26,"value":304},{"type":21,"tag":209,"props":689,"children":690},{"class":211,"line":307},[691,695,699],{"type":21,"tag":209,"props":692,"children":693},{"style":222},[694],{"type":26,"value":313},{"type":21,"tag":209,"props":696,"children":697},{"style":233},[698],{"type":26,"value":318},{"type":21,"tag":209,"props":700,"children":701},{"style":222},[702],{"type":26,"value":304},{"type":21,"tag":209,"props":704,"children":705},{"class":211,"line":325},[706],{"type":21,"tag":209,"props":707,"children":708},{"style":222},[709],{"type":26,"value":331},{"type":21,"tag":209,"props":711,"children":712},{"class":211,"line":334},[713],{"type":21,"tag":209,"props":714,"children":715},{"style":222},[716],{"type":26,"value":340},{"type":21,"tag":209,"props":718,"children":719},{"class":211,"line":343},[720],{"type":21,"tag":209,"props":721,"children":722},{"emptyLinePlaceholder":248},[723],{"type":26,"value":251},{"type":21,"tag":209,"props":725,"children":726},{"class":211,"line":351},[727],{"type":21,"tag":209,"props":728,"children":729},{"style":448},[730],{"type":26,"value":731},"/**\n",{"type":21,"tag":209,"props":733,"children":734},{"class":211,"line":444},[735],{"type":21,"tag":209,"props":736,"children":737},{"style":448},[738],{"type":26,"value":739}," * Subscribers to wildcard events will receive the channelEvent as the last argument,\n",{"type":21,"tag":209,"props":741,"children":742},{"class":211,"line":454},[743],{"type":21,"tag":209,"props":744,"children":745},{"style":448},[746],{"type":26,"value":747}," * allowing for disambiguation within the handler.\n",{"type":21,"tag":209,"props":749,"children":750},{"class":211,"line":463},[751],{"type":21,"tag":209,"props":752,"children":753},{"style":448},[754],{"type":26,"value":755}," */\n",{"type":21,"tag":209,"props":757,"children":758},{"class":211,"line":472},[759,763,767,771,776,780,784,788,792,797,802,806,810],{"type":21,"tag":209,"props":760,"children":761},{"style":222},[762],{"type":26,"value":357},{"type":21,"tag":209,"props":764,"children":765},{"style":360},[766],{"type":26,"value":363},{"type":21,"tag":209,"props":768,"children":769},{"style":222},[770],{"type":26,"value":368},{"type":21,"tag":209,"props":772,"children":773},{"style":233},[774],{"type":26,"value":775},"'*.player'",{"type":21,"tag":209,"props":777,"children":778},{"style":222},[779],{"type":26,"value":397},{"type":21,"tag":209,"props":781,"children":782},{"style":400},[783],{"type":26,"value":403},{"type":21,"tag":209,"props":785,"children":786},{"style":222},[787],{"type":26,"value":408},{"type":21,"tag":209,"props":789,"children":790},{"style":400},[791],{"type":26,"value":413},{"type":21,"tag":209,"props":793,"children":794},{"style":222},[795],{"type":26,"value":796},", ..., ",{"type":21,"tag":209,"props":798,"children":799},{"style":400},[800],{"type":26,"value":801},"channelEvent",{"type":21,"tag":209,"props":803,"children":804},{"style":222},[805],{"type":26,"value":432},{"type":21,"tag":209,"props":807,"children":808},{"style":216},[809],{"type":26,"value":437},{"type":21,"tag":209,"props":811,"children":812},{"style":222},[813],{"type":26,"value":276},{"type":21,"tag":209,"props":815,"children":816},{"class":211,"line":480},[817,822],{"type":21,"tag":209,"props":818,"children":819},{"style":216},[820],{"type":26,"value":821},"    switch",{"type":21,"tag":209,"props":823,"children":824},{"style":222},[825],{"type":26,"value":826},"(channelEvent){\n",{"type":21,"tag":209,"props":828,"children":829},{"class":211,"line":489},[830,835,840],{"type":21,"tag":209,"props":831,"children":832},{"style":216},[833],{"type":26,"value":834},"        case",{"type":21,"tag":209,"props":836,"children":837},{"style":233},[838],{"type":26,"value":839}," 'start.player'",{"type":21,"tag":209,"props":841,"children":842},{"style":222},[843],{"type":26,"value":844},":\n",{"type":21,"tag":209,"props":846,"children":848},{"class":211,"line":847},17,[849,854],{"type":21,"tag":209,"props":850,"children":851},{"style":216},[852],{"type":26,"value":853},"            break",{"type":21,"tag":209,"props":855,"children":856},{"style":222},[857],{"type":26,"value":241},{"type":21,"tag":209,"props":859,"children":861},{"class":211,"line":860},18,[862,866,871],{"type":21,"tag":209,"props":863,"children":864},{"style":216},[865],{"type":26,"value":834},{"type":21,"tag":209,"props":867,"children":868},{"style":233},[869],{"type":26,"value":870}," 'end.player'",{"type":21,"tag":209,"props":872,"children":873},{"style":222},[874],{"type":26,"value":844},{"type":21,"tag":209,"props":876,"children":878},{"class":211,"line":877},19,[879,883],{"type":21,"tag":209,"props":880,"children":881},{"style":216},[882],{"type":26,"value":853},{"type":21,"tag":209,"props":884,"children":885},{"style":222},[886],{"type":26,"value":241},{"type":21,"tag":209,"props":888,"children":890},{"class":211,"line":889},20,[891,896],{"type":21,"tag":209,"props":892,"children":893},{"style":216},[894],{"type":26,"value":895},"        default",{"type":21,"tag":209,"props":897,"children":898},{"style":222},[899],{"type":26,"value":844},{"type":21,"tag":209,"props":901,"children":903},{"class":211,"line":902},21,[904,908],{"type":21,"tag":209,"props":905,"children":906},{"style":216},[907],{"type":26,"value":853},{"type":21,"tag":209,"props":909,"children":910},{"style":222},[911],{"type":26,"value":241},{"type":21,"tag":209,"props":913,"children":915},{"class":211,"line":914},22,[916],{"type":21,"tag":209,"props":917,"children":918},{"style":222},[919],{"type":26,"value":331},{"type":21,"tag":209,"props":921,"children":923},{"class":211,"line":922},23,[924],{"type":21,"tag":209,"props":925,"children":926},{"style":222},[927],{"type":26,"value":469},{"type":21,"tag":193,"props":929,"children":931},{"id":930},"subscribe-to-all-events",[932],{"type":26,"value":933},"Subscribe to all events",{"type":21,"tag":22,"props":935,"children":936},{},[937,939,945,947,952],{"type":26,"value":938},"While not recommended, you can add a subscriber to all events by subscribing to the wildcard ",{"type":21,"tag":63,"props":940,"children":942},{"className":941},[],[943],{"type":26,"value":944},"*",{"type":26,"value":946}," event on the wildcard ",{"type":21,"tag":63,"props":948,"children":950},{"className":949},[],[951],{"type":26,"value":944},{"type":26,"value":953}," channel. This could be used for debugging events, as you'll be able to see all traffic across the bus:",{"type":21,"tag":200,"props":955,"children":957},{"className":202,"code":956,"language":12,"meta":8,"style":8},"/**\n * As with wildcard channel events, the channelEvent will always be the last argument\n * when subscribing to all events.\n */\nvent.on('*.*', (arg1, arg2, ..., channelEvent) => {\n    console.log(arg1, channelEvent);\n});\n",[958],{"type":21,"tag":63,"props":959,"children":960},{"__ignoreMap":8},[961,968,976,984,991,1047,1065],{"type":21,"tag":209,"props":962,"children":963},{"class":211,"line":212},[964],{"type":21,"tag":209,"props":965,"children":966},{"style":448},[967],{"type":26,"value":731},{"type":21,"tag":209,"props":969,"children":970},{"class":211,"line":244},[971],{"type":21,"tag":209,"props":972,"children":973},{"style":448},[974],{"type":26,"value":975}," * As with wildcard channel events, the channelEvent will always be the last argument\n",{"type":21,"tag":209,"props":977,"children":978},{"class":211,"line":254},[979],{"type":21,"tag":209,"props":980,"children":981},{"style":448},[982],{"type":26,"value":983}," * when subscribing to all events.\n",{"type":21,"tag":209,"props":985,"children":986},{"class":211,"line":279},[987],{"type":21,"tag":209,"props":988,"children":989},{"style":448},[990],{"type":26,"value":755},{"type":21,"tag":209,"props":992,"children":993},{"class":211,"line":288},[994,998,1002,1006,1011,1015,1019,1023,1027,1031,1035,1039,1043],{"type":21,"tag":209,"props":995,"children":996},{"style":222},[997],{"type":26,"value":357},{"type":21,"tag":209,"props":999,"children":1000},{"style":360},[1001],{"type":26,"value":363},{"type":21,"tag":209,"props":1003,"children":1004},{"style":222},[1005],{"type":26,"value":368},{"type":21,"tag":209,"props":1007,"children":1008},{"style":233},[1009],{"type":26,"value":1010},"'*.*'",{"type":21,"tag":209,"props":1012,"children":1013},{"style":222},[1014],{"type":26,"value":397},{"type":21,"tag":209,"props":1016,"children":1017},{"style":400},[1018],{"type":26,"value":403},{"type":21,"tag":209,"props":1020,"children":1021},{"style":222},[1022],{"type":26,"value":408},{"type":21,"tag":209,"props":1024,"children":1025},{"style":400},[1026],{"type":26,"value":413},{"type":21,"tag":209,"props":1028,"children":1029},{"style":222},[1030],{"type":26,"value":796},{"type":21,"tag":209,"props":1032,"children":1033},{"style":400},[1034],{"type":26,"value":801},{"type":21,"tag":209,"props":1036,"children":1037},{"style":222},[1038],{"type":26,"value":432},{"type":21,"tag":209,"props":1040,"children":1041},{"style":216},[1042],{"type":26,"value":437},{"type":21,"tag":209,"props":1044,"children":1045},{"style":222},[1046],{"type":26,"value":276},{"type":21,"tag":209,"props":1048,"children":1049},{"class":211,"line":307},[1050,1055,1060],{"type":21,"tag":209,"props":1051,"children":1052},{"style":222},[1053],{"type":26,"value":1054},"    console.",{"type":21,"tag":209,"props":1056,"children":1057},{"style":360},[1058],{"type":26,"value":1059},"log",{"type":21,"tag":209,"props":1061,"children":1062},{"style":222},[1063],{"type":26,"value":1064},"(arg1, channelEvent);\n",{"type":21,"tag":209,"props":1066,"children":1067},{"class":211,"line":325},[1068],{"type":21,"tag":209,"props":1069,"children":1070},{"style":222},[1071],{"type":26,"value":469},{"type":21,"tag":193,"props":1073,"children":1075},{"id":1074},"requests",[1076],{"type":26,"value":1077},"Requests",{"type":21,"tag":22,"props":1079,"children":1080},{},[1081,1083,1089],{"type":26,"value":1082},"In addition to one-way event publishing, we can also perform two-way event ",{"type":21,"tag":1084,"props":1085,"children":1086},"em",{},[1087],{"type":26,"value":1088},"messaging",{"type":26,"value":1090}," by making requests. Requests always return a promise that resolves with the responses from all subscribers.",{"type":21,"tag":200,"props":1092,"children":1094},{"className":202,"code":1093,"language":12,"meta":8,"style":8},"import {vent} from \"vpubsub\";\n\nconst EVENTS = {\n    PLAYER:{\n        START:'start.player',\n        END:'end.player',\n    }\n};\n\nvent.on(EVENTS.PLAYER.START, () => {\n    // Perform some work and return a response.\n    const data = {...};\n    return data;\n});\n\n// ... elsewhere in your application ...\n\nvent.request(EVENTS.PLAYER.START, async(res) => {\n    // Do something useful with the response(s) from the subscriber(s).\n    const [resp1] = await res;\n    console.log(resp1);\n});\n",[1095],{"type":21,"tag":63,"props":1096,"children":1097},{"__ignoreMap":8},[1098,1121,1128,1147,1154,1169,1184,1191,1198,1205,1253,1261,1291,1304,1311,1318,1325,1332,1398,1406,1443,1459],{"type":21,"tag":209,"props":1099,"children":1100},{"class":211,"line":212},[1101,1105,1109,1113,1117],{"type":21,"tag":209,"props":1102,"children":1103},{"style":216},[1104],{"type":26,"value":219},{"type":21,"tag":209,"props":1106,"children":1107},{"style":222},[1108],{"type":26,"value":225},{"type":21,"tag":209,"props":1110,"children":1111},{"style":216},[1112],{"type":26,"value":230},{"type":21,"tag":209,"props":1114,"children":1115},{"style":233},[1116],{"type":26,"value":236},{"type":21,"tag":209,"props":1118,"children":1119},{"style":222},[1120],{"type":26,"value":241},{"type":21,"tag":209,"props":1122,"children":1123},{"class":211,"line":244},[1124],{"type":21,"tag":209,"props":1125,"children":1126},{"emptyLinePlaceholder":248},[1127],{"type":26,"value":251},{"type":21,"tag":209,"props":1129,"children":1130},{"class":211,"line":254},[1131,1135,1139,1143],{"type":21,"tag":209,"props":1132,"children":1133},{"style":216},[1134],{"type":26,"value":260},{"type":21,"tag":209,"props":1136,"children":1137},{"style":263},[1138],{"type":26,"value":266},{"type":21,"tag":209,"props":1140,"children":1141},{"style":216},[1142],{"type":26,"value":271},{"type":21,"tag":209,"props":1144,"children":1145},{"style":222},[1146],{"type":26,"value":276},{"type":21,"tag":209,"props":1148,"children":1149},{"class":211,"line":279},[1150],{"type":21,"tag":209,"props":1151,"children":1152},{"style":222},[1153],{"type":26,"value":285},{"type":21,"tag":209,"props":1155,"children":1156},{"class":211,"line":288},[1157,1161,1165],{"type":21,"tag":209,"props":1158,"children":1159},{"style":222},[1160],{"type":26,"value":294},{"type":21,"tag":209,"props":1162,"children":1163},{"style":233},[1164],{"type":26,"value":299},{"type":21,"tag":209,"props":1166,"children":1167},{"style":222},[1168],{"type":26,"value":304},{"type":21,"tag":209,"props":1170,"children":1171},{"class":211,"line":307},[1172,1176,1180],{"type":21,"tag":209,"props":1173,"children":1174},{"style":222},[1175],{"type":26,"value":313},{"type":21,"tag":209,"props":1177,"children":1178},{"style":233},[1179],{"type":26,"value":318},{"type":21,"tag":209,"props":1181,"children":1182},{"style":222},[1183],{"type":26,"value":304},{"type":21,"tag":209,"props":1185,"children":1186},{"class":211,"line":325},[1187],{"type":21,"tag":209,"props":1188,"children":1189},{"style":222},[1190],{"type":26,"value":331},{"type":21,"tag":209,"props":1192,"children":1193},{"class":211,"line":334},[1194],{"type":21,"tag":209,"props":1195,"children":1196},{"style":222},[1197],{"type":26,"value":340},{"type":21,"tag":209,"props":1199,"children":1200},{"class":211,"line":343},[1201],{"type":21,"tag":209,"props":1202,"children":1203},{"emptyLinePlaceholder":248},[1204],{"type":26,"value":251},{"type":21,"tag":209,"props":1206,"children":1207},{"class":211,"line":351},[1208,1212,1216,1220,1224,1228,1232,1236,1240,1245,1249],{"type":21,"tag":209,"props":1209,"children":1210},{"style":222},[1211],{"type":26,"value":357},{"type":21,"tag":209,"props":1213,"children":1214},{"style":360},[1215],{"type":26,"value":363},{"type":21,"tag":209,"props":1217,"children":1218},{"style":222},[1219],{"type":26,"value":368},{"type":21,"tag":209,"props":1221,"children":1222},{"style":263},[1223],{"type":26,"value":373},{"type":21,"tag":209,"props":1225,"children":1226},{"style":222},[1227],{"type":26,"value":378},{"type":21,"tag":209,"props":1229,"children":1230},{"style":263},[1231],{"type":26,"value":383},{"type":21,"tag":209,"props":1233,"children":1234},{"style":222},[1235],{"type":26,"value":378},{"type":21,"tag":209,"props":1237,"children":1238},{"style":263},[1239],{"type":26,"value":392},{"type":21,"tag":209,"props":1241,"children":1242},{"style":222},[1243],{"type":26,"value":1244},", () ",{"type":21,"tag":209,"props":1246,"children":1247},{"style":216},[1248],{"type":26,"value":437},{"type":21,"tag":209,"props":1250,"children":1251},{"style":222},[1252],{"type":26,"value":276},{"type":21,"tag":209,"props":1254,"children":1255},{"class":211,"line":444},[1256],{"type":21,"tag":209,"props":1257,"children":1258},{"style":448},[1259],{"type":26,"value":1260},"    // Perform some work and return a response.\n",{"type":21,"tag":209,"props":1262,"children":1263},{"class":211,"line":454},[1264,1269,1274,1278,1283,1287],{"type":21,"tag":209,"props":1265,"children":1266},{"style":216},[1267],{"type":26,"value":1268},"    const",{"type":21,"tag":209,"props":1270,"children":1271},{"style":263},[1272],{"type":26,"value":1273}," data",{"type":21,"tag":209,"props":1275,"children":1276},{"style":216},[1277],{"type":26,"value":271},{"type":21,"tag":209,"props":1279,"children":1280},{"style":222},[1281],{"type":26,"value":1282}," {",{"type":21,"tag":209,"props":1284,"children":1285},{"style":216},[1286],{"type":26,"value":422},{"type":21,"tag":209,"props":1288,"children":1289},{"style":222},[1290],{"type":26,"value":340},{"type":21,"tag":209,"props":1292,"children":1293},{"class":211,"line":463},[1294,1299],{"type":21,"tag":209,"props":1295,"children":1296},{"style":216},[1297],{"type":26,"value":1298},"    return",{"type":21,"tag":209,"props":1300,"children":1301},{"style":222},[1302],{"type":26,"value":1303}," data;\n",{"type":21,"tag":209,"props":1305,"children":1306},{"class":211,"line":472},[1307],{"type":21,"tag":209,"props":1308,"children":1309},{"style":222},[1310],{"type":26,"value":469},{"type":21,"tag":209,"props":1312,"children":1313},{"class":211,"line":480},[1314],{"type":21,"tag":209,"props":1315,"children":1316},{"emptyLinePlaceholder":248},[1317],{"type":26,"value":251},{"type":21,"tag":209,"props":1319,"children":1320},{"class":211,"line":489},[1321],{"type":21,"tag":209,"props":1322,"children":1323},{"style":448},[1324],{"type":26,"value":486},{"type":21,"tag":209,"props":1326,"children":1327},{"class":211,"line":847},[1328],{"type":21,"tag":209,"props":1329,"children":1330},{"emptyLinePlaceholder":248},[1331],{"type":26,"value":251},{"type":21,"tag":209,"props":1333,"children":1334},{"class":211,"line":860},[1335,1339,1344,1348,1352,1356,1360,1364,1368,1372,1377,1381,1386,1390,1394],{"type":21,"tag":209,"props":1336,"children":1337},{"style":222},[1338],{"type":26,"value":357},{"type":21,"tag":209,"props":1340,"children":1341},{"style":360},[1342],{"type":26,"value":1343},"request",{"type":21,"tag":209,"props":1345,"children":1346},{"style":222},[1347],{"type":26,"value":368},{"type":21,"tag":209,"props":1349,"children":1350},{"style":263},[1351],{"type":26,"value":373},{"type":21,"tag":209,"props":1353,"children":1354},{"style":222},[1355],{"type":26,"value":378},{"type":21,"tag":209,"props":1357,"children":1358},{"style":263},[1359],{"type":26,"value":383},{"type":21,"tag":209,"props":1361,"children":1362},{"style":222},[1363],{"type":26,"value":378},{"type":21,"tag":209,"props":1365,"children":1366},{"style":263},[1367],{"type":26,"value":392},{"type":21,"tag":209,"props":1369,"children":1370},{"style":222},[1371],{"type":26,"value":408},{"type":21,"tag":209,"props":1373,"children":1374},{"style":216},[1375],{"type":26,"value":1376},"async",{"type":21,"tag":209,"props":1378,"children":1379},{"style":222},[1380],{"type":26,"value":368},{"type":21,"tag":209,"props":1382,"children":1383},{"style":400},[1384],{"type":26,"value":1385},"res",{"type":21,"tag":209,"props":1387,"children":1388},{"style":222},[1389],{"type":26,"value":432},{"type":21,"tag":209,"props":1391,"children":1392},{"style":216},[1393],{"type":26,"value":437},{"type":21,"tag":209,"props":1395,"children":1396},{"style":222},[1397],{"type":26,"value":276},{"type":21,"tag":209,"props":1399,"children":1400},{"class":211,"line":877},[1401],{"type":21,"tag":209,"props":1402,"children":1403},{"style":448},[1404],{"type":26,"value":1405},"    // Do something useful with the response(s) from the subscriber(s).\n",{"type":21,"tag":209,"props":1407,"children":1408},{"class":211,"line":889},[1409,1413,1418,1423,1428,1433,1438],{"type":21,"tag":209,"props":1410,"children":1411},{"style":216},[1412],{"type":26,"value":1268},{"type":21,"tag":209,"props":1414,"children":1415},{"style":222},[1416],{"type":26,"value":1417}," [",{"type":21,"tag":209,"props":1419,"children":1420},{"style":263},[1421],{"type":26,"value":1422},"resp1",{"type":21,"tag":209,"props":1424,"children":1425},{"style":222},[1426],{"type":26,"value":1427},"] ",{"type":21,"tag":209,"props":1429,"children":1430},{"style":216},[1431],{"type":26,"value":1432},"=",{"type":21,"tag":209,"props":1434,"children":1435},{"style":216},[1436],{"type":26,"value":1437}," await",{"type":21,"tag":209,"props":1439,"children":1440},{"style":222},[1441],{"type":26,"value":1442}," res;\n",{"type":21,"tag":209,"props":1444,"children":1445},{"class":211,"line":902},[1446,1450,1454],{"type":21,"tag":209,"props":1447,"children":1448},{"style":222},[1449],{"type":26,"value":1054},{"type":21,"tag":209,"props":1451,"children":1452},{"style":360},[1453],{"type":26,"value":1059},{"type":21,"tag":209,"props":1455,"children":1456},{"style":222},[1457],{"type":26,"value":1458},"(resp1);\n",{"type":21,"tag":209,"props":1460,"children":1461},{"class":211,"line":914},[1462],{"type":21,"tag":209,"props":1463,"children":1464},{"style":222},[1465],{"type":26,"value":469},{"type":21,"tag":22,"props":1467,"children":1468},{},[1469,1471,1476,1478,1483],{"type":26,"value":1470},"The same special wildcard channel event and global wildcard that you can use with ",{"type":21,"tag":63,"props":1472,"children":1474},{"className":1473},[],[1475],{"type":26,"value":499},{"type":26,"value":1477}," also apply to ",{"type":21,"tag":63,"props":1479,"children":1481},{"className":1480},[],[1482],{"type":26,"value":1343},{"type":26,"value":1484},", as detailed above.",{"type":21,"tag":51,"props":1486,"children":1488},{"id":1487},"how-does-it-work-with-vue",[1489],{"type":26,"value":1490},"How Does It Work With Vue?",{"type":21,"tag":22,"props":1492,"children":1493},{},[1494],{"type":26,"value":1495},"VPubSub comes with built-in support for using it as a plugin with Vue 3. First, let's install it, and then we'll take a look at using it with the Options or Composition APIs.",{"type":21,"tag":193,"props":1497,"children":1499},{"id":1498},"installation",[1500],{"type":26,"value":1501},"Installation",{"type":21,"tag":22,"props":1503,"children":1504},{},[1505,1507,1513],{"type":26,"value":1506},"Let's create a ",{"type":21,"tag":63,"props":1508,"children":1510},{"className":1509},[],[1511],{"type":26,"value":1512},"plugins/vent.js",{"type":26,"value":1514}," file, that looks like this:",{"type":21,"tag":200,"props":1516,"children":1518},{"className":202,"code":1517,"language":12,"meta":8,"style":8},"/**\n * Return our vent utility as a plugin in Vue for install.\n */\n\nimport {install} from \"vpubsub\";\n\nexport default install;\n",[1519],{"type":21,"tag":63,"props":1520,"children":1521},{"__ignoreMap":8},[1522,1529,1537,1544,1551,1575,1582],{"type":21,"tag":209,"props":1523,"children":1524},{"class":211,"line":212},[1525],{"type":21,"tag":209,"props":1526,"children":1527},{"style":448},[1528],{"type":26,"value":731},{"type":21,"tag":209,"props":1530,"children":1531},{"class":211,"line":244},[1532],{"type":21,"tag":209,"props":1533,"children":1534},{"style":448},[1535],{"type":26,"value":1536}," * Return our vent utility as a plugin in Vue for install.\n",{"type":21,"tag":209,"props":1538,"children":1539},{"class":211,"line":254},[1540],{"type":21,"tag":209,"props":1541,"children":1542},{"style":448},[1543],{"type":26,"value":755},{"type":21,"tag":209,"props":1545,"children":1546},{"class":211,"line":279},[1547],{"type":21,"tag":209,"props":1548,"children":1549},{"emptyLinePlaceholder":248},[1550],{"type":26,"value":251},{"type":21,"tag":209,"props":1552,"children":1553},{"class":211,"line":288},[1554,1558,1563,1567,1571],{"type":21,"tag":209,"props":1555,"children":1556},{"style":216},[1557],{"type":26,"value":219},{"type":21,"tag":209,"props":1559,"children":1560},{"style":222},[1561],{"type":26,"value":1562}," {install} ",{"type":21,"tag":209,"props":1564,"children":1565},{"style":216},[1566],{"type":26,"value":230},{"type":21,"tag":209,"props":1568,"children":1569},{"style":233},[1570],{"type":26,"value":236},{"type":21,"tag":209,"props":1572,"children":1573},{"style":222},[1574],{"type":26,"value":241},{"type":21,"tag":209,"props":1576,"children":1577},{"class":211,"line":307},[1578],{"type":21,"tag":209,"props":1579,"children":1580},{"emptyLinePlaceholder":248},[1581],{"type":26,"value":251},{"type":21,"tag":209,"props":1583,"children":1584},{"class":211,"line":325},[1585,1590,1595],{"type":21,"tag":209,"props":1586,"children":1587},{"style":216},[1588],{"type":26,"value":1589},"export",{"type":21,"tag":209,"props":1591,"children":1592},{"style":216},[1593],{"type":26,"value":1594}," default",{"type":21,"tag":209,"props":1596,"children":1597},{"style":222},[1598],{"type":26,"value":1599}," install;\n",{"type":21,"tag":22,"props":1601,"children":1602},{},[1603,1605,1611],{"type":26,"value":1604},"Then, in ",{"type":21,"tag":63,"props":1606,"children":1608},{"className":1607},[],[1609],{"type":26,"value":1610},"main.js",{"type":26,"value":1612}," (your Vue app's point of entry), we can use it like so:",{"type":21,"tag":200,"props":1614,"children":1616},{"className":202,"code":1615,"language":12,"meta":8,"style":8},"import {createApp} from 'vue';\nimport vent from \"plugins/vent\";\nimport App from \"App.vue\";\n\nconst vue = createApp(App);\n\nvue.use(vent);\n",[1617],{"type":21,"tag":63,"props":1618,"children":1619},{"__ignoreMap":8},[1620,1645,1670,1695,1702,1728,1735],{"type":21,"tag":209,"props":1621,"children":1622},{"class":211,"line":212},[1623,1627,1632,1636,1641],{"type":21,"tag":209,"props":1624,"children":1625},{"style":216},[1626],{"type":26,"value":219},{"type":21,"tag":209,"props":1628,"children":1629},{"style":222},[1630],{"type":26,"value":1631}," {createApp} ",{"type":21,"tag":209,"props":1633,"children":1634},{"style":216},[1635],{"type":26,"value":230},{"type":21,"tag":209,"props":1637,"children":1638},{"style":233},[1639],{"type":26,"value":1640}," 'vue'",{"type":21,"tag":209,"props":1642,"children":1643},{"style":222},[1644],{"type":26,"value":241},{"type":21,"tag":209,"props":1646,"children":1647},{"class":211,"line":244},[1648,1652,1657,1661,1666],{"type":21,"tag":209,"props":1649,"children":1650},{"style":216},[1651],{"type":26,"value":219},{"type":21,"tag":209,"props":1653,"children":1654},{"style":222},[1655],{"type":26,"value":1656}," vent ",{"type":21,"tag":209,"props":1658,"children":1659},{"style":216},[1660],{"type":26,"value":230},{"type":21,"tag":209,"props":1662,"children":1663},{"style":233},[1664],{"type":26,"value":1665}," \"plugins/vent\"",{"type":21,"tag":209,"props":1667,"children":1668},{"style":222},[1669],{"type":26,"value":241},{"type":21,"tag":209,"props":1671,"children":1672},{"class":211,"line":254},[1673,1677,1682,1686,1691],{"type":21,"tag":209,"props":1674,"children":1675},{"style":216},[1676],{"type":26,"value":219},{"type":21,"tag":209,"props":1678,"children":1679},{"style":222},[1680],{"type":26,"value":1681}," App ",{"type":21,"tag":209,"props":1683,"children":1684},{"style":216},[1685],{"type":26,"value":230},{"type":21,"tag":209,"props":1687,"children":1688},{"style":233},[1689],{"type":26,"value":1690}," \"App.vue\"",{"type":21,"tag":209,"props":1692,"children":1693},{"style":222},[1694],{"type":26,"value":241},{"type":21,"tag":209,"props":1696,"children":1697},{"class":211,"line":279},[1698],{"type":21,"tag":209,"props":1699,"children":1700},{"emptyLinePlaceholder":248},[1701],{"type":26,"value":251},{"type":21,"tag":209,"props":1703,"children":1704},{"class":211,"line":288},[1705,1709,1714,1718,1723],{"type":21,"tag":209,"props":1706,"children":1707},{"style":216},[1708],{"type":26,"value":260},{"type":21,"tag":209,"props":1710,"children":1711},{"style":263},[1712],{"type":26,"value":1713}," vue",{"type":21,"tag":209,"props":1715,"children":1716},{"style":216},[1717],{"type":26,"value":271},{"type":21,"tag":209,"props":1719,"children":1720},{"style":360},[1721],{"type":26,"value":1722}," createApp",{"type":21,"tag":209,"props":1724,"children":1725},{"style":222},[1726],{"type":26,"value":1727},"(App);\n",{"type":21,"tag":209,"props":1729,"children":1730},{"class":211,"line":307},[1731],{"type":21,"tag":209,"props":1732,"children":1733},{"emptyLinePlaceholder":248},[1734],{"type":26,"value":251},{"type":21,"tag":209,"props":1736,"children":1737},{"class":211,"line":325},[1738,1743,1748],{"type":21,"tag":209,"props":1739,"children":1740},{"style":222},[1741],{"type":26,"value":1742},"vue.",{"type":21,"tag":209,"props":1744,"children":1745},{"style":360},[1746],{"type":26,"value":1747},"use",{"type":21,"tag":209,"props":1749,"children":1750},{"style":222},[1751],{"type":26,"value":1752},"(vent);\n",{"type":21,"tag":22,"props":1754,"children":1755},{},[1756],{"type":26,"value":1757},"You can also skip creating a plugin wrapper, and use it like so:",{"type":21,"tag":200,"props":1759,"children":1761},{"className":202,"code":1760,"language":12,"meta":8,"style":8},"import {install as vent} from \"vpubsub\";\nimport {createApp} from 'vue';\nimport App from \"App.vue\";\n\nconst vue = createApp(App);\n\nvue.use(vent);\n",[1762],{"type":21,"tag":63,"props":1763,"children":1764},{"__ignoreMap":8},[1765,1799,1822,1845,1852,1875,1882],{"type":21,"tag":209,"props":1766,"children":1767},{"class":211,"line":212},[1768,1772,1777,1782,1787,1791,1795],{"type":21,"tag":209,"props":1769,"children":1770},{"style":216},[1771],{"type":26,"value":219},{"type":21,"tag":209,"props":1773,"children":1774},{"style":222},[1775],{"type":26,"value":1776}," {install ",{"type":21,"tag":209,"props":1778,"children":1779},{"style":216},[1780],{"type":26,"value":1781},"as",{"type":21,"tag":209,"props":1783,"children":1784},{"style":222},[1785],{"type":26,"value":1786}," vent} ",{"type":21,"tag":209,"props":1788,"children":1789},{"style":216},[1790],{"type":26,"value":230},{"type":21,"tag":209,"props":1792,"children":1793},{"style":233},[1794],{"type":26,"value":236},{"type":21,"tag":209,"props":1796,"children":1797},{"style":222},[1798],{"type":26,"value":241},{"type":21,"tag":209,"props":1800,"children":1801},{"class":211,"line":244},[1802,1806,1810,1814,1818],{"type":21,"tag":209,"props":1803,"children":1804},{"style":216},[1805],{"type":26,"value":219},{"type":21,"tag":209,"props":1807,"children":1808},{"style":222},[1809],{"type":26,"value":1631},{"type":21,"tag":209,"props":1811,"children":1812},{"style":216},[1813],{"type":26,"value":230},{"type":21,"tag":209,"props":1815,"children":1816},{"style":233},[1817],{"type":26,"value":1640},{"type":21,"tag":209,"props":1819,"children":1820},{"style":222},[1821],{"type":26,"value":241},{"type":21,"tag":209,"props":1823,"children":1824},{"class":211,"line":254},[1825,1829,1833,1837,1841],{"type":21,"tag":209,"props":1826,"children":1827},{"style":216},[1828],{"type":26,"value":219},{"type":21,"tag":209,"props":1830,"children":1831},{"style":222},[1832],{"type":26,"value":1681},{"type":21,"tag":209,"props":1834,"children":1835},{"style":216},[1836],{"type":26,"value":230},{"type":21,"tag":209,"props":1838,"children":1839},{"style":233},[1840],{"type":26,"value":1690},{"type":21,"tag":209,"props":1842,"children":1843},{"style":222},[1844],{"type":26,"value":241},{"type":21,"tag":209,"props":1846,"children":1847},{"class":211,"line":279},[1848],{"type":21,"tag":209,"props":1849,"children":1850},{"emptyLinePlaceholder":248},[1851],{"type":26,"value":251},{"type":21,"tag":209,"props":1853,"children":1854},{"class":211,"line":288},[1855,1859,1863,1867,1871],{"type":21,"tag":209,"props":1856,"children":1857},{"style":216},[1858],{"type":26,"value":260},{"type":21,"tag":209,"props":1860,"children":1861},{"style":263},[1862],{"type":26,"value":1713},{"type":21,"tag":209,"props":1864,"children":1865},{"style":216},[1866],{"type":26,"value":271},{"type":21,"tag":209,"props":1868,"children":1869},{"style":360},[1870],{"type":26,"value":1722},{"type":21,"tag":209,"props":1872,"children":1873},{"style":222},[1874],{"type":26,"value":1727},{"type":21,"tag":209,"props":1876,"children":1877},{"class":211,"line":307},[1878],{"type":21,"tag":209,"props":1879,"children":1880},{"emptyLinePlaceholder":248},[1881],{"type":26,"value":251},{"type":21,"tag":209,"props":1883,"children":1884},{"class":211,"line":325},[1885,1889,1893],{"type":21,"tag":209,"props":1886,"children":1887},{"style":222},[1888],{"type":26,"value":1742},{"type":21,"tag":209,"props":1890,"children":1891},{"style":360},[1892],{"type":26,"value":1747},{"type":21,"tag":209,"props":1894,"children":1895},{"style":222},[1896],{"type":26,"value":1752},{"type":21,"tag":193,"props":1898,"children":1900},{"id":1899},"options-api",[1901],{"type":26,"value":180},{"type":21,"tag":22,"props":1903,"children":1904},{},[1905,1907,1913,1915,1921,1923,1929,1931,1936],{"type":26,"value":1906},"When installed as a Vue plugin, VPubSub adds a new element to the Options API, the ",{"type":21,"tag":63,"props":1908,"children":1910},{"className":1909},[],[1911],{"type":26,"value":1912},"vent",{"type":26,"value":1914}," option. This should be an object similar to ",{"type":21,"tag":63,"props":1916,"children":1918},{"className":1917},[],[1919],{"type":26,"value":1920},"methods",{"type":26,"value":1922}," or ",{"type":21,"tag":63,"props":1924,"children":1926},{"className":1925},[],[1927],{"type":26,"value":1928},"computed",{"type":26,"value":1930}," in your component, that has the events as the key and ",{"type":21,"tag":1084,"props":1932,"children":1933},{},[1934],{"type":26,"value":1935},"either",{"type":26,"value":1937}," a direct function as the subscriber, or the name of a method in your component as a string.",{"type":21,"tag":22,"props":1939,"children":1940},{},[1941,1943,1948,1950,1956,1958,1964],{"type":26,"value":1942},"You also gain access to the ",{"type":21,"tag":63,"props":1944,"children":1946},{"className":1945},[],[1947],{"type":26,"value":1912},{"type":26,"value":1949}," singleton as a globally available component property, via ",{"type":21,"tag":63,"props":1951,"children":1953},{"className":1952},[],[1954],{"type":26,"value":1955},"$vent",{"type":26,"value":1957},"; you can reference it from within any component via ",{"type":21,"tag":63,"props":1959,"children":1961},{"className":1960},[],[1962],{"type":26,"value":1963},"this.$vent",{"type":26,"value":378},{"type":21,"tag":22,"props":1966,"children":1967},{},[1968],{"type":26,"value":1969},"For example:",{"type":21,"tag":200,"props":1971,"children":1974},{"className":1972,"code":1973,"language":13,"meta":8,"style":8},"language-vue shiki shiki-themes github-light github-dark","\u003Ctemplate>\n    \u003Cdiv>\u003C!-- ...Your template contents... -->\u003C/div>\n\u003C/template>\n\u003Cscript lang=\"js\">\nconst EVENTS = {\n    PLAYER:{\n        START:'start.player',\n        END:'end.player',\n    }\n};\n\nexport default {\n    name: \"VComponent\",\n    props:{\n        vprop:{\n            type:Boolean,\n            default:true,\n        }\n        // ... Your Props ...\n    },\n    vent:{\n        // Indirect binding - the named function within this component will be bound.\n        [EVENTS.PLAYER.START]:'recalcPoints',\n        // Direct binding - this function will be bound.\n        [EVENTS.PLAYER.END](arg1, arg2){\n            // Called whenever the `EVENTS.PLAYER.END` event is triggered or requested.\n        }\n    },\n    methods:{\n        /**\n         * This method will be called whenever the `EVENTS.PLAYER.START` event is\n         * triggered or requested.\n         */\n        recalcPoints(arg1, arg2){\n            // Because the `vent` events are bound to the component, you can use\n            // this to get props, data, computed, etc. of the component.\n            console.log(this.vprop);\n        },\n        /**\n         * Trigger an event as a result of doing something.\n         */\n        doSomething(){\n            this.$vent.trigger(EVENTS.PLAYER.END);\n        },\n        /**\n         * Request replies from subscribers.\n         */\n        getSomething(){\n            this.$vent.request(EVENTS.PLAYER.END).then((res) => {\n                const [resp] = res;\n                console.log(resp);\n            });\n        },\n    },\n};\n\u003C/script>\n",[1975],{"type":21,"tag":63,"props":1976,"children":1977},{"__ignoreMap":8},[1978,1997,2033,2048,2078,2097,2104,2119,2134,2141,2148,2155,2170,2187,2195,2203,2211,2228,2236,2244,2252,2260,2268,2310,2319,2370,2379,2387,2395,2404,2413,2422,2431,2440,2469,2478,2487,2514,2523,2531,2540,2548,2562,2609,2617,2625,2634,2642,2655,2726,2756,2774,2783,2791,2799,2807],{"type":21,"tag":209,"props":1979,"children":1980},{"class":211,"line":212},[1981,1986,1992],{"type":21,"tag":209,"props":1982,"children":1983},{"style":222},[1984],{"type":26,"value":1985},"\u003C",{"type":21,"tag":209,"props":1987,"children":1989},{"style":1988},"--shiki-default:#22863A;--shiki-dark:#85E89D",[1990],{"type":26,"value":1991},"template",{"type":21,"tag":209,"props":1993,"children":1994},{"style":222},[1995],{"type":26,"value":1996},">\n",{"type":21,"tag":209,"props":1998,"children":1999},{"class":211,"line":244},[2000,2005,2010,2015,2020,2025,2029],{"type":21,"tag":209,"props":2001,"children":2002},{"style":222},[2003],{"type":26,"value":2004},"    \u003C",{"type":21,"tag":209,"props":2006,"children":2007},{"style":1988},[2008],{"type":26,"value":2009},"div",{"type":21,"tag":209,"props":2011,"children":2012},{"style":222},[2013],{"type":26,"value":2014},">",{"type":21,"tag":209,"props":2016,"children":2017},{"style":448},[2018],{"type":26,"value":2019},"\u003C!-- ...Your template contents... -->",{"type":21,"tag":209,"props":2021,"children":2022},{"style":222},[2023],{"type":26,"value":2024},"\u003C/",{"type":21,"tag":209,"props":2026,"children":2027},{"style":1988},[2028],{"type":26,"value":2009},{"type":21,"tag":209,"props":2030,"children":2031},{"style":222},[2032],{"type":26,"value":1996},{"type":21,"tag":209,"props":2034,"children":2035},{"class":211,"line":254},[2036,2040,2044],{"type":21,"tag":209,"props":2037,"children":2038},{"style":222},[2039],{"type":26,"value":2024},{"type":21,"tag":209,"props":2041,"children":2042},{"style":1988},[2043],{"type":26,"value":1991},{"type":21,"tag":209,"props":2045,"children":2046},{"style":222},[2047],{"type":26,"value":1996},{"type":21,"tag":209,"props":2049,"children":2050},{"class":211,"line":279},[2051,2055,2060,2065,2069,2074],{"type":21,"tag":209,"props":2052,"children":2053},{"style":222},[2054],{"type":26,"value":1985},{"type":21,"tag":209,"props":2056,"children":2057},{"style":1988},[2058],{"type":26,"value":2059},"script",{"type":21,"tag":209,"props":2061,"children":2062},{"style":360},[2063],{"type":26,"value":2064}," lang",{"type":21,"tag":209,"props":2066,"children":2067},{"style":222},[2068],{"type":26,"value":1432},{"type":21,"tag":209,"props":2070,"children":2071},{"style":233},[2072],{"type":26,"value":2073},"\"js\"",{"type":21,"tag":209,"props":2075,"children":2076},{"style":222},[2077],{"type":26,"value":1996},{"type":21,"tag":209,"props":2079,"children":2080},{"class":211,"line":288},[2081,2085,2089,2093],{"type":21,"tag":209,"props":2082,"children":2083},{"style":216},[2084],{"type":26,"value":260},{"type":21,"tag":209,"props":2086,"children":2087},{"style":263},[2088],{"type":26,"value":266},{"type":21,"tag":209,"props":2090,"children":2091},{"style":216},[2092],{"type":26,"value":271},{"type":21,"tag":209,"props":2094,"children":2095},{"style":222},[2096],{"type":26,"value":276},{"type":21,"tag":209,"props":2098,"children":2099},{"class":211,"line":307},[2100],{"type":21,"tag":209,"props":2101,"children":2102},{"style":222},[2103],{"type":26,"value":285},{"type":21,"tag":209,"props":2105,"children":2106},{"class":211,"line":325},[2107,2111,2115],{"type":21,"tag":209,"props":2108,"children":2109},{"style":222},[2110],{"type":26,"value":294},{"type":21,"tag":209,"props":2112,"children":2113},{"style":233},[2114],{"type":26,"value":299},{"type":21,"tag":209,"props":2116,"children":2117},{"style":222},[2118],{"type":26,"value":304},{"type":21,"tag":209,"props":2120,"children":2121},{"class":211,"line":334},[2122,2126,2130],{"type":21,"tag":209,"props":2123,"children":2124},{"style":222},[2125],{"type":26,"value":313},{"type":21,"tag":209,"props":2127,"children":2128},{"style":233},[2129],{"type":26,"value":318},{"type":21,"tag":209,"props":2131,"children":2132},{"style":222},[2133],{"type":26,"value":304},{"type":21,"tag":209,"props":2135,"children":2136},{"class":211,"line":343},[2137],{"type":21,"tag":209,"props":2138,"children":2139},{"style":222},[2140],{"type":26,"value":331},{"type":21,"tag":209,"props":2142,"children":2143},{"class":211,"line":351},[2144],{"type":21,"tag":209,"props":2145,"children":2146},{"style":222},[2147],{"type":26,"value":340},{"type":21,"tag":209,"props":2149,"children":2150},{"class":211,"line":444},[2151],{"type":21,"tag":209,"props":2152,"children":2153},{"emptyLinePlaceholder":248},[2154],{"type":26,"value":251},{"type":21,"tag":209,"props":2156,"children":2157},{"class":211,"line":454},[2158,2162,2166],{"type":21,"tag":209,"props":2159,"children":2160},{"style":216},[2161],{"type":26,"value":1589},{"type":21,"tag":209,"props":2163,"children":2164},{"style":216},[2165],{"type":26,"value":1594},{"type":21,"tag":209,"props":2167,"children":2168},{"style":222},[2169],{"type":26,"value":276},{"type":21,"tag":209,"props":2171,"children":2172},{"class":211,"line":463},[2173,2178,2183],{"type":21,"tag":209,"props":2174,"children":2175},{"style":222},[2176],{"type":26,"value":2177},"    name: ",{"type":21,"tag":209,"props":2179,"children":2180},{"style":233},[2181],{"type":26,"value":2182},"\"VComponent\"",{"type":21,"tag":209,"props":2184,"children":2185},{"style":222},[2186],{"type":26,"value":304},{"type":21,"tag":209,"props":2188,"children":2189},{"class":211,"line":472},[2190],{"type":21,"tag":209,"props":2191,"children":2192},{"style":222},[2193],{"type":26,"value":2194},"    props:{\n",{"type":21,"tag":209,"props":2196,"children":2197},{"class":211,"line":480},[2198],{"type":21,"tag":209,"props":2199,"children":2200},{"style":222},[2201],{"type":26,"value":2202},"        vprop:{\n",{"type":21,"tag":209,"props":2204,"children":2205},{"class":211,"line":489},[2206],{"type":21,"tag":209,"props":2207,"children":2208},{"style":222},[2209],{"type":26,"value":2210},"            type:Boolean,\n",{"type":21,"tag":209,"props":2212,"children":2213},{"class":211,"line":847},[2214,2219,2224],{"type":21,"tag":209,"props":2215,"children":2216},{"style":222},[2217],{"type":26,"value":2218},"            default:",{"type":21,"tag":209,"props":2220,"children":2221},{"style":263},[2222],{"type":26,"value":2223},"true",{"type":21,"tag":209,"props":2225,"children":2226},{"style":222},[2227],{"type":26,"value":304},{"type":21,"tag":209,"props":2229,"children":2230},{"class":211,"line":860},[2231],{"type":21,"tag":209,"props":2232,"children":2233},{"style":222},[2234],{"type":26,"value":2235},"        }\n",{"type":21,"tag":209,"props":2237,"children":2238},{"class":211,"line":877},[2239],{"type":21,"tag":209,"props":2240,"children":2241},{"style":448},[2242],{"type":26,"value":2243},"        // ... Your Props ...\n",{"type":21,"tag":209,"props":2245,"children":2246},{"class":211,"line":889},[2247],{"type":21,"tag":209,"props":2248,"children":2249},{"style":222},[2250],{"type":26,"value":2251},"    },\n",{"type":21,"tag":209,"props":2253,"children":2254},{"class":211,"line":902},[2255],{"type":21,"tag":209,"props":2256,"children":2257},{"style":222},[2258],{"type":26,"value":2259},"    vent:{\n",{"type":21,"tag":209,"props":2261,"children":2262},{"class":211,"line":914},[2263],{"type":21,"tag":209,"props":2264,"children":2265},{"style":448},[2266],{"type":26,"value":2267},"        // Indirect binding - the named function within this component will be bound.\n",{"type":21,"tag":209,"props":2269,"children":2270},{"class":211,"line":922},[2271,2276,2280,2284,2288,2292,2296,2301,2306],{"type":21,"tag":209,"props":2272,"children":2273},{"style":222},[2274],{"type":26,"value":2275},"        [",{"type":21,"tag":209,"props":2277,"children":2278},{"style":263},[2279],{"type":26,"value":373},{"type":21,"tag":209,"props":2281,"children":2282},{"style":222},[2283],{"type":26,"value":378},{"type":21,"tag":209,"props":2285,"children":2286},{"style":263},[2287],{"type":26,"value":383},{"type":21,"tag":209,"props":2289,"children":2290},{"style":222},[2291],{"type":26,"value":378},{"type":21,"tag":209,"props":2293,"children":2294},{"style":263},[2295],{"type":26,"value":392},{"type":21,"tag":209,"props":2297,"children":2298},{"style":222},[2299],{"type":26,"value":2300},"]:",{"type":21,"tag":209,"props":2302,"children":2303},{"style":233},[2304],{"type":26,"value":2305},"'recalcPoints'",{"type":21,"tag":209,"props":2307,"children":2308},{"style":222},[2309],{"type":26,"value":304},{"type":21,"tag":209,"props":2311,"children":2313},{"class":211,"line":2312},24,[2314],{"type":21,"tag":209,"props":2315,"children":2316},{"style":448},[2317],{"type":26,"value":2318},"        // Direct binding - this function will be bound.\n",{"type":21,"tag":209,"props":2320,"children":2322},{"class":211,"line":2321},25,[2323,2327,2331,2335,2339,2343,2348,2353,2357,2361,2365],{"type":21,"tag":209,"props":2324,"children":2325},{"style":222},[2326],{"type":26,"value":2275},{"type":21,"tag":209,"props":2328,"children":2329},{"style":263},[2330],{"type":26,"value":373},{"type":21,"tag":209,"props":2332,"children":2333},{"style":222},[2334],{"type":26,"value":378},{"type":21,"tag":209,"props":2336,"children":2337},{"style":263},[2338],{"type":26,"value":383},{"type":21,"tag":209,"props":2340,"children":2341},{"style":222},[2342],{"type":26,"value":378},{"type":21,"tag":209,"props":2344,"children":2345},{"style":263},[2346],{"type":26,"value":2347},"END",{"type":21,"tag":209,"props":2349,"children":2350},{"style":222},[2351],{"type":26,"value":2352},"](",{"type":21,"tag":209,"props":2354,"children":2355},{"style":400},[2356],{"type":26,"value":403},{"type":21,"tag":209,"props":2358,"children":2359},{"style":222},[2360],{"type":26,"value":408},{"type":21,"tag":209,"props":2362,"children":2363},{"style":400},[2364],{"type":26,"value":413},{"type":21,"tag":209,"props":2366,"children":2367},{"style":222},[2368],{"type":26,"value":2369},"){\n",{"type":21,"tag":209,"props":2371,"children":2373},{"class":211,"line":2372},26,[2374],{"type":21,"tag":209,"props":2375,"children":2376},{"style":448},[2377],{"type":26,"value":2378},"            // Called whenever the `EVENTS.PLAYER.END` event is triggered or requested.\n",{"type":21,"tag":209,"props":2380,"children":2382},{"class":211,"line":2381},27,[2383],{"type":21,"tag":209,"props":2384,"children":2385},{"style":222},[2386],{"type":26,"value":2235},{"type":21,"tag":209,"props":2388,"children":2390},{"class":211,"line":2389},28,[2391],{"type":21,"tag":209,"props":2392,"children":2393},{"style":222},[2394],{"type":26,"value":2251},{"type":21,"tag":209,"props":2396,"children":2398},{"class":211,"line":2397},29,[2399],{"type":21,"tag":209,"props":2400,"children":2401},{"style":222},[2402],{"type":26,"value":2403},"    methods:{\n",{"type":21,"tag":209,"props":2405,"children":2407},{"class":211,"line":2406},30,[2408],{"type":21,"tag":209,"props":2409,"children":2410},{"style":448},[2411],{"type":26,"value":2412},"        /**\n",{"type":21,"tag":209,"props":2414,"children":2416},{"class":211,"line":2415},31,[2417],{"type":21,"tag":209,"props":2418,"children":2419},{"style":448},[2420],{"type":26,"value":2421},"         * This method will be called whenever the `EVENTS.PLAYER.START` event is\n",{"type":21,"tag":209,"props":2423,"children":2425},{"class":211,"line":2424},32,[2426],{"type":21,"tag":209,"props":2427,"children":2428},{"style":448},[2429],{"type":26,"value":2430},"         * triggered or requested.\n",{"type":21,"tag":209,"props":2432,"children":2434},{"class":211,"line":2433},33,[2435],{"type":21,"tag":209,"props":2436,"children":2437},{"style":448},[2438],{"type":26,"value":2439},"         */\n",{"type":21,"tag":209,"props":2441,"children":2443},{"class":211,"line":2442},34,[2444,2449,2453,2457,2461,2465],{"type":21,"tag":209,"props":2445,"children":2446},{"style":360},[2447],{"type":26,"value":2448},"        recalcPoints",{"type":21,"tag":209,"props":2450,"children":2451},{"style":222},[2452],{"type":26,"value":368},{"type":21,"tag":209,"props":2454,"children":2455},{"style":400},[2456],{"type":26,"value":403},{"type":21,"tag":209,"props":2458,"children":2459},{"style":222},[2460],{"type":26,"value":408},{"type":21,"tag":209,"props":2462,"children":2463},{"style":400},[2464],{"type":26,"value":413},{"type":21,"tag":209,"props":2466,"children":2467},{"style":222},[2468],{"type":26,"value":2369},{"type":21,"tag":209,"props":2470,"children":2472},{"class":211,"line":2471},35,[2473],{"type":21,"tag":209,"props":2474,"children":2475},{"style":448},[2476],{"type":26,"value":2477},"            // Because the `vent` events are bound to the component, you can use\n",{"type":21,"tag":209,"props":2479,"children":2481},{"class":211,"line":2480},36,[2482],{"type":21,"tag":209,"props":2483,"children":2484},{"style":448},[2485],{"type":26,"value":2486},"            // this to get props, data, computed, etc. of the component.\n",{"type":21,"tag":209,"props":2488,"children":2490},{"class":211,"line":2489},37,[2491,2496,2500,2504,2509],{"type":21,"tag":209,"props":2492,"children":2493},{"style":222},[2494],{"type":26,"value":2495},"            console.",{"type":21,"tag":209,"props":2497,"children":2498},{"style":360},[2499],{"type":26,"value":1059},{"type":21,"tag":209,"props":2501,"children":2502},{"style":222},[2503],{"type":26,"value":368},{"type":21,"tag":209,"props":2505,"children":2506},{"style":263},[2507],{"type":26,"value":2508},"this",{"type":21,"tag":209,"props":2510,"children":2511},{"style":222},[2512],{"type":26,"value":2513},".vprop);\n",{"type":21,"tag":209,"props":2515,"children":2517},{"class":211,"line":2516},38,[2518],{"type":21,"tag":209,"props":2519,"children":2520},{"style":222},[2521],{"type":26,"value":2522},"        },\n",{"type":21,"tag":209,"props":2524,"children":2526},{"class":211,"line":2525},39,[2527],{"type":21,"tag":209,"props":2528,"children":2529},{"style":448},[2530],{"type":26,"value":2412},{"type":21,"tag":209,"props":2532,"children":2534},{"class":211,"line":2533},40,[2535],{"type":21,"tag":209,"props":2536,"children":2537},{"style":448},[2538],{"type":26,"value":2539},"         * Trigger an event as a result of doing something.\n",{"type":21,"tag":209,"props":2541,"children":2543},{"class":211,"line":2542},41,[2544],{"type":21,"tag":209,"props":2545,"children":2546},{"style":448},[2547],{"type":26,"value":2439},{"type":21,"tag":209,"props":2549,"children":2551},{"class":211,"line":2550},42,[2552,2557],{"type":21,"tag":209,"props":2553,"children":2554},{"style":360},[2555],{"type":26,"value":2556},"        doSomething",{"type":21,"tag":209,"props":2558,"children":2559},{"style":222},[2560],{"type":26,"value":2561},"(){\n",{"type":21,"tag":209,"props":2563,"children":2565},{"class":211,"line":2564},43,[2566,2571,2576,2580,2584,2588,2592,2596,2600,2604],{"type":21,"tag":209,"props":2567,"children":2568},{"style":263},[2569],{"type":26,"value":2570},"            this",{"type":21,"tag":209,"props":2572,"children":2573},{"style":222},[2574],{"type":26,"value":2575},".$vent.",{"type":21,"tag":209,"props":2577,"children":2578},{"style":360},[2579],{"type":26,"value":499},{"type":21,"tag":209,"props":2581,"children":2582},{"style":222},[2583],{"type":26,"value":368},{"type":21,"tag":209,"props":2585,"children":2586},{"style":263},[2587],{"type":26,"value":373},{"type":21,"tag":209,"props":2589,"children":2590},{"style":222},[2591],{"type":26,"value":378},{"type":21,"tag":209,"props":2593,"children":2594},{"style":263},[2595],{"type":26,"value":383},{"type":21,"tag":209,"props":2597,"children":2598},{"style":222},[2599],{"type":26,"value":378},{"type":21,"tag":209,"props":2601,"children":2602},{"style":263},[2603],{"type":26,"value":2347},{"type":21,"tag":209,"props":2605,"children":2606},{"style":222},[2607],{"type":26,"value":2608},");\n",{"type":21,"tag":209,"props":2610,"children":2612},{"class":211,"line":2611},44,[2613],{"type":21,"tag":209,"props":2614,"children":2615},{"style":222},[2616],{"type":26,"value":2522},{"type":21,"tag":209,"props":2618,"children":2620},{"class":211,"line":2619},45,[2621],{"type":21,"tag":209,"props":2622,"children":2623},{"style":448},[2624],{"type":26,"value":2412},{"type":21,"tag":209,"props":2626,"children":2628},{"class":211,"line":2627},46,[2629],{"type":21,"tag":209,"props":2630,"children":2631},{"style":448},[2632],{"type":26,"value":2633},"         * Request replies from subscribers.\n",{"type":21,"tag":209,"props":2635,"children":2637},{"class":211,"line":2636},47,[2638],{"type":21,"tag":209,"props":2639,"children":2640},{"style":448},[2641],{"type":26,"value":2439},{"type":21,"tag":209,"props":2643,"children":2645},{"class":211,"line":2644},48,[2646,2651],{"type":21,"tag":209,"props":2647,"children":2648},{"style":360},[2649],{"type":26,"value":2650},"        getSomething",{"type":21,"tag":209,"props":2652,"children":2653},{"style":222},[2654],{"type":26,"value":2561},{"type":21,"tag":209,"props":2656,"children":2658},{"class":211,"line":2657},49,[2659,2663,2667,2671,2675,2679,2683,2687,2691,2695,2700,2705,2710,2714,2718,2722],{"type":21,"tag":209,"props":2660,"children":2661},{"style":263},[2662],{"type":26,"value":2570},{"type":21,"tag":209,"props":2664,"children":2665},{"style":222},[2666],{"type":26,"value":2575},{"type":21,"tag":209,"props":2668,"children":2669},{"style":360},[2670],{"type":26,"value":1343},{"type":21,"tag":209,"props":2672,"children":2673},{"style":222},[2674],{"type":26,"value":368},{"type":21,"tag":209,"props":2676,"children":2677},{"style":263},[2678],{"type":26,"value":373},{"type":21,"tag":209,"props":2680,"children":2681},{"style":222},[2682],{"type":26,"value":378},{"type":21,"tag":209,"props":2684,"children":2685},{"style":263},[2686],{"type":26,"value":383},{"type":21,"tag":209,"props":2688,"children":2689},{"style":222},[2690],{"type":26,"value":378},{"type":21,"tag":209,"props":2692,"children":2693},{"style":263},[2694],{"type":26,"value":2347},{"type":21,"tag":209,"props":2696,"children":2697},{"style":222},[2698],{"type":26,"value":2699},").",{"type":21,"tag":209,"props":2701,"children":2702},{"style":360},[2703],{"type":26,"value":2704},"then",{"type":21,"tag":209,"props":2706,"children":2707},{"style":222},[2708],{"type":26,"value":2709},"((",{"type":21,"tag":209,"props":2711,"children":2712},{"style":400},[2713],{"type":26,"value":1385},{"type":21,"tag":209,"props":2715,"children":2716},{"style":222},[2717],{"type":26,"value":432},{"type":21,"tag":209,"props":2719,"children":2720},{"style":216},[2721],{"type":26,"value":437},{"type":21,"tag":209,"props":2723,"children":2724},{"style":222},[2725],{"type":26,"value":276},{"type":21,"tag":209,"props":2727,"children":2729},{"class":211,"line":2728},50,[2730,2735,2739,2744,2748,2752],{"type":21,"tag":209,"props":2731,"children":2732},{"style":216},[2733],{"type":26,"value":2734},"                const",{"type":21,"tag":209,"props":2736,"children":2737},{"style":222},[2738],{"type":26,"value":1417},{"type":21,"tag":209,"props":2740,"children":2741},{"style":263},[2742],{"type":26,"value":2743},"resp",{"type":21,"tag":209,"props":2745,"children":2746},{"style":222},[2747],{"type":26,"value":1427},{"type":21,"tag":209,"props":2749,"children":2750},{"style":216},[2751],{"type":26,"value":1432},{"type":21,"tag":209,"props":2753,"children":2754},{"style":222},[2755],{"type":26,"value":1442},{"type":21,"tag":209,"props":2757,"children":2759},{"class":211,"line":2758},51,[2760,2765,2769],{"type":21,"tag":209,"props":2761,"children":2762},{"style":222},[2763],{"type":26,"value":2764},"                console.",{"type":21,"tag":209,"props":2766,"children":2767},{"style":360},[2768],{"type":26,"value":1059},{"type":21,"tag":209,"props":2770,"children":2771},{"style":222},[2772],{"type":26,"value":2773},"(resp);\n",{"type":21,"tag":209,"props":2775,"children":2777},{"class":211,"line":2776},52,[2778],{"type":21,"tag":209,"props":2779,"children":2780},{"style":222},[2781],{"type":26,"value":2782},"            });\n",{"type":21,"tag":209,"props":2784,"children":2786},{"class":211,"line":2785},53,[2787],{"type":21,"tag":209,"props":2788,"children":2789},{"style":222},[2790],{"type":26,"value":2522},{"type":21,"tag":209,"props":2792,"children":2794},{"class":211,"line":2793},54,[2795],{"type":21,"tag":209,"props":2796,"children":2797},{"style":222},[2798],{"type":26,"value":2251},{"type":21,"tag":209,"props":2800,"children":2802},{"class":211,"line":2801},55,[2803],{"type":21,"tag":209,"props":2804,"children":2805},{"style":222},[2806],{"type":26,"value":340},{"type":21,"tag":209,"props":2808,"children":2810},{"class":211,"line":2809},56,[2811,2815,2819],{"type":21,"tag":209,"props":2812,"children":2813},{"style":222},[2814],{"type":26,"value":2024},{"type":21,"tag":209,"props":2816,"children":2817},{"style":1988},[2818],{"type":26,"value":2059},{"type":21,"tag":209,"props":2820,"children":2821},{"style":222},[2822],{"type":26,"value":1996},{"type":21,"tag":22,"props":2824,"children":2825},{},[2826,2828,2833,2835,2841,2843,2849,2851,2856,2858,2864,2865,2870],{"type":26,"value":2827},"All events specified in the ",{"type":21,"tag":63,"props":2829,"children":2831},{"className":2830},[],[2832],{"type":26,"value":1912},{"type":26,"value":2834}," object are bound to the context of the component on ",{"type":21,"tag":63,"props":2836,"children":2838},{"className":2837},[],[2839],{"type":26,"value":2840},"mounted",{"type":26,"value":2842},", and unbound during ",{"type":21,"tag":63,"props":2844,"children":2846},{"className":2845},[],[2847],{"type":26,"value":2848},"beforeUnmount",{"type":26,"value":2850},". This means that you can use ",{"type":21,"tag":63,"props":2852,"children":2854},{"className":2853},[],[2855],{"type":26,"value":2508},{"type":26,"value":2857}," to refer to the context of the component within these functions and access ",{"type":21,"tag":63,"props":2859,"children":2861},{"className":2860},[],[2862],{"type":26,"value":2863},"data",{"type":26,"value":408},{"type":21,"tag":63,"props":2866,"children":2868},{"className":2867},[],[2869],{"type":26,"value":76},{"type":26,"value":2871},", computed properties, etc.; and that the listeners will be safely bound and unbound automagically for you without any need to manually subscribe or unsubscribe.",{"type":21,"tag":193,"props":2873,"children":2875},{"id":2874},"composition-api",[2876],{"type":26,"value":189},{"type":21,"tag":22,"props":2878,"children":2879},{},[2880,2882,2888],{"type":26,"value":2881},"Using VPubSub with the Composition API is similar to using it outside of Vue, and can be used in a ",{"type":21,"tag":63,"props":2883,"children":2885},{"className":2884},[],[2886],{"type":26,"value":2887},"setup",{"type":26,"value":2889}," script tag in single-file components.",{"type":21,"tag":200,"props":2891,"children":2893},{"className":1972,"code":2892,"language":13,"meta":8,"style":8},"\u003Cscript setup>\n    import {vent} from \"vpubsub\";\n    import EVENTS from \"events\";\n    \n    function onStart(arg1, arg2){\n        // Do something on player start.\n    }\n    function onStartRequest(arg1, arg2){\n        // Return something player start request.\n        return 42;\n    }\n    \n    vent.on(EVENTS.PLAYER.START, onStart);\n    vent.on(EVENTS.PLAYER.START, onStartRequest);\n    \n    vent.trigger(EVENTS.PLAYER.START, 1, 2);\n    vent.request(EVENTS.PLAYER.START, 1, 2).then(async(res) => {\n        const [res1, res2] = await res;\n        console.log(res1, res2);\n    });\n\u003C/script>\n",[2894],{"type":21,"tag":63,"props":2895,"children":2896},{"__ignoreMap":8},[2897,2917,2941,2966,2974,3007,3015,3022,3054,3062,3079,3086,3093,3134,3174,3181,3238,3325,3367,3384,3392],{"type":21,"tag":209,"props":2898,"children":2899},{"class":211,"line":212},[2900,2904,2908,2913],{"type":21,"tag":209,"props":2901,"children":2902},{"style":222},[2903],{"type":26,"value":1985},{"type":21,"tag":209,"props":2905,"children":2906},{"style":1988},[2907],{"type":26,"value":2059},{"type":21,"tag":209,"props":2909,"children":2910},{"style":360},[2911],{"type":26,"value":2912}," setup",{"type":21,"tag":209,"props":2914,"children":2915},{"style":222},[2916],{"type":26,"value":1996},{"type":21,"tag":209,"props":2918,"children":2919},{"class":211,"line":244},[2920,2925,2929,2933,2937],{"type":21,"tag":209,"props":2921,"children":2922},{"style":216},[2923],{"type":26,"value":2924},"    import",{"type":21,"tag":209,"props":2926,"children":2927},{"style":222},[2928],{"type":26,"value":225},{"type":21,"tag":209,"props":2930,"children":2931},{"style":216},[2932],{"type":26,"value":230},{"type":21,"tag":209,"props":2934,"children":2935},{"style":233},[2936],{"type":26,"value":236},{"type":21,"tag":209,"props":2938,"children":2939},{"style":222},[2940],{"type":26,"value":241},{"type":21,"tag":209,"props":2942,"children":2943},{"class":211,"line":254},[2944,2948,2953,2957,2962],{"type":21,"tag":209,"props":2945,"children":2946},{"style":216},[2947],{"type":26,"value":2924},{"type":21,"tag":209,"props":2949,"children":2950},{"style":222},[2951],{"type":26,"value":2952}," EVENTS ",{"type":21,"tag":209,"props":2954,"children":2955},{"style":216},[2956],{"type":26,"value":230},{"type":21,"tag":209,"props":2958,"children":2959},{"style":233},[2960],{"type":26,"value":2961}," \"events\"",{"type":21,"tag":209,"props":2963,"children":2964},{"style":222},[2965],{"type":26,"value":241},{"type":21,"tag":209,"props":2967,"children":2968},{"class":211,"line":279},[2969],{"type":21,"tag":209,"props":2970,"children":2971},{"style":222},[2972],{"type":26,"value":2973},"    \n",{"type":21,"tag":209,"props":2975,"children":2976},{"class":211,"line":288},[2977,2982,2987,2991,2995,2999,3003],{"type":21,"tag":209,"props":2978,"children":2979},{"style":216},[2980],{"type":26,"value":2981},"    function",{"type":21,"tag":209,"props":2983,"children":2984},{"style":360},[2985],{"type":26,"value":2986}," onStart",{"type":21,"tag":209,"props":2988,"children":2989},{"style":222},[2990],{"type":26,"value":368},{"type":21,"tag":209,"props":2992,"children":2993},{"style":400},[2994],{"type":26,"value":403},{"type":21,"tag":209,"props":2996,"children":2997},{"style":222},[2998],{"type":26,"value":408},{"type":21,"tag":209,"props":3000,"children":3001},{"style":400},[3002],{"type":26,"value":413},{"type":21,"tag":209,"props":3004,"children":3005},{"style":222},[3006],{"type":26,"value":2369},{"type":21,"tag":209,"props":3008,"children":3009},{"class":211,"line":307},[3010],{"type":21,"tag":209,"props":3011,"children":3012},{"style":448},[3013],{"type":26,"value":3014},"        // Do something on player start.\n",{"type":21,"tag":209,"props":3016,"children":3017},{"class":211,"line":325},[3018],{"type":21,"tag":209,"props":3019,"children":3020},{"style":222},[3021],{"type":26,"value":331},{"type":21,"tag":209,"props":3023,"children":3024},{"class":211,"line":334},[3025,3029,3034,3038,3042,3046,3050],{"type":21,"tag":209,"props":3026,"children":3027},{"style":216},[3028],{"type":26,"value":2981},{"type":21,"tag":209,"props":3030,"children":3031},{"style":360},[3032],{"type":26,"value":3033}," onStartRequest",{"type":21,"tag":209,"props":3035,"children":3036},{"style":222},[3037],{"type":26,"value":368},{"type":21,"tag":209,"props":3039,"children":3040},{"style":400},[3041],{"type":26,"value":403},{"type":21,"tag":209,"props":3043,"children":3044},{"style":222},[3045],{"type":26,"value":408},{"type":21,"tag":209,"props":3047,"children":3048},{"style":400},[3049],{"type":26,"value":413},{"type":21,"tag":209,"props":3051,"children":3052},{"style":222},[3053],{"type":26,"value":2369},{"type":21,"tag":209,"props":3055,"children":3056},{"class":211,"line":343},[3057],{"type":21,"tag":209,"props":3058,"children":3059},{"style":448},[3060],{"type":26,"value":3061},"        // Return something player start request.\n",{"type":21,"tag":209,"props":3063,"children":3064},{"class":211,"line":351},[3065,3070,3075],{"type":21,"tag":209,"props":3066,"children":3067},{"style":216},[3068],{"type":26,"value":3069},"        return",{"type":21,"tag":209,"props":3071,"children":3072},{"style":263},[3073],{"type":26,"value":3074}," 42",{"type":21,"tag":209,"props":3076,"children":3077},{"style":222},[3078],{"type":26,"value":241},{"type":21,"tag":209,"props":3080,"children":3081},{"class":211,"line":444},[3082],{"type":21,"tag":209,"props":3083,"children":3084},{"style":222},[3085],{"type":26,"value":331},{"type":21,"tag":209,"props":3087,"children":3088},{"class":211,"line":454},[3089],{"type":21,"tag":209,"props":3090,"children":3091},{"style":222},[3092],{"type":26,"value":2973},{"type":21,"tag":209,"props":3094,"children":3095},{"class":211,"line":463},[3096,3101,3105,3109,3113,3117,3121,3125,3129],{"type":21,"tag":209,"props":3097,"children":3098},{"style":222},[3099],{"type":26,"value":3100},"    vent.",{"type":21,"tag":209,"props":3102,"children":3103},{"style":360},[3104],{"type":26,"value":363},{"type":21,"tag":209,"props":3106,"children":3107},{"style":222},[3108],{"type":26,"value":368},{"type":21,"tag":209,"props":3110,"children":3111},{"style":263},[3112],{"type":26,"value":373},{"type":21,"tag":209,"props":3114,"children":3115},{"style":222},[3116],{"type":26,"value":378},{"type":21,"tag":209,"props":3118,"children":3119},{"style":263},[3120],{"type":26,"value":383},{"type":21,"tag":209,"props":3122,"children":3123},{"style":222},[3124],{"type":26,"value":378},{"type":21,"tag":209,"props":3126,"children":3127},{"style":263},[3128],{"type":26,"value":392},{"type":21,"tag":209,"props":3130,"children":3131},{"style":222},[3132],{"type":26,"value":3133},", onStart);\n",{"type":21,"tag":209,"props":3135,"children":3136},{"class":211,"line":472},[3137,3141,3145,3149,3153,3157,3161,3165,3169],{"type":21,"tag":209,"props":3138,"children":3139},{"style":222},[3140],{"type":26,"value":3100},{"type":21,"tag":209,"props":3142,"children":3143},{"style":360},[3144],{"type":26,"value":363},{"type":21,"tag":209,"props":3146,"children":3147},{"style":222},[3148],{"type":26,"value":368},{"type":21,"tag":209,"props":3150,"children":3151},{"style":263},[3152],{"type":26,"value":373},{"type":21,"tag":209,"props":3154,"children":3155},{"style":222},[3156],{"type":26,"value":378},{"type":21,"tag":209,"props":3158,"children":3159},{"style":263},[3160],{"type":26,"value":383},{"type":21,"tag":209,"props":3162,"children":3163},{"style":222},[3164],{"type":26,"value":378},{"type":21,"tag":209,"props":3166,"children":3167},{"style":263},[3168],{"type":26,"value":392},{"type":21,"tag":209,"props":3170,"children":3171},{"style":222},[3172],{"type":26,"value":3173},", onStartRequest);\n",{"type":21,"tag":209,"props":3175,"children":3176},{"class":211,"line":480},[3177],{"type":21,"tag":209,"props":3178,"children":3179},{"style":222},[3180],{"type":26,"value":2973},{"type":21,"tag":209,"props":3182,"children":3183},{"class":211,"line":489},[3184,3188,3192,3196,3200,3204,3208,3212,3216,3220,3225,3229,3234],{"type":21,"tag":209,"props":3185,"children":3186},{"style":222},[3187],{"type":26,"value":3100},{"type":21,"tag":209,"props":3189,"children":3190},{"style":360},[3191],{"type":26,"value":499},{"type":21,"tag":209,"props":3193,"children":3194},{"style":222},[3195],{"type":26,"value":368},{"type":21,"tag":209,"props":3197,"children":3198},{"style":263},[3199],{"type":26,"value":373},{"type":21,"tag":209,"props":3201,"children":3202},{"style":222},[3203],{"type":26,"value":378},{"type":21,"tag":209,"props":3205,"children":3206},{"style":263},[3207],{"type":26,"value":383},{"type":21,"tag":209,"props":3209,"children":3210},{"style":222},[3211],{"type":26,"value":378},{"type":21,"tag":209,"props":3213,"children":3214},{"style":263},[3215],{"type":26,"value":392},{"type":21,"tag":209,"props":3217,"children":3218},{"style":222},[3219],{"type":26,"value":408},{"type":21,"tag":209,"props":3221,"children":3222},{"style":263},[3223],{"type":26,"value":3224},"1",{"type":21,"tag":209,"props":3226,"children":3227},{"style":222},[3228],{"type":26,"value":408},{"type":21,"tag":209,"props":3230,"children":3231},{"style":263},[3232],{"type":26,"value":3233},"2",{"type":21,"tag":209,"props":3235,"children":3236},{"style":222},[3237],{"type":26,"value":2608},{"type":21,"tag":209,"props":3239,"children":3240},{"class":211,"line":847},[3241,3245,3249,3253,3257,3261,3265,3269,3273,3277,3281,3285,3289,3293,3297,3301,3305,3309,3313,3317,3321],{"type":21,"tag":209,"props":3242,"children":3243},{"style":222},[3244],{"type":26,"value":3100},{"type":21,"tag":209,"props":3246,"children":3247},{"style":360},[3248],{"type":26,"value":1343},{"type":21,"tag":209,"props":3250,"children":3251},{"style":222},[3252],{"type":26,"value":368},{"type":21,"tag":209,"props":3254,"children":3255},{"style":263},[3256],{"type":26,"value":373},{"type":21,"tag":209,"props":3258,"children":3259},{"style":222},[3260],{"type":26,"value":378},{"type":21,"tag":209,"props":3262,"children":3263},{"style":263},[3264],{"type":26,"value":383},{"type":21,"tag":209,"props":3266,"children":3267},{"style":222},[3268],{"type":26,"value":378},{"type":21,"tag":209,"props":3270,"children":3271},{"style":263},[3272],{"type":26,"value":392},{"type":21,"tag":209,"props":3274,"children":3275},{"style":222},[3276],{"type":26,"value":408},{"type":21,"tag":209,"props":3278,"children":3279},{"style":263},[3280],{"type":26,"value":3224},{"type":21,"tag":209,"props":3282,"children":3283},{"style":222},[3284],{"type":26,"value":408},{"type":21,"tag":209,"props":3286,"children":3287},{"style":263},[3288],{"type":26,"value":3233},{"type":21,"tag":209,"props":3290,"children":3291},{"style":222},[3292],{"type":26,"value":2699},{"type":21,"tag":209,"props":3294,"children":3295},{"style":360},[3296],{"type":26,"value":2704},{"type":21,"tag":209,"props":3298,"children":3299},{"style":222},[3300],{"type":26,"value":368},{"type":21,"tag":209,"props":3302,"children":3303},{"style":216},[3304],{"type":26,"value":1376},{"type":21,"tag":209,"props":3306,"children":3307},{"style":222},[3308],{"type":26,"value":368},{"type":21,"tag":209,"props":3310,"children":3311},{"style":400},[3312],{"type":26,"value":1385},{"type":21,"tag":209,"props":3314,"children":3315},{"style":222},[3316],{"type":26,"value":432},{"type":21,"tag":209,"props":3318,"children":3319},{"style":216},[3320],{"type":26,"value":437},{"type":21,"tag":209,"props":3322,"children":3323},{"style":222},[3324],{"type":26,"value":276},{"type":21,"tag":209,"props":3326,"children":3327},{"class":211,"line":860},[3328,3333,3337,3342,3346,3351,3355,3359,3363],{"type":21,"tag":209,"props":3329,"children":3330},{"style":216},[3331],{"type":26,"value":3332},"        const",{"type":21,"tag":209,"props":3334,"children":3335},{"style":222},[3336],{"type":26,"value":1417},{"type":21,"tag":209,"props":3338,"children":3339},{"style":263},[3340],{"type":26,"value":3341},"res1",{"type":21,"tag":209,"props":3343,"children":3344},{"style":222},[3345],{"type":26,"value":408},{"type":21,"tag":209,"props":3347,"children":3348},{"style":263},[3349],{"type":26,"value":3350},"res2",{"type":21,"tag":209,"props":3352,"children":3353},{"style":222},[3354],{"type":26,"value":1427},{"type":21,"tag":209,"props":3356,"children":3357},{"style":216},[3358],{"type":26,"value":1432},{"type":21,"tag":209,"props":3360,"children":3361},{"style":216},[3362],{"type":26,"value":1437},{"type":21,"tag":209,"props":3364,"children":3365},{"style":222},[3366],{"type":26,"value":1442},{"type":21,"tag":209,"props":3368,"children":3369},{"class":211,"line":877},[3370,3375,3379],{"type":21,"tag":209,"props":3371,"children":3372},{"style":222},[3373],{"type":26,"value":3374},"        console.",{"type":21,"tag":209,"props":3376,"children":3377},{"style":360},[3378],{"type":26,"value":1059},{"type":21,"tag":209,"props":3380,"children":3381},{"style":222},[3382],{"type":26,"value":3383},"(res1, res2);\n",{"type":21,"tag":209,"props":3385,"children":3386},{"class":211,"line":889},[3387],{"type":21,"tag":209,"props":3388,"children":3389},{"style":222},[3390],{"type":26,"value":3391},"    });\n",{"type":21,"tag":209,"props":3393,"children":3394},{"class":211,"line":902},[3395,3399,3403],{"type":21,"tag":209,"props":3396,"children":3397},{"style":222},[3398],{"type":26,"value":2024},{"type":21,"tag":209,"props":3400,"children":3401},{"style":1988},[3402],{"type":26,"value":2059},{"type":21,"tag":209,"props":3404,"children":3405},{"style":222},[3406],{"type":26,"value":1996},{"type":21,"tag":193,"props":3408,"children":3410},{"id":3409},"what-are-my-import-options",[3411],{"type":26,"value":3412},"What are my import options?",{"type":21,"tag":22,"props":3414,"children":3415},{},[3416,3418,3424,3426,3432,3434,3440,3442,3447,3449,3454],{"type":26,"value":3417},"As for imports, you can choose between importing from ",{"type":21,"tag":63,"props":3419,"children":3421},{"className":3420},[],[3422],{"type":26,"value":3423},"vpubsub",{"type":26,"value":3425},", which expects ",{"type":21,"tag":63,"props":3427,"children":3429},{"className":3428},[],[3430],{"type":26,"value":3431},"lodash-es",{"type":26,"value":3433}," as a peer dependency but doesn't bake in the parts it needs; or you can import from ",{"type":21,"tag":63,"props":3435,"children":3437},{"className":3436},[],[3438],{"type":26,"value":3439},"vpubsub/dist/vpubsub.full.js",{"type":26,"value":3441}," which bakes in just those bits of ",{"type":21,"tag":63,"props":3443,"children":3445},{"className":3444},[],[3446],{"type":26,"value":3431},{"type":26,"value":3448}," that it relies on, and is suitable if you don't intend to make ",{"type":21,"tag":63,"props":3450,"children":3452},{"className":3451},[],[3453],{"type":26,"value":3431},{"type":26,"value":3455}," part of your project.",{"type":21,"tag":193,"props":3457,"children":3459},{"id":3458},"this-is-pretty-neat-id-like-to-use-it-in-my-project",[3460],{"type":26,"value":3461},"This is pretty neat! I'd like to use it in my project.",{"type":21,"tag":22,"props":3463,"children":3464},{},[3465],{"type":26,"value":3466},"Go for it. 🚀",{"type":21,"tag":22,"props":3468,"children":3469},{},[3470,3472,3479,3481,3488],{"type":26,"value":3471},"You can find it over on ",{"type":21,"tag":29,"props":3473,"children":3476},{"href":3474,"rel":3475},"https://github.com/SaneMethod/vpubsub",[93],[3477],{"type":26,"value":3478},"github",{"type":26,"value":3480}," - license details are ",{"type":21,"tag":29,"props":3482,"children":3485},{"href":3483,"rel":3484},"https://github.com/SaneMethod/vpubsub/blob/master/LICENSE.txt",[93],[3486],{"type":26,"value":3487},"in the repo",{"type":26,"value":378},{"type":21,"tag":3490,"props":3491,"children":3492},"style",{},[3493],{"type":26,"value":3494},"html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":8,"searchDepth":254,"depth":254,"links":3496},[3497,3498,3504],{"id":53,"depth":254,"text":56},{"id":165,"depth":254,"text":168,"children":3499},[3500,3501,3502,3503],{"id":195,"depth":279,"text":198},{"id":585,"depth":279,"text":588},{"id":930,"depth":279,"text":933},{"id":1074,"depth":279,"text":1077},{"id":1487,"depth":254,"text":1490,"children":3505},[3506,3507,3508,3509,3510],{"id":1498,"depth":279,"text":1501},{"id":1899,"depth":279,"text":180},{"id":2874,"depth":279,"text":189},{"id":3409,"depth":279,"text":3412},{"id":3458,"depth":279,"text":3461},"markdown","content:ckeefer:2024-7:VPubSub.md","content","ckeefer/2024-7/VPubSub.md","ckeefer/2024-7/VPubSub","md",{"user":3518,"name":3519},"ckeefer","Christopher Keefer",{"_path":3521,"_dir":3522,"_draft":7,"_partial":7,"_locale":8,"title":3523,"description":3524,"excerpt":3524,"tags":3525,"image":3530,"publishDate":3531,"body":3532,"_type":3511,"_id":3835,"_source":3513,"_file":3836,"_stem":3837,"_extension":3516,"author":3838},"/ckeefer/2024-3/e2e_testing","2024-3","E2E Testing: To What End?","Friend, can we agree that tests are a good idea? I won't scorn you for sometimes omitting them - time and budget constraints are what they are, and even the best intentioned of us sometimes have to just give our projects a lick and a promise. \"Proper test coverage soon\", you sweetly croon as you rock it to sleep, the knowledge that you're telling a dark, terrible lie twisting you up inside. Maybe you could just scrape enough budget together for some simple unit tests? Then, at least, you'd have \"tests\", right?",[3526,3527,3528,3529],"qa","software-testing","e2e","playwright","/ckeefer/2024-3/img/E2E_Testing_2024.png","2024-06-15",{"type":18,"children":3533,"toc":3823},[3534,3538,3543,3548,3555,3560,3565,3570,3575,3580,3586,3591,3603,3608,3622,3627,3633,3638,3661,3666,3671,3676,3701,3706,3711,3716,3722,3727,3733,3738,3757,3762,3767,3772,3777,3782,3787,3792,3797,3802,3807,3812,3818],{"type":21,"tag":22,"props":3535,"children":3536},{},[3537],{"type":26,"value":3524},{"type":21,"tag":22,"props":3539,"children":3540},{},[3541],{"type":26,"value":3542},"Well, yes, but also no. Here at A+L, we often receive broken birds from prospective clients - projects from other developers that may never have worked properly, and certainly don't do so now. We offer an in-depth Code Analysis service, where we go through your project file-by-file, line-by-line, and work out why things are so slow, badly performing, buggy and broken in your codebase, and offer recommendations for how to remedy these issues. One of the things we often see in the worst of these projects is no testing at all; but the second most common theme there is nominal testing - the tests exist, they can be run, but they don't actually test anything meaningful.",{"type":21,"tag":22,"props":3544,"children":3545},{},[3546],{"type":26,"value":3547},"There are many flavours of testing. Unit and functional tests have their roles to play, and a comprehensive suite of testing will include them; but if you're looking for the most bang-for-your-buck, particularly on a web-based project, then you should be considering end-to-end testing.",{"type":21,"tag":3549,"props":3550,"children":3552},"h2",{"id":3551},"im-lost-what-is-e2e-testing",[3553],{"type":26,"value":3554},"I'm Lost: What is E2E Testing?",{"type":21,"tag":22,"props":3556,"children":3557},{},[3558],{"type":26,"value":3559},"At its core, end-to-end testing involves automating interaction with an application in a manner identical to that of its intended end user, in such a way that every element of the application involved in normal usage can be exercised and verified by the testing.",{"type":21,"tag":22,"props":3561,"children":3562},{},[3563],{"type":26,"value":3564},"For example, e2e testing for a web application would involve loading the site in a web browser (ideally the same browser and version(s) expected to be used by intended end users), logging in using the same interface an end user would, and exercising the various areas and functionality in the web browser by clicking, scrolling, tapping, double clicking, etc.",{"type":21,"tag":22,"props":3566,"children":3567},{},[3568],{"type":26,"value":3569},"This is accomplished by controlling (aka driving) a browser through an interface that allows programmatic control of its operations, and offers the ability to draw structured data back out of the browser to confirm its state. This allows a test suite to direct a browser to connect to a certain URL, wait for the browser to fire the appropriate events indicating that it has successfully loaded the page to the point where certain DOM elements are in place and interactable, trigger events and inputs against these elements, and receive the results of these interactions from the browser. Anything a human user could do with the browser can be thus automated and tested.",{"type":21,"tag":22,"props":3571,"children":3572},{},[3573],{"type":26,"value":3574},"Because the tests exercise the same functionality in the same way that an end user would do so, within the same environment and through the same interface, this approach to testing is more holistic than other approaches such as unit or functional testing (although it can be beneficially mixed with such tests in some cases). The application is at once tested from the client UI down to the server, database and related services. This is what lends end-to-end testing its name and value.",{"type":21,"tag":22,"props":3576,"children":3577},{},[3578],{"type":26,"value":3579},"This paradigm appears most often in web development, but can be applied to other arenas of software development where the appropriate tooling exists.",{"type":21,"tag":3549,"props":3581,"children":3583},{"id":3582},"sounds-easy",[3584],{"type":26,"value":3585},"Sounds Easy",{"type":21,"tag":22,"props":3587,"children":3588},{},[3589],{"type":26,"value":3590},"Have I convinced you this might be useful? Ready to start throwing some tests together? You've heard there's some automated tools to track clicks and navigation and such, you can get some juniors on this and get it done, right?",{"type":21,"tag":22,"props":3592,"children":3593},{},[3594,3596,3601],{"type":26,"value":3595},"Let's back up a moment. ",{"type":21,"tag":1084,"props":3597,"children":3598},{},[3599],{"type":26,"value":3600},"E2E Testing is software development",{"type":26,"value":3602},". Not just that it tests software development, but that the tests themselves are software, and require the same level of attention to detail, careful planning and thoroughness in implementation as the software that it is testing.",{"type":21,"tag":22,"props":3604,"children":3605},{},[3606],{"type":26,"value":3607},"Well-crafted tests return their time investment manifold in the improved quality of the associated software; poor tests become a drag on project velocity without producing measurable benefits. It is very easy to create hideous spaghetti tests that are slow, brittle and difficult to maintain or expand upon; it requires skill and practice to create tests that are maintainable, expandable, fast and robust.",{"type":21,"tag":22,"props":3609,"children":3610},{},[3611,3613,3620],{"type":26,"value":3612},"Yes, there are ",{"type":21,"tag":29,"props":3614,"children":3617},{"href":3615,"rel":3616},"https://playwright.dev/docs/codegen-intro",[93],[3618],{"type":26,"value":3619},"automated tools",{"type":26,"value":3621}," that can help you throw something together quickly; no, you shouldn't rely on them, at least not exclusively - using them as a starting point may help expedite things, so long as you're prepared to refactor the often repetitive and loosely structured code generated by such tools into something robust and maintainable for your project.",{"type":21,"tag":22,"props":3623,"children":3624},{},[3625],{"type":26,"value":3626},"Not to dissuade you from embarking on your e2e testing adventures, but it shouldn't be an afterthought! You'll need to budget for it, plan for it, and structure it, the same way as any other feature of your codebase. Do otherwise, and you'll likely regret trying to integrate it at all. This leads to a third often seen issue with broken bird codebases brought to us from other developers - the tests started off strong, but quickly spiraled into messy spaghetti code that became brittle, difficult to maintain, and a drag on the project, until the tests were simply abandoned and left to rot.",{"type":21,"tag":3549,"props":3628,"children":3630},{"id":3629},"the-ends-justify-the-tests",[3631],{"type":26,"value":3632},"The Ends Justify the Tests",{"type":21,"tag":22,"props":3634,"children":3635},{},[3636],{"type":26,"value":3637},"Alright, so now you've soberly considered both the need for tests, and the structure and budget that tests will require, and you have your ducks in a row. Now you just need the tools, and to figure out how to use them.",{"type":21,"tag":22,"props":3639,"children":3640},{},[3641,3643,3650,3652,3659],{"type":26,"value":3642},"I recommend ",{"type":21,"tag":29,"props":3644,"children":3647},{"href":3645,"rel":3646},"https://playwright.dev/docs/intro",[93],[3648],{"type":26,"value":3649},"Playwright",{"type":26,"value":3651}," as the current best in class for browser automation and e2e testing. It has all the functionality that was once the exclusive property of a tight binding with the devtools protocol, as found in ",{"type":21,"tag":29,"props":3653,"children":3656},{"href":3654,"rel":3655},"https://pptr.dev/",[93],[3657],{"type":26,"value":3658},"Puppeteer",{"type":26,"value":3660},", without requiring the use of node.js; instead, there are language bindings for many of the languages commonly used in web development - JS, .Net, Java, and Python (both sync and async, although I would recommend use of the async API exclusively - more on that in a moment).",{"type":21,"tag":22,"props":3662,"children":3663},{},[3664],{"type":26,"value":3665},"Automated testing works best in an environment where tests will be run independently of developers, and report on the results of the test runs in a way easily visible to the team and project manager. Continuous Integration (CI) is one way of achieving these goals. CI is pretty easy to achieve these days, whether you're using Github Actions, Gitlab CI/CD, AWS CodePipeline, etc. The exact setup of any of these is outside of the scope of this article, but may be a future topic - stay tuned for that.",{"type":21,"tag":22,"props":3667,"children":3668},{},[3669],{"type":26,"value":3670},"In the meantime, wheter you have the means and motivation for CI or not, you can still take advantage of e2e testing. Let's assume you'll take my recommendation on Playwright, and discuss some SHALL and SHALL NOTs.",{"type":21,"tag":22,"props":3672,"children":3673},{},[3674],{"type":26,"value":3675},"Playwright logically organizes tests on a per-file basis, and aims to run tests in parallel. This leads to various considerations:",{"type":21,"tag":3677,"props":3678,"children":3679},"ul",{},[3680,3686,3691,3696],{"type":21,"tag":3681,"props":3682,"children":3683},"li",{},[3684],{"type":26,"value":3685},"Tests MUST NOT be interdependent between test files, or else parallelism is impossible.",{"type":21,"tag":3681,"props":3687,"children":3688},{},[3689],{"type":26,"value":3690},"Tests MUST NOT alter state in such a way as to prevent other tests from executing within a clean context. Tests MUST isolate the impact of alterations to application state to those areas which are the concerns of the relevant test suite. This may mean mocking out certain aspects, such as the database or some other service, in some cases. Tests SHOULD NOT mock out elements except as needed, and then MUST document what is mocked and why, with reasoning as to the impact on the tests included in the documentation.",{"type":21,"tag":3681,"props":3692,"children":3693},{},[3694],{"type":26,"value":3695},"Tests within a file CAN be interdependent (serially reliant), but SHOULD NOT be - a test SHOULD NOT require that another test within the same file be run before it to set state. Instead, a test SHOULD rely on appropriate hooks to produce the needed state for the test. If for some reason making tests serial within a certain file is particularly desirable, this deviation MUST be documented and re-evaluated regularly.",{"type":21,"tag":3681,"props":3697,"children":3698},{},[3699],{"type":26,"value":3700},"Tests SHOULD focus on testing just one thing. Related functionality SHOULD be grouped together in the same file, but NOT the same test.",{"type":21,"tag":22,"props":3702,"children":3703},{},[3704],{"type":26,"value":3705},"E2E tests should be organized into their own directory, rather than living alongside source files - there is no reason to expect 1-to-1 mapping of test naming or areas of responsibility with those of application source files.",{"type":21,"tag":22,"props":3707,"children":3708},{},[3709],{"type":26,"value":3710},"Besides global and test-specific fixtures or setup/teardown functions, functionality ancillary to specific tests should live in the same file as the tests which use that utility. Utilities that are useful globally should not be imported from other test files, but organized into a separate file for import. This can include things like mocks, user profiles, authentication and authorization helpers, etc.",{"type":21,"tag":22,"props":3712,"children":3713},{},[3714],{"type":26,"value":3715},"Some areas of the application may not be suitable for e2e testing (for example, they rely on a 3rd-party service that, if mocked out, leaves too little to be worth testing for some reason). If this is the case, central documentation that is easily accessible and kept up-to-date should include areas that are excluded with detailed rationale, and these exclusions should be re-evaluated regularly.",{"type":21,"tag":3549,"props":3717,"children":3719},{"id":3718},"on-sync-vs-async-apis",[3720],{"type":26,"value":3721},"On Sync vs Async APIs",{"type":21,"tag":22,"props":3723,"children":3724},{},[3725],{"type":26,"value":3726},"As a tool for developers working in environments where async Python may not be available, or drop-in use for such projects, the Python binding for Playwright offers Sync and Async flavours. In truth, the Sync flavour is really “faking” a sync API via the use of greenlets, and this has an impact on certain elements and expectations of the application it’s running within. There are some circumstances where the sync API may be the right choice, but they are generally a “you will know it when you see it” scenario. If you don’t know whether you should use sync or async, you should use async. All new tests should be written using the async API. Playwright and the browser environment are both truly async in behaviour and expectations under the hood, and so employing the async paradigm is the correct and recommended approach.",{"type":21,"tag":3549,"props":3728,"children":3730},{"id":3729},"just-tell-me-what-to-write-darn-it",[3731],{"type":26,"value":3732},"Just Tell Me What to Write, Darn It!",{"type":21,"tag":22,"props":3734,"children":3735},{},[3736],{"type":26,"value":3737},"Okay, we know what tool we're using, and how to use it. What kinds of tests are we actually writing?\nOur tests will fall into three broad categories:",{"type":21,"tag":3739,"props":3740,"children":3741},"ol",{},[3742,3747,3752],{"type":21,"tag":3681,"props":3743,"children":3744},{},[3745],{"type":26,"value":3746},"Functional Tests",{"type":21,"tag":3681,"props":3748,"children":3749},{},[3750],{"type":26,"value":3751},"Adversarial Tests",{"type":21,"tag":3681,"props":3753,"children":3754},{},[3755],{"type":26,"value":3756},"Regression Integrations",{"type":21,"tag":22,"props":3758,"children":3759},{},[3760],{"type":26,"value":3761},"Let's looks at each of these in turn, and discuss what considerations go into crafting them.",{"type":21,"tag":51,"props":3763,"children":3765},{"id":3764},"functional-tests",[3766],{"type":26,"value":3746},{"type":21,"tag":22,"props":3768,"children":3769},{},[3770],{"type":26,"value":3771},"Functional tests should be crafted from the same requirements that lead to development tasks. Ideally the tests should be created by someone other than the developer that wrote the code to be tested. This allows validating the clarity of the requirements, and allows for revealing the  misunderstandings, assumptions and blind spots of the developer. When a developer writes their own tests, they may make the same mistakes twice. That said, tests written by the same developer are better than no tests at all.",{"type":21,"tag":22,"props":3773,"children":3774},{},[3775],{"type":26,"value":3776},"Testers do not need to be consulted during the requirements gathering/generation stage, any more than developers do in general; anything that can be made to be done in the browser can be tested via e2e testing, without exception. Some things are more difficult than others, and in the same way that requirements gathering might involve feasibility checks on development tasks, it may be worth consulting with developers experienced with e2e testing on whether a given feature or task, as written, would be more or less difficult to test than something equivalent but formulated differently.",{"type":21,"tag":22,"props":3778,"children":3779},{},[3780],{"type":26,"value":3781},"Tests should ideally be written just behind the code they are testing; ideally, an MR for a feature cannot be considered ready for merge without accompanying, adequate and passing tests. In cases where the developer and test developer are different individuals, the test and feature code may be written in parallel, but this raises significant difficulties for the test developer, such as identifying what the locators will be for the elements involved in the test; as a result, I'd suggest that all tests be written against code that is considered ready for inclusion in the codebase in general.",{"type":21,"tag":51,"props":3783,"children":3785},{"id":3784},"adversarial-tests",[3786],{"type":26,"value":3751},{"type":21,"tag":22,"props":3788,"children":3789},{},[3790],{"type":26,"value":3791},"Besides testing the application “as intended” based on requirements, tests should also make efforts to exercise the forbidden or unexpected. For example, attempting to access areas of the application that the tested user shouldn't be able to interact with, making repeated requests in short order, sending unexpected data to the API, rapidly switching between areas of the application, etc., and confirming that attempts to access unauthorized areas or API endpoints does not succeed, rapid navigation doesn’t break expected layout, etc.",{"type":21,"tag":22,"props":3793,"children":3794},{},[3795],{"type":26,"value":3796},"This is a potentially expensive step in terms of time and implementation cost, as the ways in which your application should not function are less bounded than the ways in which it should. As a result, some smaller or simpler projects can and should skip or limit the scope of this element of e2e testing. On larger or more complex projects, however, it forms a useful part of the overall approach to catching unexpected behaviour and confirming authentication and authorization is working as expected, and is particularly important for applications where different user roles possess different permissions and/or access.",{"type":21,"tag":51,"props":3798,"children":3800},{"id":3799},"regression-integrations",[3801],{"type":26,"value":3756},{"type":21,"tag":22,"props":3803,"children":3804},{},[3805],{"type":26,"value":3806},"Manual testing remains an important part of the overall testing plan and process, and an experienced QA will sometimes uncover bugs that were not discovered with the existing automated tests. When the bug is confirmed and its operation understood, this new knowledge MUST be encoded into the automated testing at that point. Creating new tests that can confirm the existence and triggering of the bug behaviour should be created as part of the process of fixing the bug, in the same manner as for the functional testing. These tests then become a way to catch regressions and offer developers and stakeholders confidence that future changes are unlikely to cause the return of previously resolved bugs.",{"type":21,"tag":22,"props":3808,"children":3809},{},[3810],{"type":26,"value":3811},"Care must be taken at this point not to allow the tests to degrade in quality and focus. It will be tempting to throw tests for bug behaviour into existing functional tests, or bundle multiple bugs together. Instead, each bug should be broken out into its own test. These tests can live in the same test file as related functional tests if appropriate, but the same approach to test isolation must be observed as for functional tests. Each test should aim to do one specific and easily identified thing, and never more than that.",{"type":21,"tag":3549,"props":3813,"children":3815},{"id":3814},"we-done-here",[3816],{"type":26,"value":3817},"We Done Here?",{"type":21,"tag":22,"props":3819,"children":3820},{},[3821],{"type":26,"value":3822},"Yeah, pretty much. Automated testing is such a critical part of software development, and it so often gets left for last, subsisting on the crumbs of budget left over after all the neat and shiny features have been completed. Don't let your project become one of the broken birds that clients bring to us to mend - put your e2e testing in the development schedule from the start, and give your project some healthy wings.",{"title":8,"searchDepth":254,"depth":254,"links":3824},[3825,3826,3827,3828,3829,3834],{"id":3551,"depth":244,"text":3554},{"id":3582,"depth":244,"text":3585},{"id":3629,"depth":244,"text":3632},{"id":3718,"depth":244,"text":3721},{"id":3729,"depth":244,"text":3732,"children":3830},[3831,3832,3833],{"id":3764,"depth":254,"text":3746},{"id":3784,"depth":254,"text":3751},{"id":3799,"depth":254,"text":3756},{"id":3814,"depth":244,"text":3817},"content:ckeefer:2024-3:e2e_testing.md","ckeefer/2024-3/e2e_testing.md","ckeefer/2024-3/e2e_testing",{"user":3518,"name":3519},{"_path":3840,"_dir":3841,"_draft":7,"_partial":7,"_locale":8,"title":3842,"description":3843,"excerpt":3844,"publishDate":3845,"image":3846,"tags":3847,"body":3848,"_type":3511,"_id":4446,"_source":3513,"_file":4447,"_stem":4448,"_extension":3516,"author":4449},"/ckeefer/2020-1/why-vue","2020-1","Why Vue","Why choose Vue over any other front-end framework?","For web development, when all other considerations are equal, we recommend choosing Vue. Here’s why:","2020-01-01","/ckeefer/2020-1/img/vue-wall.jpg",[12,13],{"type":18,"children":3849,"toc":4400},[3850,3864,3870,3876,3881,3887,3909,3932,3938,3943,3948,3953,3958,3963,3968,3974,3979,3984,3989,4002,4008,4013,4018,4023,4037,4042,4048,4053,4058,4063,4095,4117,4123,4128,4133,4138,4149,4163,4169,4174,4179,4184,4189,4203,4208,4214,4219,4224,4229,4243,4266,4272,4277,4282,4287,4310,4316,4321,4326,4331,4336,4346,4356,4362,4367,4372,4377],{"type":21,"tag":22,"props":3851,"children":3852},{},[3853,3855,3862],{"type":26,"value":3854},"For web development, when all other considerations are equal, we recommend choosing ",{"type":21,"tag":29,"props":3856,"children":3859},{"href":3857,"rel":3858},"https://www.google.com/url?q=https://vuejs.org/&sa=D&ust=1579208471588000",[93],[3860],{"type":26,"value":3861},"Vue",{"type":26,"value":3863},". Here’s why:",{"type":21,"tag":3549,"props":3865,"children":3867},{"id":3866},"excellent-documentation",[3868],{"type":26,"value":3869},"Excellent Documentation",{"type":21,"tag":51,"props":3871,"children":3873},{"id":3872},"executive-summary",[3874],{"type":26,"value":3875},"Executive Summary",{"type":21,"tag":22,"props":3877,"children":3878},{},[3879],{"type":26,"value":3880},"High quality documentation leads to better results - less time is spent wrestling with the framework or head-scratching about why something is working the way it is, and more time is spent making your project its best.",{"type":21,"tag":51,"props":3882,"children":3884},{"id":3883},"more-details",[3885],{"type":26,"value":3886},"More Details",{"type":21,"tag":22,"props":3888,"children":3889},{},[3890,3892,3899,3901,3908],{"type":26,"value":3891},"The Vue documentation is well written, comprehensive, and instructive. In addition to a ",{"type":21,"tag":29,"props":3893,"children":3896},{"href":3894,"rel":3895},"https://www.google.com/url?q=https://vuejs.org/v2/guide/&sa=D&ust=1579208471590000",[93],[3897],{"type":26,"value":3898},"Guide",{"type":26,"value":3900}," which introduces the various concepts of Vue with helpful examples, looking under the hood is encouraged and supported via a full documentation of the ",{"type":21,"tag":29,"props":3902,"children":3905},{"href":3903,"rel":3904},"https://www.google.com/url?q=https://vuejs.org/v2/api/&sa=D&ust=1579208471590000",[93],[3906],{"type":26,"value":3907},"API",{"type":26,"value":378},{"type":21,"tag":22,"props":3910,"children":3911},{},[3912,3914,3921,3923,3930],{"type":26,"value":3913},"Vue then goes the extra mile by providing a ",{"type":21,"tag":29,"props":3915,"children":3918},{"href":3916,"rel":3917},"https://www.google.com/url?q=https://vuejs.org/v2/style-guide/&sa=D&ust=1579208471591000",[93],[3919],{"type":26,"value":3920},"style guide",{"type":26,"value":3922}," which, for an organization which already has an established style guide (",{"type":21,"tag":29,"props":3924,"children":3927},{"href":3925,"rel":3926},"https://styleguide.artandlogic.com",[93],[3928],{"type":26,"value":3929},"as we do at A+L",{"type":26,"value":3931},"), is most useful in illuminating certain potential pitfalls when working with Vue, as well as providing some simple examples and recipes.",{"type":21,"tag":3549,"props":3933,"children":3935},{"id":3934},"performance",[3936],{"type":26,"value":3937},"Performance",{"type":21,"tag":51,"props":3939,"children":3941},{"id":3940},"executive-summary-1",[3942],{"type":26,"value":3875},{"type":21,"tag":22,"props":3944,"children":3945},{},[3946],{"type":26,"value":3947},"Vue can help eliminate some common patterns of code that lead to poor performance, making your application faster and more responsive.",{"type":21,"tag":51,"props":3949,"children":3951},{"id":3950},"more-details-1",[3952],{"type":26,"value":3886},{"type":21,"tag":22,"props":3954,"children":3955},{},[3956],{"type":26,"value":3957},"Vue uses a virtual DOM implementation. There’s a great deal to be said on this topic, and this should be considered an extremely pared-down summary.",{"type":21,"tag":22,"props":3959,"children":3960},{},[3961],{"type":26,"value":3962},"While reading and writing to the real DOM is a fast and inexpensive operation, the knock-on effects – layout re-calculation and repainting – are slow and expensive operations. Vue, by using a virtual DOM and efficient diffing algorithm, updates as little of the real DOM as possible, and batches such updates, to allow for the minimum of costly knock-on effects, improving rendering time and responsiveness.",{"type":21,"tag":22,"props":3964,"children":3965},{},[3966],{"type":26,"value":3967},"While directly manipulating the DOM can be faster if done carefully and correctly, in practice the dreaded WRW (Write-Read-Write) anti-pattern is all too common, leading to multiple costly repaints. A virtual DOM eliminates this issue.",{"type":21,"tag":3549,"props":3969,"children":3971},{"id":3970},"reactive",[3972],{"type":26,"value":3973},"Reactive",{"type":21,"tag":51,"props":3975,"children":3977},{"id":3976},"executive-summary-2",[3978],{"type":26,"value":3875},{"type":21,"tag":22,"props":3980,"children":3981},{},[3982],{"type":26,"value":3983},"A reactive framework automatically handles some of the work of keeping the UI up-to-date with new values, allowing your project’s developers to focus on business logic rather than presentation.",{"type":21,"tag":51,"props":3985,"children":3987},{"id":3986},"more-details-2",[3988],{"type":26,"value":3886},{"type":21,"tag":22,"props":3990,"children":3991},{},[3992,3994,4000],{"type":26,"value":3993},"Like the React framework before it, Vue is ",{"type":21,"tag":29,"props":3995,"children":3998},{"href":3996,"rel":3997},"https://www.google.com/url?q=https://vuejs.org/v2/guide/reactivity.html&sa=D&ust=1579208471595000",[93],[3999],{"type":26,"value":3970},{"type":26,"value":4001},". This means that, with a little setup work, changing values in JS can create seamless, effortless changes within the UI that relies on those values. Instead of needing to imperatively manipulate the DOM to make updates, simply change the reactive property, and the node that relies on it will be re-rendered with the updated value in place.",{"type":21,"tag":3549,"props":4003,"children":4005},{"id":4004},"progressive",[4006],{"type":26,"value":4007},"Progressive",{"type":21,"tag":51,"props":4009,"children":4011},{"id":4010},"executive-summary-3",[4012],{"type":26,"value":3875},{"type":21,"tag":22,"props":4014,"children":4015},{},[4016],{"type":26,"value":4017},"You can begin integrating Vue into your existing project right away and begin experiencing its benefits, without needing to change the way the whole application works all at once.",{"type":21,"tag":51,"props":4019,"children":4021},{"id":4020},"more-details-3",[4022],{"type":26,"value":3886},{"type":21,"tag":22,"props":4024,"children":4025},{},[4026,4028,4035],{"type":26,"value":4027},"Vue is fairly lightweight, and can be attached to a single given DOM node, even using the existing DOM structure as it’s template if it finds one, allowing Vue to take over an existing page and ",{"type":21,"tag":29,"props":4029,"children":4032},{"href":4030,"rel":4031},"https://www.google.com/url?q=https://en.wikipedia.org/wiki/Progressive_enhancement&sa=D&ust=1579208471598000",[93],[4033],{"type":26,"value":4034},"progressively enhance",{"type":26,"value":4036}," it.",{"type":21,"tag":22,"props":4038,"children":4039},{},[4040],{"type":26,"value":4041},"This makes it a good candidate not just as the backbone of a new project, but also for introducing into an existing project to offer enhanced functionality in one small area of the application and slowly expanding from there.",{"type":21,"tag":3549,"props":4043,"children":4045},{"id":4044},"extensible",[4046],{"type":26,"value":4047},"Extensible",{"type":21,"tag":51,"props":4049,"children":4051},{"id":4050},"executive-summary-4",[4052],{"type":26,"value":3875},{"type":21,"tag":22,"props":4054,"children":4055},{},[4056],{"type":26,"value":4057},"Vue has a thriving ecosystem containing many elements that can be added to your application to add new functionality; and Vue is flexible enough to allow your developers to extend and enhance the way it works.",{"type":21,"tag":51,"props":4059,"children":4061},{"id":4060},"more-details-4",[4062],{"type":26,"value":3886},{"type":21,"tag":22,"props":4064,"children":4065},{},[4066,4068,4075,4077,4084,4086,4093],{"type":26,"value":4067},"Vue focuses on, as the name suggests, the view aspect of the familiar MVC model (although Vue actually subscribes to the ",{"type":21,"tag":29,"props":4069,"children":4072},{"href":4070,"rel":4071},"https://www.google.com/url?q=https://en.wikipedia.org/wiki/Model%25E2%2580%2593view%25E2%2580%2593viewmodel&sa=D&ust=1579208471600000",[93],[4073],{"type":26,"value":4074},"MVVM pattern",{"type":26,"value":4076},"). Other modules within the Vue ecosystem focus on routing (",{"type":21,"tag":29,"props":4078,"children":4081},{"href":4079,"rel":4080},"https://www.google.com/url?q=https://router.vuejs.org/&sa=D&ust=1579208471600000",[93],[4082],{"type":26,"value":4083},"Vue-Router",{"type":26,"value":4085},"), state management (",{"type":21,"tag":29,"props":4087,"children":4090},{"href":4088,"rel":4089},"https://www.google.com/url?q=https://vuex.vuejs.org/&sa=D&ust=1579208471601000",[93],[4091],{"type":26,"value":4092},"Vuex",{"type":26,"value":4094},"), and extend Vue.",{"type":21,"tag":22,"props":4096,"children":4097},{},[4098,4100,4107,4109,4116],{"type":26,"value":4099},"There are ",{"type":21,"tag":29,"props":4101,"children":4104},{"href":4102,"rel":4103},"https://www.google.com/url?q=https://github.com/vuejs/awesome-vue&sa=D&ust=1579208471602000",[93],[4105],{"type":26,"value":4106},"many other Vue plugins",{"type":26,"value":4108}," within a healthy developer ecosystem, and creating your own plugins is ",{"type":21,"tag":29,"props":4110,"children":4113},{"href":4111,"rel":4112},"https://www.google.com/url?q=https://vuejs.org/v2/guide/plugins.html&sa=D&ust=1579208471602000",[93],[4114],{"type":26,"value":4115},"easy and well documented",{"type":26,"value":378},{"type":21,"tag":3549,"props":4118,"children":4120},{"id":4119},"single-file-components",[4121],{"type":26,"value":4122},"Single File Components",{"type":21,"tag":51,"props":4124,"children":4126},{"id":4125},"executive-summary-5",[4127],{"type":26,"value":3875},{"type":21,"tag":22,"props":4129,"children":4130},{},[4131],{"type":26,"value":4132},"Vue supports organizing structure, logic and styling together in the same file, enabling better organization of your application’s code that leads to less time wasted tracking down what piece of code is doing what in your project.",{"type":21,"tag":51,"props":4134,"children":4136},{"id":4135},"more-details-5",[4137],{"type":26,"value":3886},{"type":21,"tag":22,"props":4139,"children":4140},{},[4141,4147],{"type":21,"tag":29,"props":4142,"children":4145},{"href":4143,"rel":4144},"https://www.google.com/url?q=https://vuejs.org/v2/guide/single-file-components.html&sa=D&ust=1579208471604000",[93],[4146],{"type":26,"value":4122},{"type":26,"value":4148}," are useful units for organizing the structure, logic and styling of a reusable component into an atomic form, and make it much easier to reason about the operation and composition of a given component compared to a more traditional approach. Separation of concerns is maintained without requiring the elements of a given component to be spread across many different files.",{"type":21,"tag":22,"props":4150,"children":4151},{},[4152,4154,4161],{"type":26,"value":4153},"This approach borrows many of the best ideas of the standardized ",{"type":21,"tag":29,"props":4155,"children":4158},{"href":4156,"rel":4157},"https://www.google.com/url?q=https://developer.mozilla.org/en-US/docs/Web/Web_Components&sa=D&ust=1579208471605000",[93],[4159],{"type":26,"value":4160},"Web Components",{"type":26,"value":4162},", without that standard’s compatibility limitations.",{"type":21,"tag":3549,"props":4164,"children":4166},{"id":4165},"familiar-templates",[4167],{"type":26,"value":4168},"Familiar Templates",{"type":21,"tag":51,"props":4170,"children":4172},{"id":4171},"executive-summary-6",[4173],{"type":26,"value":3875},{"type":21,"tag":22,"props":4175,"children":4176},{},[4177],{"type":26,"value":4178},"By using HTML and related familiar syntax, your project’s developers can start writing readable, easily understood application structure from day one.",{"type":21,"tag":51,"props":4180,"children":4182},{"id":4181},"more-details-6",[4183],{"type":26,"value":3886},{"type":21,"tag":22,"props":4185,"children":4186},{},[4187],{"type":26,"value":4188},"In place of React’s JSX, or yet another DSL, Vue allows you to use the familiar syntax of HTML in your templates. Similar to angular, directives live as attributes on your elements, and custom elements can be declared, imported and used like standard html tags. It’s elegant and effective.",{"type":21,"tag":22,"props":4190,"children":4191},{},[4192,4194,4201],{"type":26,"value":4193},"And if you’re a fan of ",{"type":21,"tag":29,"props":4195,"children":4198},{"href":4196,"rel":4197},"https://www.google.com/url?q=https://pugjs.org/api/getting-started.html&sa=D&ust=1579208471607000",[93],[4199],{"type":26,"value":4200},"Pug",{"type":26,"value":4202},", you can use that instead (or in addition to) your HTML templates, eliminating the verbosity of HTML without losing any of the familiar syntax.",{"type":21,"tag":22,"props":4204,"children":4205},{},[4206],{"type":26,"value":4207},"Vue does allow falling back to directly writing render functions, if for some reason your use case requires it, as well as supporting JSX if desired.",{"type":21,"tag":3549,"props":4209,"children":4211},{"id":4210},"integrated-toolchain",[4212],{"type":26,"value":4213},"Integrated Toolchain",{"type":21,"tag":51,"props":4215,"children":4217},{"id":4216},"executive-summary-7",[4218],{"type":26,"value":3875},{"type":21,"tag":22,"props":4220,"children":4221},{},[4222],{"type":26,"value":4223},"Vue comes packaged with a suite of tools that give your project’s developers a hand in getting your application code built and running, boosting productivity.",{"type":21,"tag":51,"props":4225,"children":4227},{"id":4226},"more-details-7",[4228],{"type":26,"value":3886},{"type":21,"tag":22,"props":4230,"children":4231},{},[4232,4234,4241],{"type":26,"value":4233},"In order to take advantage of some of the features of Vue, you need a toolchain to build the scripts, extract the various components, and tie everything together. Vue comes with toolchain support out-of-the-box via the ",{"type":21,"tag":29,"props":4235,"children":4238},{"href":4236,"rel":4237},"https://www.google.com/url?q=https://cli.vuejs.org/&sa=D&ust=1579208471609000",[93],[4239],{"type":26,"value":4240},"vue-cli",{"type":26,"value":4242},", which even provides a limited web-based GUI for customizing certain aspects of your project and adding community-provided plugins.",{"type":21,"tag":22,"props":4244,"children":4245},{},[4246,4248,4255,4257,4264],{"type":26,"value":4247},"Under the hood, vue-cli relies on ",{"type":21,"tag":29,"props":4249,"children":4252},{"href":4250,"rel":4251},"https://www.google.com/url?q=https://webpack.js.org/&sa=D&ust=1579208471610000",[93],[4253],{"type":26,"value":4254},"webpack",{"type":26,"value":4256},", and ",{"type":21,"tag":29,"props":4258,"children":4261},{"href":4259,"rel":4260},"https://www.google.com/url?q=https://cli.vuejs.org/guide/webpack.html&sa=D&ust=1579208471611000",[93],[4262],{"type":26,"value":4263},"provides guidance and tools",{"type":26,"value":4265}," for interacting with it if the standard configuration isn’t sufficient for your project’s needs.",{"type":21,"tag":3549,"props":4267,"children":4269},{"id":4268},"cross-platform-support",[4270],{"type":26,"value":4271},"Cross-Platform Support",{"type":21,"tag":51,"props":4273,"children":4275},{"id":4274},"executive-summary-8",[4276],{"type":26,"value":3875},{"type":21,"tag":22,"props":4278,"children":4279},{},[4280],{"type":26,"value":4281},"Vue can be used to create native mobile applications, and take advantage of the functionality of the platform that might not be available to web applications, like the accelerometer or push notifications.",{"type":21,"tag":51,"props":4283,"children":4285},{"id":4284},"more-details-8",[4286],{"type":26,"value":3886},{"type":21,"tag":22,"props":4288,"children":4289},{},[4290,4292,4299,4301,4308],{"type":26,"value":4291},"Via ",{"type":21,"tag":29,"props":4293,"children":4296},{"href":4294,"rel":4295},"https://www.google.com/url?q=https://vue-native.io/&sa=D&ust=1579208471613000",[93],[4297],{"type":26,"value":4298},"Vue Native",{"type":26,"value":4300},", developing cross-platform mobile applications using Vue is straightforward and powerful. Under the hood, Vue Native is really ",{"type":21,"tag":29,"props":4302,"children":4305},{"href":4303,"rel":4304},"https://www.google.com/url?q=https://vue-native.io/docs/index.html%23What-is-Vue-Native&sa=D&ust=1579208471613000",[93],[4306],{"type":26,"value":4307},"React Native",{"type":26,"value":4309},", providing a wrapper around the latter’s APIs, so all of the same Pros and Cons that apply to React Native apply here, with the significant pro that the continued development on React Native directly benefits the Vue Native platform as well.",{"type":21,"tag":3549,"props":4311,"children":4313},{"id":4312},"widely-used",[4314],{"type":26,"value":4315},"Widely Used",{"type":21,"tag":51,"props":4317,"children":4319},{"id":4318},"executive-summary-9",[4320],{"type":26,"value":3875},{"type":21,"tag":22,"props":4322,"children":4323},{},[4324],{"type":26,"value":4325},"Vue is widely used in web application development. Using technologies that are widely accepted reduces future project risks that components will not continue to be maintained or accessing knowledgeable developers for maintenance will become prohibitively expensive or difficult.",{"type":21,"tag":51,"props":4327,"children":4329},{"id":4328},"more-details-9",[4330],{"type":26,"value":3886},{"type":21,"tag":22,"props":4332,"children":4333},{},[4334],{"type":26,"value":4335},"Companies like Gitlab, Nintendo, Facebook and Netflix make use of  Vue in their development toolset.",{"type":21,"tag":22,"props":4337,"children":4338},{},[4339],{"type":21,"tag":29,"props":4340,"children":4343},{"href":4341,"rel":4342},"https://www.google.com/url?q=https://www.netguru.com/blog/13-top-companies-that-have-trusted-vue.js-examples-of-applications&sa=D&ust=1579208471615000",[93],[4344],{"type":26,"value":4345},"https://www.netguru.com/blog/13-top-companies-that-have-trusted-vue.js-examples-of-applications",{"type":21,"tag":22,"props":4347,"children":4348},{},[4349],{"type":21,"tag":29,"props":4350,"children":4353},{"href":4351,"rel":4352},"https://www.google.com/url?q=https://www.techuz.com/blog/top-9-websites-built-using-vue-js/&sa=D&ust=1579208471616000",[93],[4354],{"type":26,"value":4355},"https://www.techuz.com/blog/top-9-websites-built-using-vue-js/",{"type":21,"tag":3549,"props":4357,"children":4359},{"id":4358},"open-source",[4360],{"type":26,"value":4361},"Open Source",{"type":21,"tag":51,"props":4363,"children":4365},{"id":4364},"executive-summary-10",[4366],{"type":26,"value":3875},{"type":21,"tag":22,"props":4368,"children":4369},{},[4370],{"type":26,"value":4371},"Using an open source technology eliminates the future risk that a vendor will change licensing terms or go out of business which could lead to unexpected costs to transition to a different technology.",{"type":21,"tag":51,"props":4373,"children":4375},{"id":4374},"more-details-10",[4376],{"type":26,"value":3886},{"type":21,"tag":22,"props":4378,"children":4379},{},[4380,4382,4389,4391,4398],{"type":26,"value":4381},"Vue is ",{"type":21,"tag":29,"props":4383,"children":4386},{"href":4384,"rel":4385},"https://www.google.com/url?q=https://github.com/vuejs/vuejs.org/blob/master/LICENSE&sa=D&ust=1579208471618000",[93],[4387],{"type":26,"value":4388},"MIT licensed",{"type":26,"value":4390},".The ",{"type":21,"tag":29,"props":4392,"children":4395},{"href":4393,"rel":4394},"https://www.google.com/url?q=https://opensource.org/licenses/MIT&sa=D&ust=1579208471618000",[93],[4396],{"type":26,"value":4397},"MIT License",{"type":26,"value":4399}," is one of the most permissive open source licenses, allowing you to transform the original source, bundle it with your own application in any form, and does not require open sourcing the resulting application. The only requirement is to include the license and copyright notice originally bundled with the source code, making software under this license an excellent choice for inclusion in commercial products.",{"title":8,"searchDepth":254,"depth":254,"links":4401},[4402,4406,4410,4414,4418,4422,4426,4430,4434,4438,4442],{"id":3866,"depth":244,"text":3869,"children":4403},[4404,4405],{"id":3872,"depth":254,"text":3875},{"id":3883,"depth":254,"text":3886},{"id":3934,"depth":244,"text":3937,"children":4407},[4408,4409],{"id":3940,"depth":254,"text":3875},{"id":3950,"depth":254,"text":3886},{"id":3970,"depth":244,"text":3973,"children":4411},[4412,4413],{"id":3976,"depth":254,"text":3875},{"id":3986,"depth":254,"text":3886},{"id":4004,"depth":244,"text":4007,"children":4415},[4416,4417],{"id":4010,"depth":254,"text":3875},{"id":4020,"depth":254,"text":3886},{"id":4044,"depth":244,"text":4047,"children":4419},[4420,4421],{"id":4050,"depth":254,"text":3875},{"id":4060,"depth":254,"text":3886},{"id":4119,"depth":244,"text":4122,"children":4423},[4424,4425],{"id":4125,"depth":254,"text":3875},{"id":4135,"depth":254,"text":3886},{"id":4165,"depth":244,"text":4168,"children":4427},[4428,4429],{"id":4171,"depth":254,"text":3875},{"id":4181,"depth":254,"text":3886},{"id":4210,"depth":244,"text":4213,"children":4431},[4432,4433],{"id":4216,"depth":254,"text":3875},{"id":4226,"depth":254,"text":3886},{"id":4268,"depth":244,"text":4271,"children":4435},[4436,4437],{"id":4274,"depth":254,"text":3875},{"id":4284,"depth":254,"text":3886},{"id":4312,"depth":244,"text":4315,"children":4439},[4440,4441],{"id":4318,"depth":254,"text":3875},{"id":4328,"depth":254,"text":3886},{"id":4358,"depth":244,"text":4361,"children":4443},[4444,4445],{"id":4364,"depth":254,"text":3875},{"id":4374,"depth":254,"text":3886},"content:ckeefer:2020-1:Why Vue.md","ckeefer/2020-1/Why Vue.md","ckeefer/2020-1/Why Vue",{"user":3518,"name":3519},{"_path":4451,"_dir":4452,"_draft":7,"_partial":7,"_locale":8,"title":4453,"description":4454,"excerpt":4454,"image":4455,"publishDate":4456,"tags":4457,"body":4459,"_type":3511,"_id":7323,"_source":3513,"_file":7324,"_stem":7325,"_extension":3516,"author":7326},"/ckeefer/2019-1/unlockingwebaudio","2019-1","Unlocking Web Audio","\"It's going to be the coolest thing ever.\"","/ckeefer/2019-1/img/featured_image.jpg","2019-01-01",[12,4458],"audio",{"type":18,"children":4460,"toc":7316},[4461,4469,4474,4482,4487,4519,4532,4537,4542,4556,4562,4576,4599,4612,4635,4640,5122,5127,5166,5180,5202,5215,5257,5284,5289,5301,5307,5321,5326,5331,5336,5341,5347,5352,7206,7225,7236,7248,7261,7284,7289,7312],{"type":21,"tag":4462,"props":4463,"children":4464},"blockquote",{},[4465],{"type":21,"tag":22,"props":4466,"children":4467},{},[4468],{"type":26,"value":4454},{"type":21,"tag":22,"props":4470,"children":4471},{},[4472],{"type":26,"value":4473},"You know enough by now to be doubtful when a client makes this statement, but you're willing to entertain the idea that this may not, in fact, be a tragedy in the making.",{"type":21,"tag":4462,"props":4475,"children":4476},{},[4477],{"type":21,"tag":22,"props":4478,"children":4479},{},[4480],{"type":26,"value":4481},"\"It's going to be a music machine - like, full keyboard and everything - but each of the keys is going to be mapped to - wait for it - cat sounds! We'll call it the 'Meowsic Machine'! Oh, and we need it to be accessible to everyone via the Web. Which is easy, right?",{"type":21,"tag":22,"props":4483,"children":4484},{},[4485],{"type":26,"value":4486},"You are reminded that the universe can be a cruel place.",{"type":21,"tag":22,"props":4488,"children":4489},{},[4490,4492,4499,4501,4508,4510,4517],{"type":26,"value":4491},"It's now your job to make this happen. Over the course of a few posts, we're going to look at the ",{"type":21,"tag":29,"props":4493,"children":4496},{"href":4494,"rel":4495},"https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API",[93],[4497],{"type":26,"value":4498},"Web Audio API",{"type":26,"value":4500},", and build the Meowsic Machine together. In the process, we'll also enjoy a dalliance with ",{"type":21,"tag":29,"props":4502,"children":4505},{"href":4503,"rel":4504},"https://vuejs.org/",[93],[4506],{"type":26,"value":4507},"Vue.js",{"type":26,"value":4509},", and dip our toes into the deep-end with ",{"type":21,"tag":29,"props":4511,"children":4514},{"href":4512,"rel":4513},"https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Using_web_workers",[93],[4515],{"type":26,"value":4516},"Web Workers",{"type":26,"value":4518},". Today, we take the first step in this historic journey - convincing the browser to actually let us play sounds.",{"type":21,"tag":51,"props":4520,"children":4522},{"id":4521},"periodicwave-isnt-that-something-the-crowd-does-at-a-sports-game",[4523,4530],{"type":21,"tag":29,"props":4524,"children":4527},{"href":4525,"rel":4526},"https://developer.mozilla.org/en-US/docs/Web/API/PeriodicWave",[93],[4528],{"type":26,"value":4529},"PeriodicWave",{"type":26,"value":4531},"... Isn't that something the crowd does at a sports game?",{"type":21,"tag":22,"props":4533,"children":4534},{},[4535],{"type":26,"value":4536},"The Web Audio API is rather intimidating at first glance if you're not used to dealing with the low-level vagaries of audio - you feed in an appropriate file to the right OS API, it gets converted to PCM via magic, cat sounds come out of the speakers, right?",{"type":21,"tag":22,"props":4538,"children":4539},{},[4540],{"type":26,"value":4541},"(If you're coming from the world of dealing regularly with said vagaries, you're probably thinking \"this API is weird - there's a mix of high-level and low-level constructs, and why is setting up a standard ring buffer so hard?\" We'll get to those details/criticisms/workarounds in a future post).",{"type":21,"tag":22,"props":4543,"children":4544},{},[4545,4547,4554],{"type":26,"value":4546},"It is, however, an unquestionably better API for playing sounds - especially dynamically created sounds - than any web standard to date. It's also ",{"type":21,"tag":29,"props":4548,"children":4551},{"href":4549,"rel":4550},"https://caniuse.com/#search=web%20audio%20api",[93],[4552],{"type":26,"value":4553},"fairly well supported across the board",{"type":26,"value":4555}," by browsers, so there's no reason not to dig in and get to work.",{"type":21,"tag":51,"props":4557,"children":4559},{"id":4558},"kiss",[4560],{"type":26,"value":4561},"KISS",{"type":21,"tag":22,"props":4563,"children":4564},{},[4565,4567,4574],{"type":26,"value":4566},"So, let's start at the very beginning. If you haven't already, check out MDN's ",{"type":21,"tag":29,"props":4568,"children":4571},{"href":4569,"rel":4570},"https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API/Basic_concepts_behind_Web_Audio_API",[93],[4572],{"type":26,"value":4573},"Basic concepts behind Web Audio API",{"type":26,"value":4575}," article. It's a great introduction into some of the basics of not just the API, but playing sounds in general.",{"type":21,"tag":22,"props":4577,"children":4578},{},[4579,4581,4588,4590,4597],{"type":26,"value":4580},"We just want to play some cat sounds, though, not delve into the ",{"type":21,"tag":29,"props":4582,"children":4585},{"href":4583,"rel":4584},"https://en.wikipedia.org/wiki/Nyquist%E2%80%93Shannon_sampling_theorem",[93],[4586],{"type":26,"value":4587},"Nyquist-Shannon Sampling Theorem",{"type":26,"value":4589},", or reprise the history of the ",{"type":21,"tag":29,"props":4591,"children":4594},{"href":4592,"rel":4593},"https://en.wikipedia.org/wiki/U-matic#Digital_audio",[93],[4595],{"type":26,"value":4596},"44.1kHz sampling frequency",{"type":26,"value":4598},". Can't we just skip to the good stuff?",{"type":21,"tag":22,"props":4600,"children":4601},{},[4602,4604,4610],{"type":26,"value":4603},"So, let's assume we have a sound file, ",{"type":21,"tag":63,"props":4605,"children":4607},{"className":4606},[],[4608],{"type":26,"value":4609},"meow.mp3",{"type":26,"value":4611},". We're going to rely on the browser have the right codec to decode this file, and we're not going to try and loop it, alter its gain, or perform any transformations of it—we're just going to play it.",{"type":21,"tag":22,"props":4613,"children":4614},{},[4615,4617,4624,4626,4633],{"type":26,"value":4616},"We could do something this simple with the ",{"type":21,"tag":29,"props":4618,"children":4621},{"href":4619,"rel":4620},"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio",[93],[4622],{"type":26,"value":4623},"Audio Element",{"type":26,"value":4625},"—but we want to do bigger and cooler things in the future. It is worth noting, however, that an audio element ",{"type":21,"tag":29,"props":4627,"children":4630},{"href":4628,"rel":4629},"https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/createMediaElementSource",[93],[4631],{"type":26,"value":4632},"can be used as the source for an Web Audio Context",{"type":26,"value":4634}," - we may delve more into this in the future.",{"type":21,"tag":22,"props":4636,"children":4637},{},[4638],{"type":26,"value":4639},"For now, let's get this party started:",{"type":21,"tag":200,"props":4641,"children":4643},{"className":202,"code":4642,"language":12,"meta":8,"style":8},"const _audioCtx = new (window.AudioContext || window.webkitAudioContext)();\n\n    /**\n     * Allow the requester to load a new sfx, specifying a file to load.\n     * @param {string} sfxFile\n     * @returns {Promise\u003CArrayBuffer>}\n     */\n    async function load (sfxFile) {\n        const _sfxFile = await fetch(sfxFile);\n        return await _sfxFile.arrayBuffer();\n    };\n\n    /**\n     * Load and play the specified file.\n     * @param sfxFile\n     * @returns {Promise\u003CAudioBufferSourceNode>}\n     */\n    function play (sfxFile) {\n        return load(sfxFile).then((arrayBuffer) => {\n            const audioBuffer = _audioCtx.decodeAudioData(arrayBuffer);\n            const sourceNode = _audioCtx.createBufferSource();\n            sourceNode.buffer = audioBuffer;\n            sourceNode.connect(_audioCtx.destination);\n            sourceNode.start();\n\n            return sourceNode;\n        });\n    };\n",[4644],{"type":21,"tag":63,"props":4645,"children":4646},{"__ignoreMap":8},[4647,4683,4690,4698,4706,4729,4746,4754,4787,4817,4843,4851,4858,4865,4873,4888,4904,4911,4935,4975,5007,5036,5053,5071,5087,5094,5107,5115],{"type":21,"tag":209,"props":4648,"children":4649},{"class":211,"line":212},[4650,4654,4659,4663,4668,4673,4678],{"type":21,"tag":209,"props":4651,"children":4652},{"style":216},[4653],{"type":26,"value":260},{"type":21,"tag":209,"props":4655,"children":4656},{"style":263},[4657],{"type":26,"value":4658}," _audioCtx",{"type":21,"tag":209,"props":4660,"children":4661},{"style":216},[4662],{"type":26,"value":271},{"type":21,"tag":209,"props":4664,"children":4665},{"style":216},[4666],{"type":26,"value":4667}," new",{"type":21,"tag":209,"props":4669,"children":4670},{"style":222},[4671],{"type":26,"value":4672}," (window.AudioContext ",{"type":21,"tag":209,"props":4674,"children":4675},{"style":216},[4676],{"type":26,"value":4677},"||",{"type":21,"tag":209,"props":4679,"children":4680},{"style":222},[4681],{"type":26,"value":4682}," window.webkitAudioContext)();\n",{"type":21,"tag":209,"props":4684,"children":4685},{"class":211,"line":244},[4686],{"type":21,"tag":209,"props":4687,"children":4688},{"emptyLinePlaceholder":248},[4689],{"type":26,"value":251},{"type":21,"tag":209,"props":4691,"children":4692},{"class":211,"line":254},[4693],{"type":21,"tag":209,"props":4694,"children":4695},{"style":448},[4696],{"type":26,"value":4697},"    /**\n",{"type":21,"tag":209,"props":4699,"children":4700},{"class":211,"line":279},[4701],{"type":21,"tag":209,"props":4702,"children":4703},{"style":448},[4704],{"type":26,"value":4705},"     * Allow the requester to load a new sfx, specifying a file to load.\n",{"type":21,"tag":209,"props":4707,"children":4708},{"class":211,"line":288},[4709,4714,4719,4724],{"type":21,"tag":209,"props":4710,"children":4711},{"style":448},[4712],{"type":26,"value":4713},"     * ",{"type":21,"tag":209,"props":4715,"children":4716},{"style":216},[4717],{"type":26,"value":4718},"@param",{"type":21,"tag":209,"props":4720,"children":4721},{"style":360},[4722],{"type":26,"value":4723}," {string}",{"type":21,"tag":209,"props":4725,"children":4726},{"style":222},[4727],{"type":26,"value":4728}," sfxFile\n",{"type":21,"tag":209,"props":4730,"children":4731},{"class":211,"line":307},[4732,4736,4741],{"type":21,"tag":209,"props":4733,"children":4734},{"style":448},[4735],{"type":26,"value":4713},{"type":21,"tag":209,"props":4737,"children":4738},{"style":216},[4739],{"type":26,"value":4740},"@returns",{"type":21,"tag":209,"props":4742,"children":4743},{"style":360},[4744],{"type":26,"value":4745}," {Promise\u003CArrayBuffer>}\n",{"type":21,"tag":209,"props":4747,"children":4748},{"class":211,"line":325},[4749],{"type":21,"tag":209,"props":4750,"children":4751},{"style":448},[4752],{"type":26,"value":4753},"     */\n",{"type":21,"tag":209,"props":4755,"children":4756},{"class":211,"line":334},[4757,4762,4767,4772,4777,4782],{"type":21,"tag":209,"props":4758,"children":4759},{"style":216},[4760],{"type":26,"value":4761},"    async",{"type":21,"tag":209,"props":4763,"children":4764},{"style":216},[4765],{"type":26,"value":4766}," function",{"type":21,"tag":209,"props":4768,"children":4769},{"style":360},[4770],{"type":26,"value":4771}," load",{"type":21,"tag":209,"props":4773,"children":4774},{"style":222},[4775],{"type":26,"value":4776}," (",{"type":21,"tag":209,"props":4778,"children":4779},{"style":400},[4780],{"type":26,"value":4781},"sfxFile",{"type":21,"tag":209,"props":4783,"children":4784},{"style":222},[4785],{"type":26,"value":4786},") {\n",{"type":21,"tag":209,"props":4788,"children":4789},{"class":211,"line":343},[4790,4794,4799,4803,4807,4812],{"type":21,"tag":209,"props":4791,"children":4792},{"style":216},[4793],{"type":26,"value":3332},{"type":21,"tag":209,"props":4795,"children":4796},{"style":263},[4797],{"type":26,"value":4798}," _sfxFile",{"type":21,"tag":209,"props":4800,"children":4801},{"style":216},[4802],{"type":26,"value":271},{"type":21,"tag":209,"props":4804,"children":4805},{"style":216},[4806],{"type":26,"value":1437},{"type":21,"tag":209,"props":4808,"children":4809},{"style":360},[4810],{"type":26,"value":4811}," fetch",{"type":21,"tag":209,"props":4813,"children":4814},{"style":222},[4815],{"type":26,"value":4816},"(sfxFile);\n",{"type":21,"tag":209,"props":4818,"children":4819},{"class":211,"line":351},[4820,4824,4828,4833,4838],{"type":21,"tag":209,"props":4821,"children":4822},{"style":216},[4823],{"type":26,"value":3069},{"type":21,"tag":209,"props":4825,"children":4826},{"style":216},[4827],{"type":26,"value":1437},{"type":21,"tag":209,"props":4829,"children":4830},{"style":222},[4831],{"type":26,"value":4832}," _sfxFile.",{"type":21,"tag":209,"props":4834,"children":4835},{"style":360},[4836],{"type":26,"value":4837},"arrayBuffer",{"type":21,"tag":209,"props":4839,"children":4840},{"style":222},[4841],{"type":26,"value":4842},"();\n",{"type":21,"tag":209,"props":4844,"children":4845},{"class":211,"line":444},[4846],{"type":21,"tag":209,"props":4847,"children":4848},{"style":222},[4849],{"type":26,"value":4850},"    };\n",{"type":21,"tag":209,"props":4852,"children":4853},{"class":211,"line":454},[4854],{"type":21,"tag":209,"props":4855,"children":4856},{"emptyLinePlaceholder":248},[4857],{"type":26,"value":251},{"type":21,"tag":209,"props":4859,"children":4860},{"class":211,"line":463},[4861],{"type":21,"tag":209,"props":4862,"children":4863},{"style":448},[4864],{"type":26,"value":4697},{"type":21,"tag":209,"props":4866,"children":4867},{"class":211,"line":472},[4868],{"type":21,"tag":209,"props":4869,"children":4870},{"style":448},[4871],{"type":26,"value":4872},"     * Load and play the specified file.\n",{"type":21,"tag":209,"props":4874,"children":4875},{"class":211,"line":480},[4876,4880,4884],{"type":21,"tag":209,"props":4877,"children":4878},{"style":448},[4879],{"type":26,"value":4713},{"type":21,"tag":209,"props":4881,"children":4882},{"style":216},[4883],{"type":26,"value":4718},{"type":21,"tag":209,"props":4885,"children":4886},{"style":222},[4887],{"type":26,"value":4728},{"type":21,"tag":209,"props":4889,"children":4890},{"class":211,"line":489},[4891,4895,4899],{"type":21,"tag":209,"props":4892,"children":4893},{"style":448},[4894],{"type":26,"value":4713},{"type":21,"tag":209,"props":4896,"children":4897},{"style":216},[4898],{"type":26,"value":4740},{"type":21,"tag":209,"props":4900,"children":4901},{"style":360},[4902],{"type":26,"value":4903}," {Promise\u003CAudioBufferSourceNode>}\n",{"type":21,"tag":209,"props":4905,"children":4906},{"class":211,"line":847},[4907],{"type":21,"tag":209,"props":4908,"children":4909},{"style":448},[4910],{"type":26,"value":4753},{"type":21,"tag":209,"props":4912,"children":4913},{"class":211,"line":860},[4914,4918,4923,4927,4931],{"type":21,"tag":209,"props":4915,"children":4916},{"style":216},[4917],{"type":26,"value":2981},{"type":21,"tag":209,"props":4919,"children":4920},{"style":360},[4921],{"type":26,"value":4922}," play",{"type":21,"tag":209,"props":4924,"children":4925},{"style":222},[4926],{"type":26,"value":4776},{"type":21,"tag":209,"props":4928,"children":4929},{"style":400},[4930],{"type":26,"value":4781},{"type":21,"tag":209,"props":4932,"children":4933},{"style":222},[4934],{"type":26,"value":4786},{"type":21,"tag":209,"props":4936,"children":4937},{"class":211,"line":877},[4938,4942,4946,4951,4955,4959,4963,4967,4971],{"type":21,"tag":209,"props":4939,"children":4940},{"style":216},[4941],{"type":26,"value":3069},{"type":21,"tag":209,"props":4943,"children":4944},{"style":360},[4945],{"type":26,"value":4771},{"type":21,"tag":209,"props":4947,"children":4948},{"style":222},[4949],{"type":26,"value":4950},"(sfxFile).",{"type":21,"tag":209,"props":4952,"children":4953},{"style":360},[4954],{"type":26,"value":2704},{"type":21,"tag":209,"props":4956,"children":4957},{"style":222},[4958],{"type":26,"value":2709},{"type":21,"tag":209,"props":4960,"children":4961},{"style":400},[4962],{"type":26,"value":4837},{"type":21,"tag":209,"props":4964,"children":4965},{"style":222},[4966],{"type":26,"value":432},{"type":21,"tag":209,"props":4968,"children":4969},{"style":216},[4970],{"type":26,"value":437},{"type":21,"tag":209,"props":4972,"children":4973},{"style":222},[4974],{"type":26,"value":276},{"type":21,"tag":209,"props":4976,"children":4977},{"class":211,"line":889},[4978,4983,4988,4992,4997,5002],{"type":21,"tag":209,"props":4979,"children":4980},{"style":216},[4981],{"type":26,"value":4982},"            const",{"type":21,"tag":209,"props":4984,"children":4985},{"style":263},[4986],{"type":26,"value":4987}," audioBuffer",{"type":21,"tag":209,"props":4989,"children":4990},{"style":216},[4991],{"type":26,"value":271},{"type":21,"tag":209,"props":4993,"children":4994},{"style":222},[4995],{"type":26,"value":4996}," _audioCtx.",{"type":21,"tag":209,"props":4998,"children":4999},{"style":360},[5000],{"type":26,"value":5001},"decodeAudioData",{"type":21,"tag":209,"props":5003,"children":5004},{"style":222},[5005],{"type":26,"value":5006},"(arrayBuffer);\n",{"type":21,"tag":209,"props":5008,"children":5009},{"class":211,"line":902},[5010,5014,5019,5023,5027,5032],{"type":21,"tag":209,"props":5011,"children":5012},{"style":216},[5013],{"type":26,"value":4982},{"type":21,"tag":209,"props":5015,"children":5016},{"style":263},[5017],{"type":26,"value":5018}," sourceNode",{"type":21,"tag":209,"props":5020,"children":5021},{"style":216},[5022],{"type":26,"value":271},{"type":21,"tag":209,"props":5024,"children":5025},{"style":222},[5026],{"type":26,"value":4996},{"type":21,"tag":209,"props":5028,"children":5029},{"style":360},[5030],{"type":26,"value":5031},"createBufferSource",{"type":21,"tag":209,"props":5033,"children":5034},{"style":222},[5035],{"type":26,"value":4842},{"type":21,"tag":209,"props":5037,"children":5038},{"class":211,"line":914},[5039,5044,5048],{"type":21,"tag":209,"props":5040,"children":5041},{"style":222},[5042],{"type":26,"value":5043},"            sourceNode.buffer ",{"type":21,"tag":209,"props":5045,"children":5046},{"style":216},[5047],{"type":26,"value":1432},{"type":21,"tag":209,"props":5049,"children":5050},{"style":222},[5051],{"type":26,"value":5052}," audioBuffer;\n",{"type":21,"tag":209,"props":5054,"children":5055},{"class":211,"line":922},[5056,5061,5066],{"type":21,"tag":209,"props":5057,"children":5058},{"style":222},[5059],{"type":26,"value":5060},"            sourceNode.",{"type":21,"tag":209,"props":5062,"children":5063},{"style":360},[5064],{"type":26,"value":5065},"connect",{"type":21,"tag":209,"props":5067,"children":5068},{"style":222},[5069],{"type":26,"value":5070},"(_audioCtx.destination);\n",{"type":21,"tag":209,"props":5072,"children":5073},{"class":211,"line":2312},[5074,5078,5083],{"type":21,"tag":209,"props":5075,"children":5076},{"style":222},[5077],{"type":26,"value":5060},{"type":21,"tag":209,"props":5079,"children":5080},{"style":360},[5081],{"type":26,"value":5082},"start",{"type":21,"tag":209,"props":5084,"children":5085},{"style":222},[5086],{"type":26,"value":4842},{"type":21,"tag":209,"props":5088,"children":5089},{"class":211,"line":2321},[5090],{"type":21,"tag":209,"props":5091,"children":5092},{"emptyLinePlaceholder":248},[5093],{"type":26,"value":251},{"type":21,"tag":209,"props":5095,"children":5096},{"class":211,"line":2372},[5097,5102],{"type":21,"tag":209,"props":5098,"children":5099},{"style":216},[5100],{"type":26,"value":5101},"            return",{"type":21,"tag":209,"props":5103,"children":5104},{"style":222},[5105],{"type":26,"value":5106}," sourceNode;\n",{"type":21,"tag":209,"props":5108,"children":5109},{"class":211,"line":2381},[5110],{"type":21,"tag":209,"props":5111,"children":5112},{"style":222},[5113],{"type":26,"value":5114},"        });\n",{"type":21,"tag":209,"props":5116,"children":5117},{"class":211,"line":2389},[5118],{"type":21,"tag":209,"props":5119,"children":5120},{"style":222},[5121],{"type":26,"value":4850},{"type":21,"tag":22,"props":5123,"children":5124},{},[5125],{"type":26,"value":5126},"Okay, let's unpack it:",{"type":21,"tag":22,"props":5128,"children":5129},{},[5130,5132,5139,5141,5148,5150,5156,5158,5164],{"type":26,"value":5131},"First, we create our ",{"type":21,"tag":29,"props":5133,"children":5136},{"href":5134,"rel":5135},"https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/AudioContext",[93],[5137],{"type":26,"value":5138},"audio context",{"type":26,"value":5140},"—if you've dealt with the ",{"type":21,"tag":29,"props":5142,"children":5145},{"href":5143,"rel":5144},"https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API",[93],[5146],{"type":26,"value":5147},"Canvas API",{"type":26,"value":5149}," this is familiar—this is going to be our audio processing graph object. We look for the standard ",{"type":21,"tag":63,"props":5151,"children":5153},{"className":5152},[],[5154],{"type":26,"value":5155},"AudioContext",{"type":26,"value":5157}," object first, and if we can't find, we try to fall back to the browser-prefixed version, ",{"type":21,"tag":63,"props":5159,"children":5161},{"className":5160},[],[5162],{"type":26,"value":5163},"webkitAudioContext",{"type":26,"value":5165},", to broaden our browser support.",{"type":21,"tag":22,"props":5167,"children":5168},{},[5169,5171,5178],{"type":26,"value":5170},"Then, we declare an ",{"type":21,"tag":29,"props":5172,"children":5175},{"href":5173,"rel":5174},"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function",[93],[5176],{"type":26,"value":5177},"async function",{"type":26,"value":5179},". This is part of the ECMAScript 2017 spec, but if you're able to use the Web Audio API, you're probably able to use this too. Async/Await is a wonderful bit of sugar over Promises, and you should take advantage of it if you can.",{"type":21,"tag":22,"props":5181,"children":5182},{},[5183,5185,5191,5193,5200],{"type":26,"value":5184},"Within this async function, ",{"type":21,"tag":63,"props":5186,"children":5188},{"className":5187},[],[5189],{"type":26,"value":5190},"load",{"type":26,"value":5192},", we rely on the ",{"type":21,"tag":29,"props":5194,"children":5197},{"href":5195,"rel":5196},"https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API",[93],[5198],{"type":26,"value":5199},"Fetch API",{"type":26,"value":5201}," to go and get the file for us (my, aren't we linking to MDN an awful lot in this post!). There's no reason we couldn't use XMLHttpRequest here instead, but fetch is wonderfully compact and again, if you can use Web Audio, you can almost certainly use fetch.",{"type":21,"tag":22,"props":5203,"children":5204},{},[5205,5206,5213],{"type":26,"value":27},{"type":21,"tag":29,"props":5207,"children":5210},{"href":5208,"rel":5209},"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/await",[93],[5211],{"type":26,"value":5212},"await",{"type":26,"value":5214}," the response from fetch, and then get the response body as an array buffer and return it.",{"type":21,"tag":22,"props":5216,"children":5217},{},[5218,5219,5225,5227,5232,5234,5239,5241,5248,5250,5256],{"type":26,"value":1604},{"type":21,"tag":63,"props":5220,"children":5222},{"className":5221},[],[5223],{"type":26,"value":5224},"play",{"type":26,"value":5226},", we perform both the loading and playing, so our api becomes just a call to ",{"type":21,"tag":63,"props":5228,"children":5230},{"className":5229},[],[5231],{"type":26,"value":5224},{"type":26,"value":5233}," with the file location and wait on the promise returned from our async ",{"type":21,"tag":63,"props":5235,"children":5237},{"className":5236},[],[5238],{"type":26,"value":5190},{"type":26,"value":5240}," function. Then, we need to decode the audio data, turning it into PCM, and then create an ",{"type":21,"tag":29,"props":5242,"children":5245},{"href":5243,"rel":5244},"https://developer.mozilla.org/en-US/docs/Web/API/AudioBufferSourceNode",[93],[5246],{"type":26,"value":5247},"AudioBufferSourceNode",{"type":26,"value":5249}," from the return (that's the call to ",{"type":21,"tag":63,"props":5251,"children":5253},{"className":5252},[],[5254],{"type":26,"value":5255},"_audioCtx.createBufferSource()",{"type":26,"value":2699},{"type":21,"tag":22,"props":5258,"children":5259},{},[5260,5262,5267,5269,5275,5277,5282],{"type":26,"value":5261},"We then set our buffer source to draw from the audio buffer we've created out of the array buffer we created out of the file (",{"type":21,"tag":1084,"props":5263,"children":5264},{},[5265],{"type":26,"value":5266},"whew",{"type":26,"value":5268},"), and connect it to the destination of the audio context (e.g. the audio context output, like speakers), and ",{"type":21,"tag":5270,"props":5271,"children":5272},"strong",{},[5273],{"type":26,"value":5274},"finally",{"type":26,"value":5276}," we can call ",{"type":21,"tag":63,"props":5278,"children":5280},{"className":5279},[],[5281],{"type":26,"value":5082},{"type":26,"value":5283}," on the sourceNode to have it start pumping its audio into the audio context.",{"type":21,"tag":22,"props":5285,"children":5286},{},[5287],{"type":26,"value":5288},"Easy-peasy.",{"type":21,"tag":22,"props":5290,"children":5291},{},[5292,5294,5299],{"type":26,"value":5293},"Except... if you do this with your ",{"type":21,"tag":63,"props":5295,"children":5297},{"className":5296},[],[5298],{"type":26,"value":4609},{"type":26,"value":5300}," file, you won't hear anything. The file will successfully be fetched, loaded, decoded... but not played. What's going on?",{"type":21,"tag":51,"props":5302,"children":5304},{"id":5303},"now-hear-this",[5305],{"type":26,"value":5306},"Now Hear This",{"type":21,"tag":22,"props":5308,"children":5309},{},[5310,5312,5319],{"type":26,"value":5311},"You've hit the browser's ",{"type":21,"tag":29,"props":5313,"children":5316},{"href":5314,"rel":5315},"https://developers.google.com/web/updates/2018/11/web-audio-autoplay",[93],[5317],{"type":26,"value":5318},"autoplay policy",{"type":26,"value":5320},". Nobody likes opening a new tab and having whatever website they've just navigated to start blaring their addiction to spongebob to the whole office. So, most browsers have various autoplay policies which restrict what the page can do with media before the user has interacted with it.",{"type":21,"tag":22,"props":5322,"children":5323},{},[5324],{"type":26,"value":5325},"For our purposes today, this boils down to not being able to play audio until the user has interacted with the page in some easily measurable way - that is, clicked/tapped on it.",{"type":21,"tag":22,"props":5327,"children":5328},{},[5329],{"type":26,"value":5330},"So, in order to unlock our audio, we'll need to listen for that interaction, and wait to play our sounds until after we've received it. We don't want to have to download and play real audio to make that happen, so we'll need to create an empty sound buffer that we can use as our stalking horse.",{"type":21,"tag":22,"props":5332,"children":5333},{},[5334],{"type":26,"value":5335},"Also, if you tried the above example on iOS, it would have failed regardless of autoplay policies, because iOS is a special snowflake and hasn't updated their audio APIs in a while. Let's handle that too.",{"type":21,"tag":22,"props":5337,"children":5338},{},[5339],{"type":26,"value":5340},"Oh, and it would be nice not to need to re-download a file every time we want to play it if we anticipate needing to play it multiple times. Let's throw that in there for good measure.",{"type":21,"tag":51,"props":5342,"children":5344},{"id":5343},"kiss-redux",[5345],{"type":26,"value":5346},"KISS Redux",{"type":21,"tag":22,"props":5348,"children":5349},{},[5350],{"type":26,"value":5351},"Let's update our example above, and we'll walk through the new bits together:",{"type":21,"tag":200,"props":5353,"children":5355},{"className":202,"code":5354,"language":12,"meta":8,"style":8},"(function() {\n    const _af_buffers = new Map(),\n        _audioCtx = new (window.AudioContext || window.webkitAudioContext)();\n    let _isUnlocked = false;\n\n    /**\n     * A shim to handle browsers which still expect the old callback-based decodeAudioData,\n     * notably iOS Safari - as usual.\n     * @param arraybuffer\n     * @returns {Promise\u003Cany>}\n     * @private\n     */\n    function _decodeShim(arraybuffer) {\n        return new Promise((resolve, reject) => {\n            _audioCtx.decodeAudioData(arraybuffer, (buffer) => {\n                return resolve(buffer);\n            }, (err) => {\n                return reject(err);\n            });\n        });\n    }\n\n    /**\n     * Some browsers/devices will only allow audio to be played after a user interaction.\n     * Attempt to automatically unlock audio on the first user interaction.\n     * Concept from: http://paulbakaus.com/tutorials/html5/web-audio-on-ios/\n     * Borrows in part from: https://github.com/goldfire/howler.js/blob/master/src/howler.core.js\n     */\n    function _unlockAudio() {\n        if (_isUnlocked) return;\n\n        // Scratch buffer to prevent memory leaks on iOS.\n        // See: https://stackoverflow.com/questions/24119684/web-audio-api-memory-leaks-on-mobile-platforms\n        const _scratchBuffer = _audioCtx.createBuffer(1, 1, 22050);\n\n        // We call this when user interaction will allow us to unlock\n        // the audio API.\n        var unlock = function (e) {\n            var source = _audioCtx.createBufferSource();\n            source.buffer = _scratchBuffer;\n            source.connect(_audioCtx.destination);\n\n            // Play the empty buffer.\n            source.start(0);\n\n            // Calling resume() on a stack initiated by user gesture is\n            // what actually unlocks the audio on Chrome >= 55.\n            if (typeof _audioCtx.resume === 'function') {\n                _audioCtx.resume();\n            }\n\n            // Once the source has fired the onended event, indicating it did indeed play,\n            // we can know that the audio API is now unlocked.\n            source.onended = function () {\n                source.disconnect(0);\n\n                // Don't bother trying to unlock the API more than once!\n                _isUnlocked = true;\n\n                // Remove the click/touch listeners.\n                document.removeEventListener('touchstart', unlock, true);\n                document.removeEventListener('touchend', unlock, true);\n                document.removeEventListener('click', unlock, true);\n            };\n        };\n\n        // Setup click/touch listeners to capture the first interaction\n        // within this context.\n        document.addEventListener('touchstart', unlock, true);\n        document.addEventListener('touchend', unlock, true);\n        document.addEventListener('click', unlock, true);\n    }\n\n    /**\n     * Allow the requester to load a new sfx, specifying a file to load.\n     * We store the decoded audio data for future (re-)use.\n     * @param {string} sfxFile\n     * @returns {Promise\u003CAudioBuffer>}\n     */\n    async function load (sfxFile) {\n        if (_af_buffers.has(sfxFile)) {\n            return _af_buffers.get(sfxFile);\n        }\n\n        const _sfxFile = await fetch(sfxFile);\n        const arraybuffer = await _sfxFile.arrayBuffer();\n        let audiobuffer;\n\n        try {\n            audiobuffer = await _audioCtx.decodeAudioData(arraybuffer);\n        } catch (e) {\n            // Browser wants older callback based usage of decodeAudioData\n            audiobuffer = await _decodeShim(arraybuffer);\n        }\n\n        _af_buffers.set(sfxFile, audiobuffer);\n\n        return audiobuffer;\n    };\n\n    /**\n     * Play the specified file, loading it first - either retrieving it from the saved buffers, or fetching\n     * it from the network.\n     * @param sfxFile\n     * @returns {Promise\u003CAudioBufferSourceNode>}\n     */\n    function play (sfxFile) {\n        return load(sfxFile).then((audioBuffer) => {\n            const sourceNode = _audioCtx.createBufferSource();\n            sourceNode.buffer = audioBuffer;\n            sourceNode.connect(_audioCtx.destination);\n            sourceNode.start();\n\n            return sourceNode;\n        });\n    };\n\n    _unlockAudio();\n}());\n\n",[5356],{"type":21,"tag":63,"props":5357,"children":5358},{"__ignoreMap":8},[5359,5376,5406,5434,5460,5467,5474,5482,5490,5506,5522,5534,5541,5566,5612,5646,5664,5689,5706,5713,5720,5727,5734,5741,5749,5757,5765,5773,5780,5796,5818,5825,5833,5841,5895,5902,5910,5918,5952,5981,5998,6014,6021,6029,6053,6060,6068,6076,6112,6129,6137,6144,6152,6160,6185,6210,6217,6226,6248,6256,6265,6301,6334,6367,6376,6385,6393,6402,6411,6445,6477,6509,6517,6525,6533,6541,6550,6570,6587,6595,6623,6646,6668,6676,6684,6712,6745,6759,6767,6780,6810,6829,6838,6862,6870,6878,6897,6905,6917,6925,6933,6941,6950,6959,6975,6991,6999,7023,7064,7092,7108,7124,7140,7148,7160,7168,7176,7184,7197],{"type":21,"tag":209,"props":5360,"children":5361},{"class":211,"line":212},[5362,5366,5371],{"type":21,"tag":209,"props":5363,"children":5364},{"style":222},[5365],{"type":26,"value":368},{"type":21,"tag":209,"props":5367,"children":5368},{"style":216},[5369],{"type":26,"value":5370},"function",{"type":21,"tag":209,"props":5372,"children":5373},{"style":222},[5374],{"type":26,"value":5375},"() {\n",{"type":21,"tag":209,"props":5377,"children":5378},{"class":211,"line":244},[5379,5383,5388,5392,5396,5401],{"type":21,"tag":209,"props":5380,"children":5381},{"style":216},[5382],{"type":26,"value":1268},{"type":21,"tag":209,"props":5384,"children":5385},{"style":263},[5386],{"type":26,"value":5387}," _af_buffers",{"type":21,"tag":209,"props":5389,"children":5390},{"style":216},[5391],{"type":26,"value":271},{"type":21,"tag":209,"props":5393,"children":5394},{"style":216},[5395],{"type":26,"value":4667},{"type":21,"tag":209,"props":5397,"children":5398},{"style":360},[5399],{"type":26,"value":5400}," Map",{"type":21,"tag":209,"props":5402,"children":5403},{"style":222},[5404],{"type":26,"value":5405},"(),\n",{"type":21,"tag":209,"props":5407,"children":5408},{"class":211,"line":254},[5409,5414,5418,5422,5426,5430],{"type":21,"tag":209,"props":5410,"children":5411},{"style":263},[5412],{"type":26,"value":5413},"        _audioCtx",{"type":21,"tag":209,"props":5415,"children":5416},{"style":216},[5417],{"type":26,"value":271},{"type":21,"tag":209,"props":5419,"children":5420},{"style":216},[5421],{"type":26,"value":4667},{"type":21,"tag":209,"props":5423,"children":5424},{"style":222},[5425],{"type":26,"value":4672},{"type":21,"tag":209,"props":5427,"children":5428},{"style":216},[5429],{"type":26,"value":4677},{"type":21,"tag":209,"props":5431,"children":5432},{"style":222},[5433],{"type":26,"value":4682},{"type":21,"tag":209,"props":5435,"children":5436},{"class":211,"line":279},[5437,5442,5447,5451,5456],{"type":21,"tag":209,"props":5438,"children":5439},{"style":216},[5440],{"type":26,"value":5441},"    let",{"type":21,"tag":209,"props":5443,"children":5444},{"style":222},[5445],{"type":26,"value":5446}," _isUnlocked ",{"type":21,"tag":209,"props":5448,"children":5449},{"style":216},[5450],{"type":26,"value":1432},{"type":21,"tag":209,"props":5452,"children":5453},{"style":263},[5454],{"type":26,"value":5455}," false",{"type":21,"tag":209,"props":5457,"children":5458},{"style":222},[5459],{"type":26,"value":241},{"type":21,"tag":209,"props":5461,"children":5462},{"class":211,"line":288},[5463],{"type":21,"tag":209,"props":5464,"children":5465},{"emptyLinePlaceholder":248},[5466],{"type":26,"value":251},{"type":21,"tag":209,"props":5468,"children":5469},{"class":211,"line":307},[5470],{"type":21,"tag":209,"props":5471,"children":5472},{"style":448},[5473],{"type":26,"value":4697},{"type":21,"tag":209,"props":5475,"children":5476},{"class":211,"line":325},[5477],{"type":21,"tag":209,"props":5478,"children":5479},{"style":448},[5480],{"type":26,"value":5481},"     * A shim to handle browsers which still expect the old callback-based decodeAudioData,\n",{"type":21,"tag":209,"props":5483,"children":5484},{"class":211,"line":334},[5485],{"type":21,"tag":209,"props":5486,"children":5487},{"style":448},[5488],{"type":26,"value":5489},"     * notably iOS Safari - as usual.\n",{"type":21,"tag":209,"props":5491,"children":5492},{"class":211,"line":343},[5493,5497,5501],{"type":21,"tag":209,"props":5494,"children":5495},{"style":448},[5496],{"type":26,"value":4713},{"type":21,"tag":209,"props":5498,"children":5499},{"style":216},[5500],{"type":26,"value":4718},{"type":21,"tag":209,"props":5502,"children":5503},{"style":222},[5504],{"type":26,"value":5505}," arraybuffer\n",{"type":21,"tag":209,"props":5507,"children":5508},{"class":211,"line":351},[5509,5513,5517],{"type":21,"tag":209,"props":5510,"children":5511},{"style":448},[5512],{"type":26,"value":4713},{"type":21,"tag":209,"props":5514,"children":5515},{"style":216},[5516],{"type":26,"value":4740},{"type":21,"tag":209,"props":5518,"children":5519},{"style":360},[5520],{"type":26,"value":5521}," {Promise\u003Cany>}\n",{"type":21,"tag":209,"props":5523,"children":5524},{"class":211,"line":444},[5525,5529],{"type":21,"tag":209,"props":5526,"children":5527},{"style":448},[5528],{"type":26,"value":4713},{"type":21,"tag":209,"props":5530,"children":5531},{"style":216},[5532],{"type":26,"value":5533},"@private\n",{"type":21,"tag":209,"props":5535,"children":5536},{"class":211,"line":454},[5537],{"type":21,"tag":209,"props":5538,"children":5539},{"style":448},[5540],{"type":26,"value":4753},{"type":21,"tag":209,"props":5542,"children":5543},{"class":211,"line":463},[5544,5548,5553,5557,5562],{"type":21,"tag":209,"props":5545,"children":5546},{"style":216},[5547],{"type":26,"value":2981},{"type":21,"tag":209,"props":5549,"children":5550},{"style":360},[5551],{"type":26,"value":5552}," _decodeShim",{"type":21,"tag":209,"props":5554,"children":5555},{"style":222},[5556],{"type":26,"value":368},{"type":21,"tag":209,"props":5558,"children":5559},{"style":400},[5560],{"type":26,"value":5561},"arraybuffer",{"type":21,"tag":209,"props":5563,"children":5564},{"style":222},[5565],{"type":26,"value":4786},{"type":21,"tag":209,"props":5567,"children":5568},{"class":211,"line":472},[5569,5573,5577,5582,5586,5591,5595,5600,5604,5608],{"type":21,"tag":209,"props":5570,"children":5571},{"style":216},[5572],{"type":26,"value":3069},{"type":21,"tag":209,"props":5574,"children":5575},{"style":216},[5576],{"type":26,"value":4667},{"type":21,"tag":209,"props":5578,"children":5579},{"style":263},[5580],{"type":26,"value":5581}," Promise",{"type":21,"tag":209,"props":5583,"children":5584},{"style":222},[5585],{"type":26,"value":2709},{"type":21,"tag":209,"props":5587,"children":5588},{"style":400},[5589],{"type":26,"value":5590},"resolve",{"type":21,"tag":209,"props":5592,"children":5593},{"style":222},[5594],{"type":26,"value":408},{"type":21,"tag":209,"props":5596,"children":5597},{"style":400},[5598],{"type":26,"value":5599},"reject",{"type":21,"tag":209,"props":5601,"children":5602},{"style":222},[5603],{"type":26,"value":432},{"type":21,"tag":209,"props":5605,"children":5606},{"style":216},[5607],{"type":26,"value":437},{"type":21,"tag":209,"props":5609,"children":5610},{"style":222},[5611],{"type":26,"value":276},{"type":21,"tag":209,"props":5613,"children":5614},{"class":211,"line":480},[5615,5620,5624,5629,5634,5638,5642],{"type":21,"tag":209,"props":5616,"children":5617},{"style":222},[5618],{"type":26,"value":5619},"            _audioCtx.",{"type":21,"tag":209,"props":5621,"children":5622},{"style":360},[5623],{"type":26,"value":5001},{"type":21,"tag":209,"props":5625,"children":5626},{"style":222},[5627],{"type":26,"value":5628},"(arraybuffer, (",{"type":21,"tag":209,"props":5630,"children":5631},{"style":400},[5632],{"type":26,"value":5633},"buffer",{"type":21,"tag":209,"props":5635,"children":5636},{"style":222},[5637],{"type":26,"value":432},{"type":21,"tag":209,"props":5639,"children":5640},{"style":216},[5641],{"type":26,"value":437},{"type":21,"tag":209,"props":5643,"children":5644},{"style":222},[5645],{"type":26,"value":276},{"type":21,"tag":209,"props":5647,"children":5648},{"class":211,"line":489},[5649,5654,5659],{"type":21,"tag":209,"props":5650,"children":5651},{"style":216},[5652],{"type":26,"value":5653},"                return",{"type":21,"tag":209,"props":5655,"children":5656},{"style":360},[5657],{"type":26,"value":5658}," resolve",{"type":21,"tag":209,"props":5660,"children":5661},{"style":222},[5662],{"type":26,"value":5663},"(buffer);\n",{"type":21,"tag":209,"props":5665,"children":5666},{"class":211,"line":847},[5667,5672,5677,5681,5685],{"type":21,"tag":209,"props":5668,"children":5669},{"style":222},[5670],{"type":26,"value":5671},"            }, (",{"type":21,"tag":209,"props":5673,"children":5674},{"style":400},[5675],{"type":26,"value":5676},"err",{"type":21,"tag":209,"props":5678,"children":5679},{"style":222},[5680],{"type":26,"value":432},{"type":21,"tag":209,"props":5682,"children":5683},{"style":216},[5684],{"type":26,"value":437},{"type":21,"tag":209,"props":5686,"children":5687},{"style":222},[5688],{"type":26,"value":276},{"type":21,"tag":209,"props":5690,"children":5691},{"class":211,"line":860},[5692,5696,5701],{"type":21,"tag":209,"props":5693,"children":5694},{"style":216},[5695],{"type":26,"value":5653},{"type":21,"tag":209,"props":5697,"children":5698},{"style":360},[5699],{"type":26,"value":5700}," reject",{"type":21,"tag":209,"props":5702,"children":5703},{"style":222},[5704],{"type":26,"value":5705},"(err);\n",{"type":21,"tag":209,"props":5707,"children":5708},{"class":211,"line":877},[5709],{"type":21,"tag":209,"props":5710,"children":5711},{"style":222},[5712],{"type":26,"value":2782},{"type":21,"tag":209,"props":5714,"children":5715},{"class":211,"line":889},[5716],{"type":21,"tag":209,"props":5717,"children":5718},{"style":222},[5719],{"type":26,"value":5114},{"type":21,"tag":209,"props":5721,"children":5722},{"class":211,"line":902},[5723],{"type":21,"tag":209,"props":5724,"children":5725},{"style":222},[5726],{"type":26,"value":331},{"type":21,"tag":209,"props":5728,"children":5729},{"class":211,"line":914},[5730],{"type":21,"tag":209,"props":5731,"children":5732},{"emptyLinePlaceholder":248},[5733],{"type":26,"value":251},{"type":21,"tag":209,"props":5735,"children":5736},{"class":211,"line":922},[5737],{"type":21,"tag":209,"props":5738,"children":5739},{"style":448},[5740],{"type":26,"value":4697},{"type":21,"tag":209,"props":5742,"children":5743},{"class":211,"line":2312},[5744],{"type":21,"tag":209,"props":5745,"children":5746},{"style":448},[5747],{"type":26,"value":5748},"     * Some browsers/devices will only allow audio to be played after a user interaction.\n",{"type":21,"tag":209,"props":5750,"children":5751},{"class":211,"line":2321},[5752],{"type":21,"tag":209,"props":5753,"children":5754},{"style":448},[5755],{"type":26,"value":5756},"     * Attempt to automatically unlock audio on the first user interaction.\n",{"type":21,"tag":209,"props":5758,"children":5759},{"class":211,"line":2372},[5760],{"type":21,"tag":209,"props":5761,"children":5762},{"style":448},[5763],{"type":26,"value":5764},"     * Concept from: http://paulbakaus.com/tutorials/html5/web-audio-on-ios/\n",{"type":21,"tag":209,"props":5766,"children":5767},{"class":211,"line":2381},[5768],{"type":21,"tag":209,"props":5769,"children":5770},{"style":448},[5771],{"type":26,"value":5772},"     * Borrows in part from: https://github.com/goldfire/howler.js/blob/master/src/howler.core.js\n",{"type":21,"tag":209,"props":5774,"children":5775},{"class":211,"line":2389},[5776],{"type":21,"tag":209,"props":5777,"children":5778},{"style":448},[5779],{"type":26,"value":4753},{"type":21,"tag":209,"props":5781,"children":5782},{"class":211,"line":2397},[5783,5787,5792],{"type":21,"tag":209,"props":5784,"children":5785},{"style":216},[5786],{"type":26,"value":2981},{"type":21,"tag":209,"props":5788,"children":5789},{"style":360},[5790],{"type":26,"value":5791}," _unlockAudio",{"type":21,"tag":209,"props":5793,"children":5794},{"style":222},[5795],{"type":26,"value":5375},{"type":21,"tag":209,"props":5797,"children":5798},{"class":211,"line":2406},[5799,5804,5809,5814],{"type":21,"tag":209,"props":5800,"children":5801},{"style":216},[5802],{"type":26,"value":5803},"        if",{"type":21,"tag":209,"props":5805,"children":5806},{"style":222},[5807],{"type":26,"value":5808}," (_isUnlocked) ",{"type":21,"tag":209,"props":5810,"children":5811},{"style":216},[5812],{"type":26,"value":5813},"return",{"type":21,"tag":209,"props":5815,"children":5816},{"style":222},[5817],{"type":26,"value":241},{"type":21,"tag":209,"props":5819,"children":5820},{"class":211,"line":2415},[5821],{"type":21,"tag":209,"props":5822,"children":5823},{"emptyLinePlaceholder":248},[5824],{"type":26,"value":251},{"type":21,"tag":209,"props":5826,"children":5827},{"class":211,"line":2424},[5828],{"type":21,"tag":209,"props":5829,"children":5830},{"style":448},[5831],{"type":26,"value":5832},"        // Scratch buffer to prevent memory leaks on iOS.\n",{"type":21,"tag":209,"props":5834,"children":5835},{"class":211,"line":2433},[5836],{"type":21,"tag":209,"props":5837,"children":5838},{"style":448},[5839],{"type":26,"value":5840},"        // See: https://stackoverflow.com/questions/24119684/web-audio-api-memory-leaks-on-mobile-platforms\n",{"type":21,"tag":209,"props":5842,"children":5843},{"class":211,"line":2442},[5844,5848,5853,5857,5861,5866,5870,5874,5878,5882,5886,5891],{"type":21,"tag":209,"props":5845,"children":5846},{"style":216},[5847],{"type":26,"value":3332},{"type":21,"tag":209,"props":5849,"children":5850},{"style":263},[5851],{"type":26,"value":5852}," _scratchBuffer",{"type":21,"tag":209,"props":5854,"children":5855},{"style":216},[5856],{"type":26,"value":271},{"type":21,"tag":209,"props":5858,"children":5859},{"style":222},[5860],{"type":26,"value":4996},{"type":21,"tag":209,"props":5862,"children":5863},{"style":360},[5864],{"type":26,"value":5865},"createBuffer",{"type":21,"tag":209,"props":5867,"children":5868},{"style":222},[5869],{"type":26,"value":368},{"type":21,"tag":209,"props":5871,"children":5872},{"style":263},[5873],{"type":26,"value":3224},{"type":21,"tag":209,"props":5875,"children":5876},{"style":222},[5877],{"type":26,"value":408},{"type":21,"tag":209,"props":5879,"children":5880},{"style":263},[5881],{"type":26,"value":3224},{"type":21,"tag":209,"props":5883,"children":5884},{"style":222},[5885],{"type":26,"value":408},{"type":21,"tag":209,"props":5887,"children":5888},{"style":263},[5889],{"type":26,"value":5890},"22050",{"type":21,"tag":209,"props":5892,"children":5893},{"style":222},[5894],{"type":26,"value":2608},{"type":21,"tag":209,"props":5896,"children":5897},{"class":211,"line":2471},[5898],{"type":21,"tag":209,"props":5899,"children":5900},{"emptyLinePlaceholder":248},[5901],{"type":26,"value":251},{"type":21,"tag":209,"props":5903,"children":5904},{"class":211,"line":2480},[5905],{"type":21,"tag":209,"props":5906,"children":5907},{"style":448},[5908],{"type":26,"value":5909},"        // We call this when user interaction will allow us to unlock\n",{"type":21,"tag":209,"props":5911,"children":5912},{"class":211,"line":2489},[5913],{"type":21,"tag":209,"props":5914,"children":5915},{"style":448},[5916],{"type":26,"value":5917},"        // the audio API.\n",{"type":21,"tag":209,"props":5919,"children":5920},{"class":211,"line":2516},[5921,5926,5931,5935,5939,5943,5948],{"type":21,"tag":209,"props":5922,"children":5923},{"style":216},[5924],{"type":26,"value":5925},"        var",{"type":21,"tag":209,"props":5927,"children":5928},{"style":360},[5929],{"type":26,"value":5930}," unlock",{"type":21,"tag":209,"props":5932,"children":5933},{"style":216},[5934],{"type":26,"value":271},{"type":21,"tag":209,"props":5936,"children":5937},{"style":216},[5938],{"type":26,"value":4766},{"type":21,"tag":209,"props":5940,"children":5941},{"style":222},[5942],{"type":26,"value":4776},{"type":21,"tag":209,"props":5944,"children":5945},{"style":400},[5946],{"type":26,"value":5947},"e",{"type":21,"tag":209,"props":5949,"children":5950},{"style":222},[5951],{"type":26,"value":4786},{"type":21,"tag":209,"props":5953,"children":5954},{"class":211,"line":2525},[5955,5960,5965,5969,5973,5977],{"type":21,"tag":209,"props":5956,"children":5957},{"style":216},[5958],{"type":26,"value":5959},"            var",{"type":21,"tag":209,"props":5961,"children":5962},{"style":222},[5963],{"type":26,"value":5964}," source ",{"type":21,"tag":209,"props":5966,"children":5967},{"style":216},[5968],{"type":26,"value":1432},{"type":21,"tag":209,"props":5970,"children":5971},{"style":222},[5972],{"type":26,"value":4996},{"type":21,"tag":209,"props":5974,"children":5975},{"style":360},[5976],{"type":26,"value":5031},{"type":21,"tag":209,"props":5978,"children":5979},{"style":222},[5980],{"type":26,"value":4842},{"type":21,"tag":209,"props":5982,"children":5983},{"class":211,"line":2533},[5984,5989,5993],{"type":21,"tag":209,"props":5985,"children":5986},{"style":222},[5987],{"type":26,"value":5988},"            source.buffer ",{"type":21,"tag":209,"props":5990,"children":5991},{"style":216},[5992],{"type":26,"value":1432},{"type":21,"tag":209,"props":5994,"children":5995},{"style":222},[5996],{"type":26,"value":5997}," _scratchBuffer;\n",{"type":21,"tag":209,"props":5999,"children":6000},{"class":211,"line":2542},[6001,6006,6010],{"type":21,"tag":209,"props":6002,"children":6003},{"style":222},[6004],{"type":26,"value":6005},"            source.",{"type":21,"tag":209,"props":6007,"children":6008},{"style":360},[6009],{"type":26,"value":5065},{"type":21,"tag":209,"props":6011,"children":6012},{"style":222},[6013],{"type":26,"value":5070},{"type":21,"tag":209,"props":6015,"children":6016},{"class":211,"line":2550},[6017],{"type":21,"tag":209,"props":6018,"children":6019},{"emptyLinePlaceholder":248},[6020],{"type":26,"value":251},{"type":21,"tag":209,"props":6022,"children":6023},{"class":211,"line":2564},[6024],{"type":21,"tag":209,"props":6025,"children":6026},{"style":448},[6027],{"type":26,"value":6028},"            // Play the empty buffer.\n",{"type":21,"tag":209,"props":6030,"children":6031},{"class":211,"line":2611},[6032,6036,6040,6044,6049],{"type":21,"tag":209,"props":6033,"children":6034},{"style":222},[6035],{"type":26,"value":6005},{"type":21,"tag":209,"props":6037,"children":6038},{"style":360},[6039],{"type":26,"value":5082},{"type":21,"tag":209,"props":6041,"children":6042},{"style":222},[6043],{"type":26,"value":368},{"type":21,"tag":209,"props":6045,"children":6046},{"style":263},[6047],{"type":26,"value":6048},"0",{"type":21,"tag":209,"props":6050,"children":6051},{"style":222},[6052],{"type":26,"value":2608},{"type":21,"tag":209,"props":6054,"children":6055},{"class":211,"line":2619},[6056],{"type":21,"tag":209,"props":6057,"children":6058},{"emptyLinePlaceholder":248},[6059],{"type":26,"value":251},{"type":21,"tag":209,"props":6061,"children":6062},{"class":211,"line":2627},[6063],{"type":21,"tag":209,"props":6064,"children":6065},{"style":448},[6066],{"type":26,"value":6067},"            // Calling resume() on a stack initiated by user gesture is\n",{"type":21,"tag":209,"props":6069,"children":6070},{"class":211,"line":2636},[6071],{"type":21,"tag":209,"props":6072,"children":6073},{"style":448},[6074],{"type":26,"value":6075},"            // what actually unlocks the audio on Chrome >= 55.\n",{"type":21,"tag":209,"props":6077,"children":6078},{"class":211,"line":2644},[6079,6084,6088,6093,6098,6103,6108],{"type":21,"tag":209,"props":6080,"children":6081},{"style":216},[6082],{"type":26,"value":6083},"            if",{"type":21,"tag":209,"props":6085,"children":6086},{"style":222},[6087],{"type":26,"value":4776},{"type":21,"tag":209,"props":6089,"children":6090},{"style":216},[6091],{"type":26,"value":6092},"typeof",{"type":21,"tag":209,"props":6094,"children":6095},{"style":222},[6096],{"type":26,"value":6097}," _audioCtx.resume ",{"type":21,"tag":209,"props":6099,"children":6100},{"style":216},[6101],{"type":26,"value":6102},"===",{"type":21,"tag":209,"props":6104,"children":6105},{"style":233},[6106],{"type":26,"value":6107}," 'function'",{"type":21,"tag":209,"props":6109,"children":6110},{"style":222},[6111],{"type":26,"value":4786},{"type":21,"tag":209,"props":6113,"children":6114},{"class":211,"line":2657},[6115,6120,6125],{"type":21,"tag":209,"props":6116,"children":6117},{"style":222},[6118],{"type":26,"value":6119},"                _audioCtx.",{"type":21,"tag":209,"props":6121,"children":6122},{"style":360},[6123],{"type":26,"value":6124},"resume",{"type":21,"tag":209,"props":6126,"children":6127},{"style":222},[6128],{"type":26,"value":4842},{"type":21,"tag":209,"props":6130,"children":6131},{"class":211,"line":2728},[6132],{"type":21,"tag":209,"props":6133,"children":6134},{"style":222},[6135],{"type":26,"value":6136},"            }\n",{"type":21,"tag":209,"props":6138,"children":6139},{"class":211,"line":2758},[6140],{"type":21,"tag":209,"props":6141,"children":6142},{"emptyLinePlaceholder":248},[6143],{"type":26,"value":251},{"type":21,"tag":209,"props":6145,"children":6146},{"class":211,"line":2776},[6147],{"type":21,"tag":209,"props":6148,"children":6149},{"style":448},[6150],{"type":26,"value":6151},"            // Once the source has fired the onended event, indicating it did indeed play,\n",{"type":21,"tag":209,"props":6153,"children":6154},{"class":211,"line":2785},[6155],{"type":21,"tag":209,"props":6156,"children":6157},{"style":448},[6158],{"type":26,"value":6159},"            // we can know that the audio API is now unlocked.\n",{"type":21,"tag":209,"props":6161,"children":6162},{"class":211,"line":2793},[6163,6167,6172,6176,6180],{"type":21,"tag":209,"props":6164,"children":6165},{"style":222},[6166],{"type":26,"value":6005},{"type":21,"tag":209,"props":6168,"children":6169},{"style":360},[6170],{"type":26,"value":6171},"onended",{"type":21,"tag":209,"props":6173,"children":6174},{"style":216},[6175],{"type":26,"value":271},{"type":21,"tag":209,"props":6177,"children":6178},{"style":216},[6179],{"type":26,"value":4766},{"type":21,"tag":209,"props":6181,"children":6182},{"style":222},[6183],{"type":26,"value":6184}," () {\n",{"type":21,"tag":209,"props":6186,"children":6187},{"class":211,"line":2801},[6188,6193,6198,6202,6206],{"type":21,"tag":209,"props":6189,"children":6190},{"style":222},[6191],{"type":26,"value":6192},"                source.",{"type":21,"tag":209,"props":6194,"children":6195},{"style":360},[6196],{"type":26,"value":6197},"disconnect",{"type":21,"tag":209,"props":6199,"children":6200},{"style":222},[6201],{"type":26,"value":368},{"type":21,"tag":209,"props":6203,"children":6204},{"style":263},[6205],{"type":26,"value":6048},{"type":21,"tag":209,"props":6207,"children":6208},{"style":222},[6209],{"type":26,"value":2608},{"type":21,"tag":209,"props":6211,"children":6212},{"class":211,"line":2809},[6213],{"type":21,"tag":209,"props":6214,"children":6215},{"emptyLinePlaceholder":248},[6216],{"type":26,"value":251},{"type":21,"tag":209,"props":6218,"children":6220},{"class":211,"line":6219},57,[6221],{"type":21,"tag":209,"props":6222,"children":6223},{"style":448},[6224],{"type":26,"value":6225},"                // Don't bother trying to unlock the API more than once!\n",{"type":21,"tag":209,"props":6227,"children":6229},{"class":211,"line":6228},58,[6230,6235,6239,6244],{"type":21,"tag":209,"props":6231,"children":6232},{"style":222},[6233],{"type":26,"value":6234},"                _isUnlocked ",{"type":21,"tag":209,"props":6236,"children":6237},{"style":216},[6238],{"type":26,"value":1432},{"type":21,"tag":209,"props":6240,"children":6241},{"style":263},[6242],{"type":26,"value":6243}," true",{"type":21,"tag":209,"props":6245,"children":6246},{"style":222},[6247],{"type":26,"value":241},{"type":21,"tag":209,"props":6249,"children":6251},{"class":211,"line":6250},59,[6252],{"type":21,"tag":209,"props":6253,"children":6254},{"emptyLinePlaceholder":248},[6255],{"type":26,"value":251},{"type":21,"tag":209,"props":6257,"children":6259},{"class":211,"line":6258},60,[6260],{"type":21,"tag":209,"props":6261,"children":6262},{"style":448},[6263],{"type":26,"value":6264},"                // Remove the click/touch listeners.\n",{"type":21,"tag":209,"props":6266,"children":6268},{"class":211,"line":6267},61,[6269,6274,6279,6283,6288,6293,6297],{"type":21,"tag":209,"props":6270,"children":6271},{"style":222},[6272],{"type":26,"value":6273},"                document.",{"type":21,"tag":209,"props":6275,"children":6276},{"style":360},[6277],{"type":26,"value":6278},"removeEventListener",{"type":21,"tag":209,"props":6280,"children":6281},{"style":222},[6282],{"type":26,"value":368},{"type":21,"tag":209,"props":6284,"children":6285},{"style":233},[6286],{"type":26,"value":6287},"'touchstart'",{"type":21,"tag":209,"props":6289,"children":6290},{"style":222},[6291],{"type":26,"value":6292},", unlock, ",{"type":21,"tag":209,"props":6294,"children":6295},{"style":263},[6296],{"type":26,"value":2223},{"type":21,"tag":209,"props":6298,"children":6299},{"style":222},[6300],{"type":26,"value":2608},{"type":21,"tag":209,"props":6302,"children":6304},{"class":211,"line":6303},62,[6305,6309,6313,6317,6322,6326,6330],{"type":21,"tag":209,"props":6306,"children":6307},{"style":222},[6308],{"type":26,"value":6273},{"type":21,"tag":209,"props":6310,"children":6311},{"style":360},[6312],{"type":26,"value":6278},{"type":21,"tag":209,"props":6314,"children":6315},{"style":222},[6316],{"type":26,"value":368},{"type":21,"tag":209,"props":6318,"children":6319},{"style":233},[6320],{"type":26,"value":6321},"'touchend'",{"type":21,"tag":209,"props":6323,"children":6324},{"style":222},[6325],{"type":26,"value":6292},{"type":21,"tag":209,"props":6327,"children":6328},{"style":263},[6329],{"type":26,"value":2223},{"type":21,"tag":209,"props":6331,"children":6332},{"style":222},[6333],{"type":26,"value":2608},{"type":21,"tag":209,"props":6335,"children":6337},{"class":211,"line":6336},63,[6338,6342,6346,6350,6355,6359,6363],{"type":21,"tag":209,"props":6339,"children":6340},{"style":222},[6341],{"type":26,"value":6273},{"type":21,"tag":209,"props":6343,"children":6344},{"style":360},[6345],{"type":26,"value":6278},{"type":21,"tag":209,"props":6347,"children":6348},{"style":222},[6349],{"type":26,"value":368},{"type":21,"tag":209,"props":6351,"children":6352},{"style":233},[6353],{"type":26,"value":6354},"'click'",{"type":21,"tag":209,"props":6356,"children":6357},{"style":222},[6358],{"type":26,"value":6292},{"type":21,"tag":209,"props":6360,"children":6361},{"style":263},[6362],{"type":26,"value":2223},{"type":21,"tag":209,"props":6364,"children":6365},{"style":222},[6366],{"type":26,"value":2608},{"type":21,"tag":209,"props":6368,"children":6370},{"class":211,"line":6369},64,[6371],{"type":21,"tag":209,"props":6372,"children":6373},{"style":222},[6374],{"type":26,"value":6375},"            };\n",{"type":21,"tag":209,"props":6377,"children":6379},{"class":211,"line":6378},65,[6380],{"type":21,"tag":209,"props":6381,"children":6382},{"style":222},[6383],{"type":26,"value":6384},"        };\n",{"type":21,"tag":209,"props":6386,"children":6388},{"class":211,"line":6387},66,[6389],{"type":21,"tag":209,"props":6390,"children":6391},{"emptyLinePlaceholder":248},[6392],{"type":26,"value":251},{"type":21,"tag":209,"props":6394,"children":6396},{"class":211,"line":6395},67,[6397],{"type":21,"tag":209,"props":6398,"children":6399},{"style":448},[6400],{"type":26,"value":6401},"        // Setup click/touch listeners to capture the first interaction\n",{"type":21,"tag":209,"props":6403,"children":6405},{"class":211,"line":6404},68,[6406],{"type":21,"tag":209,"props":6407,"children":6408},{"style":448},[6409],{"type":26,"value":6410},"        // within this context.\n",{"type":21,"tag":209,"props":6412,"children":6414},{"class":211,"line":6413},69,[6415,6420,6425,6429,6433,6437,6441],{"type":21,"tag":209,"props":6416,"children":6417},{"style":222},[6418],{"type":26,"value":6419},"        document.",{"type":21,"tag":209,"props":6421,"children":6422},{"style":360},[6423],{"type":26,"value":6424},"addEventListener",{"type":21,"tag":209,"props":6426,"children":6427},{"style":222},[6428],{"type":26,"value":368},{"type":21,"tag":209,"props":6430,"children":6431},{"style":233},[6432],{"type":26,"value":6287},{"type":21,"tag":209,"props":6434,"children":6435},{"style":222},[6436],{"type":26,"value":6292},{"type":21,"tag":209,"props":6438,"children":6439},{"style":263},[6440],{"type":26,"value":2223},{"type":21,"tag":209,"props":6442,"children":6443},{"style":222},[6444],{"type":26,"value":2608},{"type":21,"tag":209,"props":6446,"children":6448},{"class":211,"line":6447},70,[6449,6453,6457,6461,6465,6469,6473],{"type":21,"tag":209,"props":6450,"children":6451},{"style":222},[6452],{"type":26,"value":6419},{"type":21,"tag":209,"props":6454,"children":6455},{"style":360},[6456],{"type":26,"value":6424},{"type":21,"tag":209,"props":6458,"children":6459},{"style":222},[6460],{"type":26,"value":368},{"type":21,"tag":209,"props":6462,"children":6463},{"style":233},[6464],{"type":26,"value":6321},{"type":21,"tag":209,"props":6466,"children":6467},{"style":222},[6468],{"type":26,"value":6292},{"type":21,"tag":209,"props":6470,"children":6471},{"style":263},[6472],{"type":26,"value":2223},{"type":21,"tag":209,"props":6474,"children":6475},{"style":222},[6476],{"type":26,"value":2608},{"type":21,"tag":209,"props":6478,"children":6480},{"class":211,"line":6479},71,[6481,6485,6489,6493,6497,6501,6505],{"type":21,"tag":209,"props":6482,"children":6483},{"style":222},[6484],{"type":26,"value":6419},{"type":21,"tag":209,"props":6486,"children":6487},{"style":360},[6488],{"type":26,"value":6424},{"type":21,"tag":209,"props":6490,"children":6491},{"style":222},[6492],{"type":26,"value":368},{"type":21,"tag":209,"props":6494,"children":6495},{"style":233},[6496],{"type":26,"value":6354},{"type":21,"tag":209,"props":6498,"children":6499},{"style":222},[6500],{"type":26,"value":6292},{"type":21,"tag":209,"props":6502,"children":6503},{"style":263},[6504],{"type":26,"value":2223},{"type":21,"tag":209,"props":6506,"children":6507},{"style":222},[6508],{"type":26,"value":2608},{"type":21,"tag":209,"props":6510,"children":6512},{"class":211,"line":6511},72,[6513],{"type":21,"tag":209,"props":6514,"children":6515},{"style":222},[6516],{"type":26,"value":331},{"type":21,"tag":209,"props":6518,"children":6520},{"class":211,"line":6519},73,[6521],{"type":21,"tag":209,"props":6522,"children":6523},{"emptyLinePlaceholder":248},[6524],{"type":26,"value":251},{"type":21,"tag":209,"props":6526,"children":6528},{"class":211,"line":6527},74,[6529],{"type":21,"tag":209,"props":6530,"children":6531},{"style":448},[6532],{"type":26,"value":4697},{"type":21,"tag":209,"props":6534,"children":6536},{"class":211,"line":6535},75,[6537],{"type":21,"tag":209,"props":6538,"children":6539},{"style":448},[6540],{"type":26,"value":4705},{"type":21,"tag":209,"props":6542,"children":6544},{"class":211,"line":6543},76,[6545],{"type":21,"tag":209,"props":6546,"children":6547},{"style":448},[6548],{"type":26,"value":6549},"     * We store the decoded audio data for future (re-)use.\n",{"type":21,"tag":209,"props":6551,"children":6553},{"class":211,"line":6552},77,[6554,6558,6562,6566],{"type":21,"tag":209,"props":6555,"children":6556},{"style":448},[6557],{"type":26,"value":4713},{"type":21,"tag":209,"props":6559,"children":6560},{"style":216},[6561],{"type":26,"value":4718},{"type":21,"tag":209,"props":6563,"children":6564},{"style":360},[6565],{"type":26,"value":4723},{"type":21,"tag":209,"props":6567,"children":6568},{"style":222},[6569],{"type":26,"value":4728},{"type":21,"tag":209,"props":6571,"children":6573},{"class":211,"line":6572},78,[6574,6578,6582],{"type":21,"tag":209,"props":6575,"children":6576},{"style":448},[6577],{"type":26,"value":4713},{"type":21,"tag":209,"props":6579,"children":6580},{"style":216},[6581],{"type":26,"value":4740},{"type":21,"tag":209,"props":6583,"children":6584},{"style":360},[6585],{"type":26,"value":6586}," {Promise\u003CAudioBuffer>}\n",{"type":21,"tag":209,"props":6588,"children":6590},{"class":211,"line":6589},79,[6591],{"type":21,"tag":209,"props":6592,"children":6593},{"style":448},[6594],{"type":26,"value":4753},{"type":21,"tag":209,"props":6596,"children":6598},{"class":211,"line":6597},80,[6599,6603,6607,6611,6615,6619],{"type":21,"tag":209,"props":6600,"children":6601},{"style":216},[6602],{"type":26,"value":4761},{"type":21,"tag":209,"props":6604,"children":6605},{"style":216},[6606],{"type":26,"value":4766},{"type":21,"tag":209,"props":6608,"children":6609},{"style":360},[6610],{"type":26,"value":4771},{"type":21,"tag":209,"props":6612,"children":6613},{"style":222},[6614],{"type":26,"value":4776},{"type":21,"tag":209,"props":6616,"children":6617},{"style":400},[6618],{"type":26,"value":4781},{"type":21,"tag":209,"props":6620,"children":6621},{"style":222},[6622],{"type":26,"value":4786},{"type":21,"tag":209,"props":6624,"children":6626},{"class":211,"line":6625},81,[6627,6631,6636,6641],{"type":21,"tag":209,"props":6628,"children":6629},{"style":216},[6630],{"type":26,"value":5803},{"type":21,"tag":209,"props":6632,"children":6633},{"style":222},[6634],{"type":26,"value":6635}," (_af_buffers.",{"type":21,"tag":209,"props":6637,"children":6638},{"style":360},[6639],{"type":26,"value":6640},"has",{"type":21,"tag":209,"props":6642,"children":6643},{"style":222},[6644],{"type":26,"value":6645},"(sfxFile)) {\n",{"type":21,"tag":209,"props":6647,"children":6649},{"class":211,"line":6648},82,[6650,6654,6659,6664],{"type":21,"tag":209,"props":6651,"children":6652},{"style":216},[6653],{"type":26,"value":5101},{"type":21,"tag":209,"props":6655,"children":6656},{"style":222},[6657],{"type":26,"value":6658}," _af_buffers.",{"type":21,"tag":209,"props":6660,"children":6661},{"style":360},[6662],{"type":26,"value":6663},"get",{"type":21,"tag":209,"props":6665,"children":6666},{"style":222},[6667],{"type":26,"value":4816},{"type":21,"tag":209,"props":6669,"children":6671},{"class":211,"line":6670},83,[6672],{"type":21,"tag":209,"props":6673,"children":6674},{"style":222},[6675],{"type":26,"value":2235},{"type":21,"tag":209,"props":6677,"children":6679},{"class":211,"line":6678},84,[6680],{"type":21,"tag":209,"props":6681,"children":6682},{"emptyLinePlaceholder":248},[6683],{"type":26,"value":251},{"type":21,"tag":209,"props":6685,"children":6687},{"class":211,"line":6686},85,[6688,6692,6696,6700,6704,6708],{"type":21,"tag":209,"props":6689,"children":6690},{"style":216},[6691],{"type":26,"value":3332},{"type":21,"tag":209,"props":6693,"children":6694},{"style":263},[6695],{"type":26,"value":4798},{"type":21,"tag":209,"props":6697,"children":6698},{"style":216},[6699],{"type":26,"value":271},{"type":21,"tag":209,"props":6701,"children":6702},{"style":216},[6703],{"type":26,"value":1437},{"type":21,"tag":209,"props":6705,"children":6706},{"style":360},[6707],{"type":26,"value":4811},{"type":21,"tag":209,"props":6709,"children":6710},{"style":222},[6711],{"type":26,"value":4816},{"type":21,"tag":209,"props":6713,"children":6715},{"class":211,"line":6714},86,[6716,6720,6725,6729,6733,6737,6741],{"type":21,"tag":209,"props":6717,"children":6718},{"style":216},[6719],{"type":26,"value":3332},{"type":21,"tag":209,"props":6721,"children":6722},{"style":263},[6723],{"type":26,"value":6724}," arraybuffer",{"type":21,"tag":209,"props":6726,"children":6727},{"style":216},[6728],{"type":26,"value":271},{"type":21,"tag":209,"props":6730,"children":6731},{"style":216},[6732],{"type":26,"value":1437},{"type":21,"tag":209,"props":6734,"children":6735},{"style":222},[6736],{"type":26,"value":4832},{"type":21,"tag":209,"props":6738,"children":6739},{"style":360},[6740],{"type":26,"value":4837},{"type":21,"tag":209,"props":6742,"children":6743},{"style":222},[6744],{"type":26,"value":4842},{"type":21,"tag":209,"props":6746,"children":6748},{"class":211,"line":6747},87,[6749,6754],{"type":21,"tag":209,"props":6750,"children":6751},{"style":216},[6752],{"type":26,"value":6753},"        let",{"type":21,"tag":209,"props":6755,"children":6756},{"style":222},[6757],{"type":26,"value":6758}," audiobuffer;\n",{"type":21,"tag":209,"props":6760,"children":6762},{"class":211,"line":6761},88,[6763],{"type":21,"tag":209,"props":6764,"children":6765},{"emptyLinePlaceholder":248},[6766],{"type":26,"value":251},{"type":21,"tag":209,"props":6768,"children":6770},{"class":211,"line":6769},89,[6771,6776],{"type":21,"tag":209,"props":6772,"children":6773},{"style":216},[6774],{"type":26,"value":6775},"        try",{"type":21,"tag":209,"props":6777,"children":6778},{"style":222},[6779],{"type":26,"value":276},{"type":21,"tag":209,"props":6781,"children":6783},{"class":211,"line":6782},90,[6784,6789,6793,6797,6801,6805],{"type":21,"tag":209,"props":6785,"children":6786},{"style":222},[6787],{"type":26,"value":6788},"            audiobuffer ",{"type":21,"tag":209,"props":6790,"children":6791},{"style":216},[6792],{"type":26,"value":1432},{"type":21,"tag":209,"props":6794,"children":6795},{"style":216},[6796],{"type":26,"value":1437},{"type":21,"tag":209,"props":6798,"children":6799},{"style":222},[6800],{"type":26,"value":4996},{"type":21,"tag":209,"props":6802,"children":6803},{"style":360},[6804],{"type":26,"value":5001},{"type":21,"tag":209,"props":6806,"children":6807},{"style":222},[6808],{"type":26,"value":6809},"(arraybuffer);\n",{"type":21,"tag":209,"props":6811,"children":6813},{"class":211,"line":6812},91,[6814,6819,6824],{"type":21,"tag":209,"props":6815,"children":6816},{"style":222},[6817],{"type":26,"value":6818},"        } ",{"type":21,"tag":209,"props":6820,"children":6821},{"style":216},[6822],{"type":26,"value":6823},"catch",{"type":21,"tag":209,"props":6825,"children":6826},{"style":222},[6827],{"type":26,"value":6828}," (e) {\n",{"type":21,"tag":209,"props":6830,"children":6832},{"class":211,"line":6831},92,[6833],{"type":21,"tag":209,"props":6834,"children":6835},{"style":448},[6836],{"type":26,"value":6837},"            // Browser wants older callback based usage of decodeAudioData\n",{"type":21,"tag":209,"props":6839,"children":6841},{"class":211,"line":6840},93,[6842,6846,6850,6854,6858],{"type":21,"tag":209,"props":6843,"children":6844},{"style":222},[6845],{"type":26,"value":6788},{"type":21,"tag":209,"props":6847,"children":6848},{"style":216},[6849],{"type":26,"value":1432},{"type":21,"tag":209,"props":6851,"children":6852},{"style":216},[6853],{"type":26,"value":1437},{"type":21,"tag":209,"props":6855,"children":6856},{"style":360},[6857],{"type":26,"value":5552},{"type":21,"tag":209,"props":6859,"children":6860},{"style":222},[6861],{"type":26,"value":6809},{"type":21,"tag":209,"props":6863,"children":6865},{"class":211,"line":6864},94,[6866],{"type":21,"tag":209,"props":6867,"children":6868},{"style":222},[6869],{"type":26,"value":2235},{"type":21,"tag":209,"props":6871,"children":6873},{"class":211,"line":6872},95,[6874],{"type":21,"tag":209,"props":6875,"children":6876},{"emptyLinePlaceholder":248},[6877],{"type":26,"value":251},{"type":21,"tag":209,"props":6879,"children":6881},{"class":211,"line":6880},96,[6882,6887,6892],{"type":21,"tag":209,"props":6883,"children":6884},{"style":222},[6885],{"type":26,"value":6886},"        _af_buffers.",{"type":21,"tag":209,"props":6888,"children":6889},{"style":360},[6890],{"type":26,"value":6891},"set",{"type":21,"tag":209,"props":6893,"children":6894},{"style":222},[6895],{"type":26,"value":6896},"(sfxFile, audiobuffer);\n",{"type":21,"tag":209,"props":6898,"children":6900},{"class":211,"line":6899},97,[6901],{"type":21,"tag":209,"props":6902,"children":6903},{"emptyLinePlaceholder":248},[6904],{"type":26,"value":251},{"type":21,"tag":209,"props":6906,"children":6908},{"class":211,"line":6907},98,[6909,6913],{"type":21,"tag":209,"props":6910,"children":6911},{"style":216},[6912],{"type":26,"value":3069},{"type":21,"tag":209,"props":6914,"children":6915},{"style":222},[6916],{"type":26,"value":6758},{"type":21,"tag":209,"props":6918,"children":6920},{"class":211,"line":6919},99,[6921],{"type":21,"tag":209,"props":6922,"children":6923},{"style":222},[6924],{"type":26,"value":4850},{"type":21,"tag":209,"props":6926,"children":6928},{"class":211,"line":6927},100,[6929],{"type":21,"tag":209,"props":6930,"children":6931},{"emptyLinePlaceholder":248},[6932],{"type":26,"value":251},{"type":21,"tag":209,"props":6934,"children":6936},{"class":211,"line":6935},101,[6937],{"type":21,"tag":209,"props":6938,"children":6939},{"style":448},[6940],{"type":26,"value":4697},{"type":21,"tag":209,"props":6942,"children":6944},{"class":211,"line":6943},102,[6945],{"type":21,"tag":209,"props":6946,"children":6947},{"style":448},[6948],{"type":26,"value":6949},"     * Play the specified file, loading it first - either retrieving it from the saved buffers, or fetching\n",{"type":21,"tag":209,"props":6951,"children":6953},{"class":211,"line":6952},103,[6954],{"type":21,"tag":209,"props":6955,"children":6956},{"style":448},[6957],{"type":26,"value":6958},"     * it from the network.\n",{"type":21,"tag":209,"props":6960,"children":6962},{"class":211,"line":6961},104,[6963,6967,6971],{"type":21,"tag":209,"props":6964,"children":6965},{"style":448},[6966],{"type":26,"value":4713},{"type":21,"tag":209,"props":6968,"children":6969},{"style":216},[6970],{"type":26,"value":4718},{"type":21,"tag":209,"props":6972,"children":6973},{"style":222},[6974],{"type":26,"value":4728},{"type":21,"tag":209,"props":6976,"children":6978},{"class":211,"line":6977},105,[6979,6983,6987],{"type":21,"tag":209,"props":6980,"children":6981},{"style":448},[6982],{"type":26,"value":4713},{"type":21,"tag":209,"props":6984,"children":6985},{"style":216},[6986],{"type":26,"value":4740},{"type":21,"tag":209,"props":6988,"children":6989},{"style":360},[6990],{"type":26,"value":4903},{"type":21,"tag":209,"props":6992,"children":6994},{"class":211,"line":6993},106,[6995],{"type":21,"tag":209,"props":6996,"children":6997},{"style":448},[6998],{"type":26,"value":4753},{"type":21,"tag":209,"props":7000,"children":7002},{"class":211,"line":7001},107,[7003,7007,7011,7015,7019],{"type":21,"tag":209,"props":7004,"children":7005},{"style":216},[7006],{"type":26,"value":2981},{"type":21,"tag":209,"props":7008,"children":7009},{"style":360},[7010],{"type":26,"value":4922},{"type":21,"tag":209,"props":7012,"children":7013},{"style":222},[7014],{"type":26,"value":4776},{"type":21,"tag":209,"props":7016,"children":7017},{"style":400},[7018],{"type":26,"value":4781},{"type":21,"tag":209,"props":7020,"children":7021},{"style":222},[7022],{"type":26,"value":4786},{"type":21,"tag":209,"props":7024,"children":7026},{"class":211,"line":7025},108,[7027,7031,7035,7039,7043,7047,7052,7056,7060],{"type":21,"tag":209,"props":7028,"children":7029},{"style":216},[7030],{"type":26,"value":3069},{"type":21,"tag":209,"props":7032,"children":7033},{"style":360},[7034],{"type":26,"value":4771},{"type":21,"tag":209,"props":7036,"children":7037},{"style":222},[7038],{"type":26,"value":4950},{"type":21,"tag":209,"props":7040,"children":7041},{"style":360},[7042],{"type":26,"value":2704},{"type":21,"tag":209,"props":7044,"children":7045},{"style":222},[7046],{"type":26,"value":2709},{"type":21,"tag":209,"props":7048,"children":7049},{"style":400},[7050],{"type":26,"value":7051},"audioBuffer",{"type":21,"tag":209,"props":7053,"children":7054},{"style":222},[7055],{"type":26,"value":432},{"type":21,"tag":209,"props":7057,"children":7058},{"style":216},[7059],{"type":26,"value":437},{"type":21,"tag":209,"props":7061,"children":7062},{"style":222},[7063],{"type":26,"value":276},{"type":21,"tag":209,"props":7065,"children":7067},{"class":211,"line":7066},109,[7068,7072,7076,7080,7084,7088],{"type":21,"tag":209,"props":7069,"children":7070},{"style":216},[7071],{"type":26,"value":4982},{"type":21,"tag":209,"props":7073,"children":7074},{"style":263},[7075],{"type":26,"value":5018},{"type":21,"tag":209,"props":7077,"children":7078},{"style":216},[7079],{"type":26,"value":271},{"type":21,"tag":209,"props":7081,"children":7082},{"style":222},[7083],{"type":26,"value":4996},{"type":21,"tag":209,"props":7085,"children":7086},{"style":360},[7087],{"type":26,"value":5031},{"type":21,"tag":209,"props":7089,"children":7090},{"style":222},[7091],{"type":26,"value":4842},{"type":21,"tag":209,"props":7093,"children":7095},{"class":211,"line":7094},110,[7096,7100,7104],{"type":21,"tag":209,"props":7097,"children":7098},{"style":222},[7099],{"type":26,"value":5043},{"type":21,"tag":209,"props":7101,"children":7102},{"style":216},[7103],{"type":26,"value":1432},{"type":21,"tag":209,"props":7105,"children":7106},{"style":222},[7107],{"type":26,"value":5052},{"type":21,"tag":209,"props":7109,"children":7111},{"class":211,"line":7110},111,[7112,7116,7120],{"type":21,"tag":209,"props":7113,"children":7114},{"style":222},[7115],{"type":26,"value":5060},{"type":21,"tag":209,"props":7117,"children":7118},{"style":360},[7119],{"type":26,"value":5065},{"type":21,"tag":209,"props":7121,"children":7122},{"style":222},[7123],{"type":26,"value":5070},{"type":21,"tag":209,"props":7125,"children":7127},{"class":211,"line":7126},112,[7128,7132,7136],{"type":21,"tag":209,"props":7129,"children":7130},{"style":222},[7131],{"type":26,"value":5060},{"type":21,"tag":209,"props":7133,"children":7134},{"style":360},[7135],{"type":26,"value":5082},{"type":21,"tag":209,"props":7137,"children":7138},{"style":222},[7139],{"type":26,"value":4842},{"type":21,"tag":209,"props":7141,"children":7143},{"class":211,"line":7142},113,[7144],{"type":21,"tag":209,"props":7145,"children":7146},{"emptyLinePlaceholder":248},[7147],{"type":26,"value":251},{"type":21,"tag":209,"props":7149,"children":7151},{"class":211,"line":7150},114,[7152,7156],{"type":21,"tag":209,"props":7153,"children":7154},{"style":216},[7155],{"type":26,"value":5101},{"type":21,"tag":209,"props":7157,"children":7158},{"style":222},[7159],{"type":26,"value":5106},{"type":21,"tag":209,"props":7161,"children":7163},{"class":211,"line":7162},115,[7164],{"type":21,"tag":209,"props":7165,"children":7166},{"style":222},[7167],{"type":26,"value":5114},{"type":21,"tag":209,"props":7169,"children":7171},{"class":211,"line":7170},116,[7172],{"type":21,"tag":209,"props":7173,"children":7174},{"style":222},[7175],{"type":26,"value":4850},{"type":21,"tag":209,"props":7177,"children":7179},{"class":211,"line":7178},117,[7180],{"type":21,"tag":209,"props":7181,"children":7182},{"emptyLinePlaceholder":248},[7183],{"type":26,"value":251},{"type":21,"tag":209,"props":7185,"children":7187},{"class":211,"line":7186},118,[7188,7193],{"type":21,"tag":209,"props":7189,"children":7190},{"style":360},[7191],{"type":26,"value":7192},"    _unlockAudio",{"type":21,"tag":209,"props":7194,"children":7195},{"style":222},[7196],{"type":26,"value":4842},{"type":21,"tag":209,"props":7198,"children":7200},{"class":211,"line":7199},119,[7201],{"type":21,"tag":209,"props":7202,"children":7203},{"style":222},[7204],{"type":26,"value":7205},"}());\n",{"type":21,"tag":22,"props":7207,"children":7208},{},[7209,7211,7216,7218,7223],{"type":26,"value":7210},"That's the ticket! Now, when we load our ",{"type":21,"tag":63,"props":7212,"children":7214},{"className":7213},[],[7215],{"type":26,"value":4609},{"type":26,"value":7217}," by calling ",{"type":21,"tag":63,"props":7219,"children":7221},{"className":7220},[],[7222],{"type":26,"value":5224},{"type":26,"value":7224},", we attempt to fetch the audiobuffer from our impromptu cache if possible, or fallback to fetching it. (Note that it's important we cache the decoded audiobuffer, rather than the fetched array buffer—decoding is expensive! However, if we're planning to fetch large compressed files, these will be decoded into PCM and potentially eat up a huge chunk of memory - keep an eye on the tradeoff!)",{"type":21,"tag":22,"props":7226,"children":7227},{},[7228,7229,7234],{"type":26,"value":1604},{"type":21,"tag":63,"props":7230,"children":7232},{"className":7231},[],[7233],{"type":26,"value":5190},{"type":26,"value":7235},", we also perform the decoding, falling back to a decode shim if the browser throws an error (as it does in iOS), due to out-of-date API implementation.",{"type":21,"tag":22,"props":7237,"children":7238},{},[7239,7241,7246],{"type":26,"value":7240},"Otherwise, ",{"type":21,"tag":63,"props":7242,"children":7244},{"className":7243},[],[7245],{"type":26,"value":5224},{"type":26,"value":7247}," looks pretty much the same.",{"type":21,"tag":22,"props":7249,"children":7250},{},[7251,7253,7259],{"type":26,"value":7252},"And finally, we've wrapped all of this in an IIFE, with ",{"type":21,"tag":63,"props":7254,"children":7256},{"className":7255},[],[7257],{"type":26,"value":7258},"_unlockAudio",{"type":26,"value":7260}," getting called as soon as the IIFE is executed, adding touch/click listeners to the document so we can unlock the audio API as soon as the user has indicated they're willing to interact with our site.",{"type":21,"tag":22,"props":7262,"children":7263},{},[7264,7266,7273,7275,7282],{"type":26,"value":7265},"Phew! That's a fair amount of work to play a single file! Depending on the needs of your project, you may want to explore some of the libraries that can handle some of the grunt work for you, like ",{"type":21,"tag":29,"props":7267,"children":7270},{"href":7268,"rel":7269},"https://howlerjs.com/",[93],[7271],{"type":26,"value":7272},"Howler.js",{"type":26,"value":7274}," and ",{"type":21,"tag":29,"props":7276,"children":7279},{"href":7277,"rel":7278},"https://createjs.com/soundjs",[93],[7280],{"type":26,"value":7281},"SoundJS",{"type":26,"value":7283},". There's no magic, though, and you may need to dive into the true depths for your use case.",{"type":21,"tag":22,"props":7285,"children":7286},{},[7287],{"type":26,"value":7288},"The Meowsic machine project is on its way - next time, we prepare to begin working on the UI with Vue.js.",{"type":21,"tag":22,"props":7290,"children":7291},{},[7292],{"type":21,"tag":1084,"props":7293,"children":7294},{},[7295,7297,7304,7305],{"type":26,"value":7296},"Images from Wikipedia Commons: ",{"type":21,"tag":29,"props":7298,"children":7301},{"href":7299,"rel":7300},"https://upload.wikimedia.org/wikipedia/commons/thumb/f/f0/Compactcassette.jpg/800px-Compactcassette.jpg",[93],[7302],{"type":26,"value":7303},"cassette",{"type":26,"value":408},{"type":21,"tag":29,"props":7306,"children":7309},{"href":7307,"rel":7308},"https://commons.wikimedia.org/wiki/Category:Padlocks",[93],[7310],{"type":26,"value":7311},"padlock",{"type":21,"tag":3490,"props":7313,"children":7314},{},[7315],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":7317},[7318,7320,7321,7322],{"id":4521,"depth":254,"text":7319},"PeriodicWave... Isn't that something the crowd does at a sports game?",{"id":4558,"depth":254,"text":4561},{"id":5303,"depth":254,"text":5306},{"id":5343,"depth":254,"text":5346},"content:ckeefer:2019-1:UnlockingWebAudio.md","ckeefer/2019-1/UnlockingWebAudio.md","ckeefer/2019-1/UnlockingWebAudio",{"user":3518,"name":3519},{"_path":7328,"_dir":7329,"_draft":7,"_partial":7,"_locale":8,"title":7330,"description":7331,"excerpt":7331,"tags":7332,"publishDate":7336,"body":7337,"_type":3511,"_id":8795,"_source":3513,"_file":8796,"_stem":8797,"_extension":3516,"author":8798},"/ckeefer/2017-3/morepwatoya-part2","2017-3","More PWA to Ya! (Progressive Web Apps, Part 2)","Last time, we got into the nitty gritty on how to make your web application into a Progressive Web Application (PWA to it's friends). I promised we'd dig even deeper this time, and show you how to make your web app a little more 'native' on Android - and how to deal with iOS Safari's special snowflake syndrome.",[7333,7334,7335],"mobile","pwa","series","2017-03-01",{"type":18,"children":7338,"toc":8789},[7339,7350,7356,7370,7393,7398,7799,7804,7837,7848,7859,7870,7881,7899,7919,7932,7945,8006,8011,8016,8022,8027,8032,8046,8068,8658,8672,8701,8714,8720,8725,8739,8762,8768,8780,8785],{"type":21,"tag":22,"props":7340,"children":7341},{},[7342,7348],{"type":21,"tag":29,"props":7343,"children":7345},{"href":7344},"/search/user:ckeefer/more/pwa",[7346],{"type":26,"value":7347},"Last time",{"type":26,"value":7349},", we got into the nitty gritty on how to make your web application into a Progressive Web Application (PWA to it's friends). I promised we'd dig even deeper this time, and show you how to make your web app a little more 'native' on Android - and how to deal with iOS Safari's special snowflake syndrome.",{"type":21,"tag":3549,"props":7351,"children":7353},{"id":7352},"manifestly-so",[7354],{"type":26,"value":7355},"Manifestly So",{"type":21,"tag":22,"props":7357,"children":7358},{},[7359,7361,7368],{"type":26,"value":7360},"The key to gaining first-class citizen status on Android for our PWA is the ",{"type":21,"tag":29,"props":7362,"children":7365},{"href":7363,"rel":7364},"https://developer.mozilla.org/en-US/docs/Web/Manifest",[93],[7366],{"type":26,"value":7367},"Manifest",{"type":26,"value":7369},". This allows us to declare certain details about our PWA, and how we'd like it to be handled by the browser. We won't go into all the possibilities - see the MDN link before for all of the details - but instead look at a few common scenarios, namely:",{"type":21,"tag":3739,"props":7371,"children":7372},{},[7373,7378,7383,7388],{"type":21,"tag":3681,"props":7374,"children":7375},{},[7376],{"type":26,"value":7377},"You want to specify a certain application name, and 'friendly' short form of that name for display in settings and on the home screen;",{"type":21,"tag":3681,"props":7379,"children":7380},{},[7381],{"type":26,"value":7382},"Your app can be installed to the Home Screen from the web app site, and will automatically prompt the user to do so;",{"type":21,"tag":3681,"props":7384,"children":7385},{},[7386],{"type":26,"value":7387},"You want to specify some values for things like background color, theme color, and icons, to control the way the app will look on the home screen, and how it will look when it's loading;",{"type":21,"tag":3681,"props":7389,"children":7390},{},[7391],{"type":26,"value":7392},"You want to lock the app into a certain display orientation.",{"type":21,"tag":22,"props":7394,"children":7395},{},[7396],{"type":26,"value":7397},"To that effect, here's an example Manifest, which we'll be dissecting momentarily:",{"type":21,"tag":200,"props":7399,"children":7403},{"className":7400,"code":7401,"language":7402,"meta":8,"style":8},"language-json shiki shiki-themes github-light github-dark","{\n    \"short_name\": \"App Name\",\n    \"name\": \"Long App Name for Settings Or Lock Screen\",\n    \"background_color\": \"#hexcode\",\n    \"theme_color\": \"#hexcode\",\n    \"display\": \"standalone\",\n    \"orientation\": \"portrait\",\n    \"icons\": [\n        {\n            \"src\": \"/static/img/icon180x180.png\",\n            \"type\": \"image/png\",\n            \"sizes\": \"180x180\"\n        },\n        {\n            \"src\": \"/static/img/icon192x192.png\",\n            \"type\": \"image/png\",\n            \"sizes\": \"192x192\"\n        },\n        {\n            \"src\": \"/static/img/icon512x512.png\",\n            \"type\": \"image/png\",\n            \"sizes\": \"512x512\"\n        }\n    ],\n    \"start_url\": \"/\"\n}\n","json",[7404],{"type":21,"tag":63,"props":7405,"children":7406},{"__ignoreMap":8},[7407,7415,7437,7458,7479,7499,7520,7541,7554,7562,7583,7604,7621,7628,7635,7655,7674,7690,7697,7704,7724,7743,7759,7766,7774,7791],{"type":21,"tag":209,"props":7408,"children":7409},{"class":211,"line":212},[7410],{"type":21,"tag":209,"props":7411,"children":7412},{"style":222},[7413],{"type":26,"value":7414},"{\n",{"type":21,"tag":209,"props":7416,"children":7417},{"class":211,"line":244},[7418,7423,7428,7433],{"type":21,"tag":209,"props":7419,"children":7420},{"style":263},[7421],{"type":26,"value":7422},"    \"short_name\"",{"type":21,"tag":209,"props":7424,"children":7425},{"style":222},[7426],{"type":26,"value":7427},": ",{"type":21,"tag":209,"props":7429,"children":7430},{"style":233},[7431],{"type":26,"value":7432},"\"App Name\"",{"type":21,"tag":209,"props":7434,"children":7435},{"style":222},[7436],{"type":26,"value":304},{"type":21,"tag":209,"props":7438,"children":7439},{"class":211,"line":254},[7440,7445,7449,7454],{"type":21,"tag":209,"props":7441,"children":7442},{"style":263},[7443],{"type":26,"value":7444},"    \"name\"",{"type":21,"tag":209,"props":7446,"children":7447},{"style":222},[7448],{"type":26,"value":7427},{"type":21,"tag":209,"props":7450,"children":7451},{"style":233},[7452],{"type":26,"value":7453},"\"Long App Name for Settings Or Lock Screen\"",{"type":21,"tag":209,"props":7455,"children":7456},{"style":222},[7457],{"type":26,"value":304},{"type":21,"tag":209,"props":7459,"children":7460},{"class":211,"line":279},[7461,7466,7470,7475],{"type":21,"tag":209,"props":7462,"children":7463},{"style":263},[7464],{"type":26,"value":7465},"    \"background_color\"",{"type":21,"tag":209,"props":7467,"children":7468},{"style":222},[7469],{"type":26,"value":7427},{"type":21,"tag":209,"props":7471,"children":7472},{"style":233},[7473],{"type":26,"value":7474},"\"#hexcode\"",{"type":21,"tag":209,"props":7476,"children":7477},{"style":222},[7478],{"type":26,"value":304},{"type":21,"tag":209,"props":7480,"children":7481},{"class":211,"line":288},[7482,7487,7491,7495],{"type":21,"tag":209,"props":7483,"children":7484},{"style":263},[7485],{"type":26,"value":7486},"    \"theme_color\"",{"type":21,"tag":209,"props":7488,"children":7489},{"style":222},[7490],{"type":26,"value":7427},{"type":21,"tag":209,"props":7492,"children":7493},{"style":233},[7494],{"type":26,"value":7474},{"type":21,"tag":209,"props":7496,"children":7497},{"style":222},[7498],{"type":26,"value":304},{"type":21,"tag":209,"props":7500,"children":7501},{"class":211,"line":307},[7502,7507,7511,7516],{"type":21,"tag":209,"props":7503,"children":7504},{"style":263},[7505],{"type":26,"value":7506},"    \"display\"",{"type":21,"tag":209,"props":7508,"children":7509},{"style":222},[7510],{"type":26,"value":7427},{"type":21,"tag":209,"props":7512,"children":7513},{"style":233},[7514],{"type":26,"value":7515},"\"standalone\"",{"type":21,"tag":209,"props":7517,"children":7518},{"style":222},[7519],{"type":26,"value":304},{"type":21,"tag":209,"props":7521,"children":7522},{"class":211,"line":325},[7523,7528,7532,7537],{"type":21,"tag":209,"props":7524,"children":7525},{"style":263},[7526],{"type":26,"value":7527},"    \"orientation\"",{"type":21,"tag":209,"props":7529,"children":7530},{"style":222},[7531],{"type":26,"value":7427},{"type":21,"tag":209,"props":7533,"children":7534},{"style":233},[7535],{"type":26,"value":7536},"\"portrait\"",{"type":21,"tag":209,"props":7538,"children":7539},{"style":222},[7540],{"type":26,"value":304},{"type":21,"tag":209,"props":7542,"children":7543},{"class":211,"line":334},[7544,7549],{"type":21,"tag":209,"props":7545,"children":7546},{"style":263},[7547],{"type":26,"value":7548},"    \"icons\"",{"type":21,"tag":209,"props":7550,"children":7551},{"style":222},[7552],{"type":26,"value":7553},": [\n",{"type":21,"tag":209,"props":7555,"children":7556},{"class":211,"line":343},[7557],{"type":21,"tag":209,"props":7558,"children":7559},{"style":222},[7560],{"type":26,"value":7561},"        {\n",{"type":21,"tag":209,"props":7563,"children":7564},{"class":211,"line":351},[7565,7570,7574,7579],{"type":21,"tag":209,"props":7566,"children":7567},{"style":263},[7568],{"type":26,"value":7569},"            \"src\"",{"type":21,"tag":209,"props":7571,"children":7572},{"style":222},[7573],{"type":26,"value":7427},{"type":21,"tag":209,"props":7575,"children":7576},{"style":233},[7577],{"type":26,"value":7578},"\"/static/img/icon180x180.png\"",{"type":21,"tag":209,"props":7580,"children":7581},{"style":222},[7582],{"type":26,"value":304},{"type":21,"tag":209,"props":7584,"children":7585},{"class":211,"line":444},[7586,7591,7595,7600],{"type":21,"tag":209,"props":7587,"children":7588},{"style":263},[7589],{"type":26,"value":7590},"            \"type\"",{"type":21,"tag":209,"props":7592,"children":7593},{"style":222},[7594],{"type":26,"value":7427},{"type":21,"tag":209,"props":7596,"children":7597},{"style":233},[7598],{"type":26,"value":7599},"\"image/png\"",{"type":21,"tag":209,"props":7601,"children":7602},{"style":222},[7603],{"type":26,"value":304},{"type":21,"tag":209,"props":7605,"children":7606},{"class":211,"line":454},[7607,7612,7616],{"type":21,"tag":209,"props":7608,"children":7609},{"style":263},[7610],{"type":26,"value":7611},"            \"sizes\"",{"type":21,"tag":209,"props":7613,"children":7614},{"style":222},[7615],{"type":26,"value":7427},{"type":21,"tag":209,"props":7617,"children":7618},{"style":233},[7619],{"type":26,"value":7620},"\"180x180\"\n",{"type":21,"tag":209,"props":7622,"children":7623},{"class":211,"line":463},[7624],{"type":21,"tag":209,"props":7625,"children":7626},{"style":222},[7627],{"type":26,"value":2522},{"type":21,"tag":209,"props":7629,"children":7630},{"class":211,"line":472},[7631],{"type":21,"tag":209,"props":7632,"children":7633},{"style":222},[7634],{"type":26,"value":7561},{"type":21,"tag":209,"props":7636,"children":7637},{"class":211,"line":480},[7638,7642,7646,7651],{"type":21,"tag":209,"props":7639,"children":7640},{"style":263},[7641],{"type":26,"value":7569},{"type":21,"tag":209,"props":7643,"children":7644},{"style":222},[7645],{"type":26,"value":7427},{"type":21,"tag":209,"props":7647,"children":7648},{"style":233},[7649],{"type":26,"value":7650},"\"/static/img/icon192x192.png\"",{"type":21,"tag":209,"props":7652,"children":7653},{"style":222},[7654],{"type":26,"value":304},{"type":21,"tag":209,"props":7656,"children":7657},{"class":211,"line":489},[7658,7662,7666,7670],{"type":21,"tag":209,"props":7659,"children":7660},{"style":263},[7661],{"type":26,"value":7590},{"type":21,"tag":209,"props":7663,"children":7664},{"style":222},[7665],{"type":26,"value":7427},{"type":21,"tag":209,"props":7667,"children":7668},{"style":233},[7669],{"type":26,"value":7599},{"type":21,"tag":209,"props":7671,"children":7672},{"style":222},[7673],{"type":26,"value":304},{"type":21,"tag":209,"props":7675,"children":7676},{"class":211,"line":847},[7677,7681,7685],{"type":21,"tag":209,"props":7678,"children":7679},{"style":263},[7680],{"type":26,"value":7611},{"type":21,"tag":209,"props":7682,"children":7683},{"style":222},[7684],{"type":26,"value":7427},{"type":21,"tag":209,"props":7686,"children":7687},{"style":233},[7688],{"type":26,"value":7689},"\"192x192\"\n",{"type":21,"tag":209,"props":7691,"children":7692},{"class":211,"line":860},[7693],{"type":21,"tag":209,"props":7694,"children":7695},{"style":222},[7696],{"type":26,"value":2522},{"type":21,"tag":209,"props":7698,"children":7699},{"class":211,"line":877},[7700],{"type":21,"tag":209,"props":7701,"children":7702},{"style":222},[7703],{"type":26,"value":7561},{"type":21,"tag":209,"props":7705,"children":7706},{"class":211,"line":889},[7707,7711,7715,7720],{"type":21,"tag":209,"props":7708,"children":7709},{"style":263},[7710],{"type":26,"value":7569},{"type":21,"tag":209,"props":7712,"children":7713},{"style":222},[7714],{"type":26,"value":7427},{"type":21,"tag":209,"props":7716,"children":7717},{"style":233},[7718],{"type":26,"value":7719},"\"/static/img/icon512x512.png\"",{"type":21,"tag":209,"props":7721,"children":7722},{"style":222},[7723],{"type":26,"value":304},{"type":21,"tag":209,"props":7725,"children":7726},{"class":211,"line":902},[7727,7731,7735,7739],{"type":21,"tag":209,"props":7728,"children":7729},{"style":263},[7730],{"type":26,"value":7590},{"type":21,"tag":209,"props":7732,"children":7733},{"style":222},[7734],{"type":26,"value":7427},{"type":21,"tag":209,"props":7736,"children":7737},{"style":233},[7738],{"type":26,"value":7599},{"type":21,"tag":209,"props":7740,"children":7741},{"style":222},[7742],{"type":26,"value":304},{"type":21,"tag":209,"props":7744,"children":7745},{"class":211,"line":914},[7746,7750,7754],{"type":21,"tag":209,"props":7747,"children":7748},{"style":263},[7749],{"type":26,"value":7611},{"type":21,"tag":209,"props":7751,"children":7752},{"style":222},[7753],{"type":26,"value":7427},{"type":21,"tag":209,"props":7755,"children":7756},{"style":233},[7757],{"type":26,"value":7758},"\"512x512\"\n",{"type":21,"tag":209,"props":7760,"children":7761},{"class":211,"line":922},[7762],{"type":21,"tag":209,"props":7763,"children":7764},{"style":222},[7765],{"type":26,"value":2235},{"type":21,"tag":209,"props":7767,"children":7768},{"class":211,"line":2312},[7769],{"type":21,"tag":209,"props":7770,"children":7771},{"style":222},[7772],{"type":26,"value":7773},"    ],\n",{"type":21,"tag":209,"props":7775,"children":7776},{"class":211,"line":2321},[7777,7782,7786],{"type":21,"tag":209,"props":7778,"children":7779},{"style":263},[7780],{"type":26,"value":7781},"    \"start_url\"",{"type":21,"tag":209,"props":7783,"children":7784},{"style":222},[7785],{"type":26,"value":7427},{"type":21,"tag":209,"props":7787,"children":7788},{"style":233},[7789],{"type":26,"value":7790},"\"/\"\n",{"type":21,"tag":209,"props":7792,"children":7793},{"class":211,"line":2372},[7794],{"type":21,"tag":209,"props":7795,"children":7796},{"style":222},[7797],{"type":26,"value":7798},"}\n",{"type":21,"tag":22,"props":7800,"children":7801},{},[7802],{"type":26,"value":7803},"So, let's go through this line-by-line.",{"type":21,"tag":22,"props":7805,"children":7806},{},[7807,7808,7814,7815,7821,7823,7828,7830,7835],{"type":26,"value":108},{"type":21,"tag":63,"props":7809,"children":7811},{"className":7810},[],[7812],{"type":26,"value":7813},"short_name",{"type":26,"value":7274},{"type":21,"tag":63,"props":7816,"children":7818},{"className":7817},[],[7819],{"type":26,"value":7820},"name",{"type":26,"value":7822}," properties are fairly self-explanatory. The ",{"type":21,"tag":63,"props":7824,"children":7826},{"className":7825},[],[7827],{"type":26,"value":7813},{"type":26,"value":7829}," will be displayed anywhere the OS decides the ",{"type":21,"tag":63,"props":7831,"children":7833},{"className":7832},[],[7834],{"type":26,"value":7820},{"type":26,"value":7836}," won't fit. These could, of course, simply be the same string. How the OS deals with short_names that are still too long is up to the OS, but you can expect truncation of your name, so try and keep the short_name pithy.",{"type":21,"tag":22,"props":7838,"children":7839},{},[7840,7846],{"type":21,"tag":63,"props":7841,"children":7843},{"className":7842},[],[7844],{"type":26,"value":7845},"background_color",{"type":26,"value":7847}," is an important one, as this is going to get used by the OS to generate the 'splash screen' that the user sees when they load your application. If you specify icons, the background-color will be displayed behind the chosen icon.",{"type":21,"tag":22,"props":7849,"children":7850},{},[7851,7857],{"type":21,"tag":63,"props":7852,"children":7854},{"className":7853},[],[7855],{"type":26,"value":7856},"theme_color",{"type":26,"value":7858}," is a little more ambiguous, as what's done with it is up to the OS, and might change; right now, specifying it will determine what colour surrounds the application and is used for it in the task switcher.",{"type":21,"tag":22,"props":7860,"children":7861},{},[7862,7868],{"type":21,"tag":63,"props":7863,"children":7865},{"className":7864},[],[7866],{"type":26,"value":7867},"display",{"type":26,"value":7869}," is another big one - it determines how 'app-like' your PWA is going to appear. If you specify 'standalone', as we have here, it should look and feel like a standalone application - the browser chrome should be excluded, but items like the status bar can be displayed. This is suitable for a LoB-type application. There's also 'fullscreen', which gives you every last pixel - perfect for games - 'minimal-ui', which incorporates some of the browser chrome (how much depends on the browser), and 'browser', which leaves all of the browser chrome around your PWA intact, as though it were being viewed in the browser.",{"type":21,"tag":22,"props":7871,"children":7872},{},[7873,7879],{"type":21,"tag":63,"props":7874,"children":7876},{"className":7875},[],[7877],{"type":26,"value":7878},"orientation",{"type":26,"value":7880}," is another important one for an app - it allows you to specify that the application should be locked to 'portrait' or 'landscape' orientation, amongst a host of other possible values that you can see detailed in the MDN doc linked above.",{"type":21,"tag":22,"props":7882,"children":7883},{},[7884,7890,7892,7897],{"type":21,"tag":63,"props":7885,"children":7887},{"className":7886},[],[7888],{"type":26,"value":7889},"icons",{"type":26,"value":7891}," is, as mentioned, the icons that will be used for display on the home screen and when generating the 'splash screen' the user will see when loading the application. You should specify an array of options to handle different screen sizes and the different contexts in which an icon will be used (e.g. task switcher, home screen, splash screen, etc.). Relative URLs are resolved relative to the location of the manifest.json file (more on that in a minute); you'll notice we're using all PNG files for our icons, but they don't have to be... unless you're also planning to use them with iOS (and more on ",{"type":21,"tag":1084,"props":7893,"children":7894},{},[7895],{"type":26,"value":7896},"that",{"type":26,"value":7898}," in a minute as well).",{"type":21,"tag":22,"props":7900,"children":7901},{},[7902,7904,7910,7912,7917],{"type":26,"value":7903},"Finally, ",{"type":21,"tag":63,"props":7905,"children":7907},{"className":7906},[],[7908],{"type":26,"value":7909},"start_url",{"type":26,"value":7911}," is where we want the PWA to be when it loads from the home screen (as it's possible that the user could have chosen to add the PWA to the home screen from any url on your web app, and without this ",{"type":21,"tag":63,"props":7913,"children":7915},{"className":7914},[],[7916],{"type":26,"value":7909},{"type":26,"value":7918}," specified, that would become the start_url for your PWA).",{"type":21,"tag":22,"props":7920,"children":7921},{},[7922,7924,7930],{"type":26,"value":7923},"All of these details should live in a file called ",{"type":21,"tag":63,"props":7925,"children":7927},{"className":7926},[],[7928],{"type":26,"value":7929},"manifest.json",{"type":26,"value":7931}," and should be somewhere your web server can serve static files from, as you'll be linking to it in the head of your base html file.",{"type":21,"tag":22,"props":7933,"children":7934},{},[7935,7937,7943],{"type":26,"value":7936},"Somewhere in the ",{"type":21,"tag":63,"props":7938,"children":7940},{"className":7939},[],[7941],{"type":26,"value":7942},"\u003Chead>\u003C/head>",{"type":26,"value":7944}," of your html index, you should add the following meta tag:",{"type":21,"tag":200,"props":7946,"children":7950},{"className":7947,"code":7948,"language":7949,"meta":8,"style":8},"language-html shiki shiki-themes github-light github-dark","\u003C!-- PWA Manifest -->\n\u003Clink rel=\"manifest\" href=\"/path/to/manifest.json\">\n","html",[7951],{"type":21,"tag":63,"props":7952,"children":7953},{"__ignoreMap":8},[7954,7962],{"type":21,"tag":209,"props":7955,"children":7956},{"class":211,"line":212},[7957],{"type":21,"tag":209,"props":7958,"children":7959},{"style":448},[7960],{"type":26,"value":7961},"\u003C!-- PWA Manifest -->\n",{"type":21,"tag":209,"props":7963,"children":7964},{"class":211,"line":244},[7965,7969,7974,7979,7983,7988,7993,7997,8002],{"type":21,"tag":209,"props":7966,"children":7967},{"style":222},[7968],{"type":26,"value":1985},{"type":21,"tag":209,"props":7970,"children":7971},{"style":1988},[7972],{"type":26,"value":7973},"link",{"type":21,"tag":209,"props":7975,"children":7976},{"style":360},[7977],{"type":26,"value":7978}," rel",{"type":21,"tag":209,"props":7980,"children":7981},{"style":222},[7982],{"type":26,"value":1432},{"type":21,"tag":209,"props":7984,"children":7985},{"style":233},[7986],{"type":26,"value":7987},"\"manifest\"",{"type":21,"tag":209,"props":7989,"children":7990},{"style":360},[7991],{"type":26,"value":7992}," href",{"type":21,"tag":209,"props":7994,"children":7995},{"style":222},[7996],{"type":26,"value":1432},{"type":21,"tag":209,"props":7998,"children":7999},{"style":233},[8000],{"type":26,"value":8001},"\"/path/to/manifest.json\"",{"type":21,"tag":209,"props":8003,"children":8004},{"style":222},[8005],{"type":26,"value":1996},{"type":21,"tag":22,"props":8007,"children":8008},{},[8009],{"type":26,"value":8010},"That's it for Android, you're ready to go!",{"type":21,"tag":22,"props":8012,"children":8013},{},[8014],{"type":26,"value":8015},"Now, as long as you're adding meta tags, let's look at the slew of meta tags needed for PWA support on iOS.",{"type":21,"tag":3549,"props":8017,"children":8019},{"id":8018},"snowflakes-arent-that-special",[8020],{"type":26,"value":8021},"Snowflakes aren't that Special",{"type":21,"tag":22,"props":8023,"children":8024},{},[8025],{"type":26,"value":8026},"So, by now you're probably pretty excited - you've basically got this PWA thing working, right? Well, sure - unless you need to support iOS.",{"type":21,"tag":22,"props":8028,"children":8029},{},[8030],{"type":26,"value":8031},"Because iOS doesn't support Service Worker. Which means it doesn't support PWAs.",{"type":21,"tag":22,"props":8033,"children":8034},{},[8035,8037,8044],{"type":26,"value":8036},"But wait! No need for that wail of despair (or that sixth whiskey) - I haven't lead you down here just to dash all your hopes. ",{"type":21,"tag":29,"props":8038,"children":8041},{"href":8039,"rel":8040},"https://webkit.org/status/#specification-service-workers",[93],[8042],{"type":26,"value":8043},"iOS doesn't support Service Worker yet, but they're working on it",{"type":26,"value":8045},". Whether they'll also support the manifest functionality is uncertain, but Service Workers are really the beating heart of PWAs, so one day soon, all the work you've put in so far will pay off on iOS.",{"type":21,"tag":22,"props":8047,"children":8048},{},[8049,8051,8058,8060,8066],{"type":26,"value":8050},"In the meantime, even though we can have a full-fat PWA, we can get pretty close with iOS's ",{"type":21,"tag":29,"props":8052,"children":8055},{"href":8053,"rel":8054},"https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html",[93],[8056],{"type":26,"value":8057},"Web Clips",{"type":26,"value":8059}," functionality. That link will give you the details, but let's look at an example. All of the below will go into the ",{"type":21,"tag":63,"props":8061,"children":8063},{"className":8062},[],[8064],{"type":26,"value":8065},"\u003Chead \\>",{"type":26,"value":8067}," of your html document.",{"type":21,"tag":200,"props":8069,"children":8071},{"className":7947,"code":8070,"language":7949,"meta":8,"style":8},"\u003C!-- iOS specific headers for 'web app' behaviours and look-and-feel. -->\n\u003Cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no\" />\n\u003Cmeta name=\"apple-mobile-web-app-capable\" content=\"yes\">\n\u003Cmeta name=\"apple-mobile-web-app-status-bar-style\" content=\"black-translucent\">\n\u003Cmeta name=\"apple-mobile-web-app-title\" content=\"Your app name\">\n\n\u003C!-- iOS Home Screen Icon -->\n\u003Clink rel=\"apple-touch-icon\" href=\"/static/img/yourAppIcon.png\">\n\n\u003C!-- Splash screens for iOS - these did not work in iOS 9/10, but are now working\n    in iOS 11+ - see https://forums.developer.apple.com/thread/23924. -->\n\n\u003C!-- iPhone 7 Plus & 6/s Plus portrait startup image -->\n\u003Clink href=\"{% static 'img/launchScreen1242x2208.png' %}\"\n        media=\"(device-width: 414px) and (device-height: 736px)\n                and (-webkit-device-pixel-ratio: 3)\"\n        rel=\"apple-touch-startup-image\">\n\n\u003C!-- iPhone 7 & 6s portrait startup image -->\n\u003Clink href=\"{% static 'img/launchScreen750x1334.png' %}\"\n        media=\"(device-width: 375px) and (device-height: 667px)\n                and (-webkit-device-pixel-ratio: 2)\"\n        rel=\"apple-touch-startup-image\">\n\n\u003C!-- iPhone 6 portrait startup image -->\n\u003Clink href=\"{% static 'img/launchScreen750x1294.png' %}\"\n        media=\"(device-width: 375px) and (device-height: 667px)\n                and (-webkit-device-pixel-ratio: 2)\"\n        rel=\"apple-touch-startup-image\">\n\n\u003C!-- iPhone 5, SE portrait startup image -->\n\u003Clink href=\"{% static 'img/launchScreen640x1136.png' %}\"\n        media=\"(device-width: 320px) and (device-height: 568px)\n                and (-webkit-device-pixel-ratio: 2)\"\n        rel=\"apple-touch-startup-image\">\n",[8072],{"type":21,"tag":63,"props":8073,"children":8074},{"__ignoreMap":8},[8075,8083,8128,8169,8210,8251,8258,8266,8307,8314,8322,8330,8337,8345,8369,8386,8394,8415,8422,8430,8454,8470,8478,8497,8504,8512,8536,8551,8558,8577,8584,8592,8616,8632,8639],{"type":21,"tag":209,"props":8076,"children":8077},{"class":211,"line":212},[8078],{"type":21,"tag":209,"props":8079,"children":8080},{"style":448},[8081],{"type":26,"value":8082},"\u003C!-- iOS specific headers for 'web app' behaviours and look-and-feel. -->\n",{"type":21,"tag":209,"props":8084,"children":8085},{"class":211,"line":244},[8086,8090,8095,8100,8104,8109,8114,8118,8123],{"type":21,"tag":209,"props":8087,"children":8088},{"style":222},[8089],{"type":26,"value":1985},{"type":21,"tag":209,"props":8091,"children":8092},{"style":1988},[8093],{"type":26,"value":8094},"meta",{"type":21,"tag":209,"props":8096,"children":8097},{"style":360},[8098],{"type":26,"value":8099}," name",{"type":21,"tag":209,"props":8101,"children":8102},{"style":222},[8103],{"type":26,"value":1432},{"type":21,"tag":209,"props":8105,"children":8106},{"style":233},[8107],{"type":26,"value":8108},"\"viewport\"",{"type":21,"tag":209,"props":8110,"children":8111},{"style":360},[8112],{"type":26,"value":8113}," content",{"type":21,"tag":209,"props":8115,"children":8116},{"style":222},[8117],{"type":26,"value":1432},{"type":21,"tag":209,"props":8119,"children":8120},{"style":233},[8121],{"type":26,"value":8122},"\"width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no\"",{"type":21,"tag":209,"props":8124,"children":8125},{"style":222},[8126],{"type":26,"value":8127}," />\n",{"type":21,"tag":209,"props":8129,"children":8130},{"class":211,"line":254},[8131,8135,8139,8143,8147,8152,8156,8160,8165],{"type":21,"tag":209,"props":8132,"children":8133},{"style":222},[8134],{"type":26,"value":1985},{"type":21,"tag":209,"props":8136,"children":8137},{"style":1988},[8138],{"type":26,"value":8094},{"type":21,"tag":209,"props":8140,"children":8141},{"style":360},[8142],{"type":26,"value":8099},{"type":21,"tag":209,"props":8144,"children":8145},{"style":222},[8146],{"type":26,"value":1432},{"type":21,"tag":209,"props":8148,"children":8149},{"style":233},[8150],{"type":26,"value":8151},"\"apple-mobile-web-app-capable\"",{"type":21,"tag":209,"props":8153,"children":8154},{"style":360},[8155],{"type":26,"value":8113},{"type":21,"tag":209,"props":8157,"children":8158},{"style":222},[8159],{"type":26,"value":1432},{"type":21,"tag":209,"props":8161,"children":8162},{"style":233},[8163],{"type":26,"value":8164},"\"yes\"",{"type":21,"tag":209,"props":8166,"children":8167},{"style":222},[8168],{"type":26,"value":1996},{"type":21,"tag":209,"props":8170,"children":8171},{"class":211,"line":279},[8172,8176,8180,8184,8188,8193,8197,8201,8206],{"type":21,"tag":209,"props":8173,"children":8174},{"style":222},[8175],{"type":26,"value":1985},{"type":21,"tag":209,"props":8177,"children":8178},{"style":1988},[8179],{"type":26,"value":8094},{"type":21,"tag":209,"props":8181,"children":8182},{"style":360},[8183],{"type":26,"value":8099},{"type":21,"tag":209,"props":8185,"children":8186},{"style":222},[8187],{"type":26,"value":1432},{"type":21,"tag":209,"props":8189,"children":8190},{"style":233},[8191],{"type":26,"value":8192},"\"apple-mobile-web-app-status-bar-style\"",{"type":21,"tag":209,"props":8194,"children":8195},{"style":360},[8196],{"type":26,"value":8113},{"type":21,"tag":209,"props":8198,"children":8199},{"style":222},[8200],{"type":26,"value":1432},{"type":21,"tag":209,"props":8202,"children":8203},{"style":233},[8204],{"type":26,"value":8205},"\"black-translucent\"",{"type":21,"tag":209,"props":8207,"children":8208},{"style":222},[8209],{"type":26,"value":1996},{"type":21,"tag":209,"props":8211,"children":8212},{"class":211,"line":288},[8213,8217,8221,8225,8229,8234,8238,8242,8247],{"type":21,"tag":209,"props":8214,"children":8215},{"style":222},[8216],{"type":26,"value":1985},{"type":21,"tag":209,"props":8218,"children":8219},{"style":1988},[8220],{"type":26,"value":8094},{"type":21,"tag":209,"props":8222,"children":8223},{"style":360},[8224],{"type":26,"value":8099},{"type":21,"tag":209,"props":8226,"children":8227},{"style":222},[8228],{"type":26,"value":1432},{"type":21,"tag":209,"props":8230,"children":8231},{"style":233},[8232],{"type":26,"value":8233},"\"apple-mobile-web-app-title\"",{"type":21,"tag":209,"props":8235,"children":8236},{"style":360},[8237],{"type":26,"value":8113},{"type":21,"tag":209,"props":8239,"children":8240},{"style":222},[8241],{"type":26,"value":1432},{"type":21,"tag":209,"props":8243,"children":8244},{"style":233},[8245],{"type":26,"value":8246},"\"Your app name\"",{"type":21,"tag":209,"props":8248,"children":8249},{"style":222},[8250],{"type":26,"value":1996},{"type":21,"tag":209,"props":8252,"children":8253},{"class":211,"line":307},[8254],{"type":21,"tag":209,"props":8255,"children":8256},{"emptyLinePlaceholder":248},[8257],{"type":26,"value":251},{"type":21,"tag":209,"props":8259,"children":8260},{"class":211,"line":325},[8261],{"type":21,"tag":209,"props":8262,"children":8263},{"style":448},[8264],{"type":26,"value":8265},"\u003C!-- iOS Home Screen Icon -->\n",{"type":21,"tag":209,"props":8267,"children":8268},{"class":211,"line":334},[8269,8273,8277,8281,8285,8290,8294,8298,8303],{"type":21,"tag":209,"props":8270,"children":8271},{"style":222},[8272],{"type":26,"value":1985},{"type":21,"tag":209,"props":8274,"children":8275},{"style":1988},[8276],{"type":26,"value":7973},{"type":21,"tag":209,"props":8278,"children":8279},{"style":360},[8280],{"type":26,"value":7978},{"type":21,"tag":209,"props":8282,"children":8283},{"style":222},[8284],{"type":26,"value":1432},{"type":21,"tag":209,"props":8286,"children":8287},{"style":233},[8288],{"type":26,"value":8289},"\"apple-touch-icon\"",{"type":21,"tag":209,"props":8291,"children":8292},{"style":360},[8293],{"type":26,"value":7992},{"type":21,"tag":209,"props":8295,"children":8296},{"style":222},[8297],{"type":26,"value":1432},{"type":21,"tag":209,"props":8299,"children":8300},{"style":233},[8301],{"type":26,"value":8302},"\"/static/img/yourAppIcon.png\"",{"type":21,"tag":209,"props":8304,"children":8305},{"style":222},[8306],{"type":26,"value":1996},{"type":21,"tag":209,"props":8308,"children":8309},{"class":211,"line":343},[8310],{"type":21,"tag":209,"props":8311,"children":8312},{"emptyLinePlaceholder":248},[8313],{"type":26,"value":251},{"type":21,"tag":209,"props":8315,"children":8316},{"class":211,"line":351},[8317],{"type":21,"tag":209,"props":8318,"children":8319},{"style":448},[8320],{"type":26,"value":8321},"\u003C!-- Splash screens for iOS - these did not work in iOS 9/10, but are now working\n",{"type":21,"tag":209,"props":8323,"children":8324},{"class":211,"line":444},[8325],{"type":21,"tag":209,"props":8326,"children":8327},{"style":448},[8328],{"type":26,"value":8329},"    in iOS 11+ - see https://forums.developer.apple.com/thread/23924. -->\n",{"type":21,"tag":209,"props":8331,"children":8332},{"class":211,"line":454},[8333],{"type":21,"tag":209,"props":8334,"children":8335},{"emptyLinePlaceholder":248},[8336],{"type":26,"value":251},{"type":21,"tag":209,"props":8338,"children":8339},{"class":211,"line":463},[8340],{"type":21,"tag":209,"props":8341,"children":8342},{"style":448},[8343],{"type":26,"value":8344},"\u003C!-- iPhone 7 Plus & 6/s Plus portrait startup image -->\n",{"type":21,"tag":209,"props":8346,"children":8347},{"class":211,"line":472},[8348,8352,8356,8360,8364],{"type":21,"tag":209,"props":8349,"children":8350},{"style":222},[8351],{"type":26,"value":1985},{"type":21,"tag":209,"props":8353,"children":8354},{"style":1988},[8355],{"type":26,"value":7973},{"type":21,"tag":209,"props":8357,"children":8358},{"style":360},[8359],{"type":26,"value":7992},{"type":21,"tag":209,"props":8361,"children":8362},{"style":222},[8363],{"type":26,"value":1432},{"type":21,"tag":209,"props":8365,"children":8366},{"style":233},[8367],{"type":26,"value":8368},"\"{% static 'img/launchScreen1242x2208.png' %}\"\n",{"type":21,"tag":209,"props":8370,"children":8371},{"class":211,"line":480},[8372,8377,8381],{"type":21,"tag":209,"props":8373,"children":8374},{"style":360},[8375],{"type":26,"value":8376},"        media",{"type":21,"tag":209,"props":8378,"children":8379},{"style":222},[8380],{"type":26,"value":1432},{"type":21,"tag":209,"props":8382,"children":8383},{"style":233},[8384],{"type":26,"value":8385},"\"(device-width: 414px) and (device-height: 736px)\n",{"type":21,"tag":209,"props":8387,"children":8388},{"class":211,"line":489},[8389],{"type":21,"tag":209,"props":8390,"children":8391},{"style":233},[8392],{"type":26,"value":8393},"                and (-webkit-device-pixel-ratio: 3)\"\n",{"type":21,"tag":209,"props":8395,"children":8396},{"class":211,"line":847},[8397,8402,8406,8411],{"type":21,"tag":209,"props":8398,"children":8399},{"style":360},[8400],{"type":26,"value":8401},"        rel",{"type":21,"tag":209,"props":8403,"children":8404},{"style":222},[8405],{"type":26,"value":1432},{"type":21,"tag":209,"props":8407,"children":8408},{"style":233},[8409],{"type":26,"value":8410},"\"apple-touch-startup-image\"",{"type":21,"tag":209,"props":8412,"children":8413},{"style":222},[8414],{"type":26,"value":1996},{"type":21,"tag":209,"props":8416,"children":8417},{"class":211,"line":860},[8418],{"type":21,"tag":209,"props":8419,"children":8420},{"emptyLinePlaceholder":248},[8421],{"type":26,"value":251},{"type":21,"tag":209,"props":8423,"children":8424},{"class":211,"line":877},[8425],{"type":21,"tag":209,"props":8426,"children":8427},{"style":448},[8428],{"type":26,"value":8429},"\u003C!-- iPhone 7 & 6s portrait startup image -->\n",{"type":21,"tag":209,"props":8431,"children":8432},{"class":211,"line":889},[8433,8437,8441,8445,8449],{"type":21,"tag":209,"props":8434,"children":8435},{"style":222},[8436],{"type":26,"value":1985},{"type":21,"tag":209,"props":8438,"children":8439},{"style":1988},[8440],{"type":26,"value":7973},{"type":21,"tag":209,"props":8442,"children":8443},{"style":360},[8444],{"type":26,"value":7992},{"type":21,"tag":209,"props":8446,"children":8447},{"style":222},[8448],{"type":26,"value":1432},{"type":21,"tag":209,"props":8450,"children":8451},{"style":233},[8452],{"type":26,"value":8453},"\"{% static 'img/launchScreen750x1334.png' %}\"\n",{"type":21,"tag":209,"props":8455,"children":8456},{"class":211,"line":902},[8457,8461,8465],{"type":21,"tag":209,"props":8458,"children":8459},{"style":360},[8460],{"type":26,"value":8376},{"type":21,"tag":209,"props":8462,"children":8463},{"style":222},[8464],{"type":26,"value":1432},{"type":21,"tag":209,"props":8466,"children":8467},{"style":233},[8468],{"type":26,"value":8469},"\"(device-width: 375px) and (device-height: 667px)\n",{"type":21,"tag":209,"props":8471,"children":8472},{"class":211,"line":914},[8473],{"type":21,"tag":209,"props":8474,"children":8475},{"style":233},[8476],{"type":26,"value":8477},"                and (-webkit-device-pixel-ratio: 2)\"\n",{"type":21,"tag":209,"props":8479,"children":8480},{"class":211,"line":922},[8481,8485,8489,8493],{"type":21,"tag":209,"props":8482,"children":8483},{"style":360},[8484],{"type":26,"value":8401},{"type":21,"tag":209,"props":8486,"children":8487},{"style":222},[8488],{"type":26,"value":1432},{"type":21,"tag":209,"props":8490,"children":8491},{"style":233},[8492],{"type":26,"value":8410},{"type":21,"tag":209,"props":8494,"children":8495},{"style":222},[8496],{"type":26,"value":1996},{"type":21,"tag":209,"props":8498,"children":8499},{"class":211,"line":2312},[8500],{"type":21,"tag":209,"props":8501,"children":8502},{"emptyLinePlaceholder":248},[8503],{"type":26,"value":251},{"type":21,"tag":209,"props":8505,"children":8506},{"class":211,"line":2321},[8507],{"type":21,"tag":209,"props":8508,"children":8509},{"style":448},[8510],{"type":26,"value":8511},"\u003C!-- iPhone 6 portrait startup image -->\n",{"type":21,"tag":209,"props":8513,"children":8514},{"class":211,"line":2372},[8515,8519,8523,8527,8531],{"type":21,"tag":209,"props":8516,"children":8517},{"style":222},[8518],{"type":26,"value":1985},{"type":21,"tag":209,"props":8520,"children":8521},{"style":1988},[8522],{"type":26,"value":7973},{"type":21,"tag":209,"props":8524,"children":8525},{"style":360},[8526],{"type":26,"value":7992},{"type":21,"tag":209,"props":8528,"children":8529},{"style":222},[8530],{"type":26,"value":1432},{"type":21,"tag":209,"props":8532,"children":8533},{"style":233},[8534],{"type":26,"value":8535},"\"{% static 'img/launchScreen750x1294.png' %}\"\n",{"type":21,"tag":209,"props":8537,"children":8538},{"class":211,"line":2381},[8539,8543,8547],{"type":21,"tag":209,"props":8540,"children":8541},{"style":360},[8542],{"type":26,"value":8376},{"type":21,"tag":209,"props":8544,"children":8545},{"style":222},[8546],{"type":26,"value":1432},{"type":21,"tag":209,"props":8548,"children":8549},{"style":233},[8550],{"type":26,"value":8469},{"type":21,"tag":209,"props":8552,"children":8553},{"class":211,"line":2389},[8554],{"type":21,"tag":209,"props":8555,"children":8556},{"style":233},[8557],{"type":26,"value":8477},{"type":21,"tag":209,"props":8559,"children":8560},{"class":211,"line":2397},[8561,8565,8569,8573],{"type":21,"tag":209,"props":8562,"children":8563},{"style":360},[8564],{"type":26,"value":8401},{"type":21,"tag":209,"props":8566,"children":8567},{"style":222},[8568],{"type":26,"value":1432},{"type":21,"tag":209,"props":8570,"children":8571},{"style":233},[8572],{"type":26,"value":8410},{"type":21,"tag":209,"props":8574,"children":8575},{"style":222},[8576],{"type":26,"value":1996},{"type":21,"tag":209,"props":8578,"children":8579},{"class":211,"line":2406},[8580],{"type":21,"tag":209,"props":8581,"children":8582},{"emptyLinePlaceholder":248},[8583],{"type":26,"value":251},{"type":21,"tag":209,"props":8585,"children":8586},{"class":211,"line":2415},[8587],{"type":21,"tag":209,"props":8588,"children":8589},{"style":448},[8590],{"type":26,"value":8591},"\u003C!-- iPhone 5, SE portrait startup image -->\n",{"type":21,"tag":209,"props":8593,"children":8594},{"class":211,"line":2424},[8595,8599,8603,8607,8611],{"type":21,"tag":209,"props":8596,"children":8597},{"style":222},[8598],{"type":26,"value":1985},{"type":21,"tag":209,"props":8600,"children":8601},{"style":1988},[8602],{"type":26,"value":7973},{"type":21,"tag":209,"props":8604,"children":8605},{"style":360},[8606],{"type":26,"value":7992},{"type":21,"tag":209,"props":8608,"children":8609},{"style":222},[8610],{"type":26,"value":1432},{"type":21,"tag":209,"props":8612,"children":8613},{"style":233},[8614],{"type":26,"value":8615},"\"{% static 'img/launchScreen640x1136.png' %}\"\n",{"type":21,"tag":209,"props":8617,"children":8618},{"class":211,"line":2433},[8619,8623,8627],{"type":21,"tag":209,"props":8620,"children":8621},{"style":360},[8622],{"type":26,"value":8376},{"type":21,"tag":209,"props":8624,"children":8625},{"style":222},[8626],{"type":26,"value":1432},{"type":21,"tag":209,"props":8628,"children":8629},{"style":233},[8630],{"type":26,"value":8631},"\"(device-width: 320px) and (device-height: 568px)\n",{"type":21,"tag":209,"props":8633,"children":8634},{"class":211,"line":2442},[8635],{"type":21,"tag":209,"props":8636,"children":8637},{"style":233},[8638],{"type":26,"value":8477},{"type":21,"tag":209,"props":8640,"children":8641},{"class":211,"line":2471},[8642,8646,8650,8654],{"type":21,"tag":209,"props":8643,"children":8644},{"style":360},[8645],{"type":26,"value":8401},{"type":21,"tag":209,"props":8647,"children":8648},{"style":222},[8649],{"type":26,"value":1432},{"type":21,"tag":209,"props":8651,"children":8652},{"style":233},[8653],{"type":26,"value":8410},{"type":21,"tag":209,"props":8655,"children":8656},{"style":222},[8657],{"type":26,"value":1996},{"type":21,"tag":22,"props":8659,"children":8660},{},[8661,8663,8670],{"type":26,"value":8662},"Whew! Of course, a lot of that space is taken up by the various startup images - and if we wanted to display 'landscape' startup images as well, it would be twice as long. The launch screen image size you will want can be drawn from the ",{"type":21,"tag":29,"props":8664,"children":8667},{"href":8665,"rel":8666},"https://developer.apple.com/ios/human-interface-guidelines/icons-and-images/launch-screen/",[93],[8668],{"type":26,"value":8669},"Apple Human Interface Guidelines document",{"type":26,"value":8671}," - the specific media queries to use for each is magic culled from some trial and error - you will likely have to perform some testing of your own.",{"type":21,"tag":22,"props":8673,"children":8674},{},[8675,8677,8683,8685,8691,8693,8699],{"type":26,"value":8676},"Above those, you'll see the meta tags that make our web app 'PWA-like' on iOS - particularly ",{"type":21,"tag":63,"props":8678,"children":8680},{"className":8679},[],[8681],{"type":26,"value":8682},"apple-mobile-web-app-capable",{"type":26,"value":8684},". Include these, and your users can use the Web Clip capability in iOS Safari to 'Save to Home Screen' your site. You'll want your icon specified as well - it can be any square resolution (e.g. 180x180 pixels) - and you'll want to specify the application name with the ",{"type":21,"tag":63,"props":8686,"children":8688},{"className":8687},[],[8689],{"type":26,"value":8690},"apple-mobile-web-app-title",{"type":26,"value":8692}," tag - otherwise the contents of the ",{"type":21,"tag":63,"props":8694,"children":8696},{"className":8695},[],[8697],{"type":26,"value":8698},"title",{"type":26,"value":8700}," tag are used.",{"type":21,"tag":22,"props":8702,"children":8703},{},[8704,8706,8712],{"type":26,"value":8705},"Finally, take a look at the ",{"type":21,"tag":63,"props":8707,"children":8709},{"className":8708},[],[8710],{"type":26,"value":8711},"apple-mobile-web-app-status-bar-style",{"type":26,"value":8713}," tag - we're using it to declare that we want the status bar to overlap our application, rather than push it down. The other options - which you can find in the Web Clip specification link, above - will set it's colour to white or black, and push your content down below it. Unfortunately, there's no way to gain every last pixel yet.",{"type":21,"tag":3549,"props":8715,"children":8717},{"id":8716},"cache-this",[8718],{"type":26,"value":8719},"Cache This",{"type":21,"tag":22,"props":8721,"children":8722},{},[8723],{"type":26,"value":8724},"There's a substantial item missing from the iOS support set that we have on Android - caching for offline support. No Service Workers, no offline support. Well, now what?",{"type":21,"tag":22,"props":8726,"children":8727},{},[8728,8730,8737],{"type":26,"value":8729},"Luckily, if this is the make-or-break item, we can make it - using the older ",{"type":21,"tag":29,"props":8731,"children":8734},{"href":8732,"rel":8733},"https://developer.mozilla.org/en-US/docs/Web/HTML/Using_the_application_cache",[93],[8735],{"type":26,"value":8736},"Application Cache API",{"type":26,"value":8738},". Using the application cache is a topic unto itself, so the only thing I'll say here is that you'll need to be careful to only serve the application manifest to iOS devices (and you'll want to check that you're only serving it to iOS devices without Service Worker support, for future-proofing purposes).",{"type":21,"tag":22,"props":8740,"children":8741},{},[8742,8744,8751,8753,8760],{"type":26,"value":8743},"Application Cache and Service Workers don't play nice together (yet - watch ",{"type":21,"tag":29,"props":8745,"children":8748},{"href":8746,"rel":8747},"https://crbug.com/410665",[93],[8749],{"type":26,"value":8750},"this Chromium bug",{"type":26,"value":8752}," for some details on progress for that project). One day, the ",{"type":21,"tag":29,"props":8754,"children":8757},{"href":8755,"rel":8756},"https://www.w3.org/TR/service-workers/#activation-algorithm",[93],[8758],{"type":26,"value":8759},"W3C suggested behaviour",{"type":26,"value":8761}," is that browsers will ignore and/or garbage-collect the application cache when a service worker is registered and takes over caching, but that day is not yet here, and you don't want two competing technologies caching things and producing unexpected results.",{"type":21,"tag":3549,"props":8763,"children":8765},{"id":8764},"are-we-there-yet",[8766],{"type":26,"value":8767},"Are we there Yet?",{"type":21,"tag":22,"props":8769,"children":8770},{},[8771,8773,8778],{"type":26,"value":8772},"This time, we really are - together with ",{"type":21,"tag":29,"props":8774,"children":8775},{"href":8},[8776],{"type":26,"value":8777},"Part 1",{"type":26,"value":8779},", you'll now have a functioning web application that can also be installed to the home screen on Android like a native application, and almost-like-native on iOS; and you're ready for the brave future where iOS becomes fully PWA-capable; AND you have an application that can still be accessed anywhere, by anyone via the Internet.",{"type":21,"tag":22,"props":8781,"children":8782},{},[8783],{"type":26,"value":8784},"Not a bad day's work. Go get yourself a drink.",{"type":21,"tag":3490,"props":8786,"children":8787},{},[8788],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":8790},[8791,8792,8793,8794],{"id":7352,"depth":244,"text":7355},{"id":8018,"depth":244,"text":8021},{"id":8716,"depth":244,"text":8719},{"id":8764,"depth":244,"text":8767},"content:ckeefer:2017-3:MorePWAToYa-Part2.md","ckeefer/2017-3/MorePWAToYa-Part2.md","ckeefer/2017-3/MorePWAToYa-Part2",{"user":3518,"name":3519},{"_path":8800,"_dir":8801,"_draft":7,"_partial":7,"_locale":8,"title":8802,"description":8803,"publishDate":8804,"tags":8805,"excerpt":8803,"body":8806,"_type":3511,"_id":9495,"_source":3513,"_file":9496,"_stem":9497,"_extension":3516,"author":9498},"/ckeefer/2017-1/downloadingclientsidecontent","2017-1","Downloading Client-side Generated Content","A young developer, new to the Tao of the client-side, comes to a Master of the way, and speaks thusly: \"Oh Master, our application nears completion; and lo, cat pics can be drawn upon, and captions fixated thereto, for the creation of humour and the bounteous enjoyment of our users.\"","2017-02-06",[12],{"type":18,"children":8807,"toc":9491},[8808,8812,8817,8822,8827,8832,8837,8859,8880,8885,8923,8928,8946,8969,8974,9029,9042,9088,9093,9098,9140,9159,9178,9207,9213,9218,9231,9244,9328,9333,9396,9401,9482,9487],{"type":21,"tag":22,"props":8809,"children":8810},{},[8811],{"type":26,"value":8803},{"type":21,"tag":22,"props":8813,"children":8814},{},[8815],{"type":26,"value":8816},"\"This is good,\" responded the Master.",{"type":21,"tag":22,"props":8818,"children":8819},{},[8820],{"type":26,"value":8821},"\"But now, I and the acolyte of the server-side have come unto a disagreement, for I wish to render the image to be saved on the client, and by means cunning, reflect the image from the server back unto the grateful user when downloading is desired; but he who develops the server says this is wasteful, and bids me send the minimum data to him, so that the image can be rendered on the server, and then served to the user - but to me this is folly, for do we not then have dependencies in the server on image libraries which we could otherwise do without? And so we are at an impasse.\"",{"type":21,"tag":22,"props":8823,"children":8824},{},[8825],{"type":26,"value":8826},"The Master shook his head at the folly of youth. \"You may tell the acolyte of the server that his services shall not be needed in this instance,\" he told the young developer. \"The shortest journey is one that ends where it begins.\"",{"type":21,"tag":22,"props":8828,"children":8829},{},[8830],{"type":26,"value":8831},"And the young developer was enlightened.",{"type":21,"tag":22,"props":8833,"children":8834},{},[8835],{"type":26,"value":8836},"In times past, offering content generated in the browser for download by the user was a difficult proposition - one needed to rely on plugins like Flash (boo! hiss!), or on sending the content up to the server to be sent back to the user with the appropriate headers to trigger a download, incurring the cost of the bandwidth up and down in the process.",{"type":21,"tag":22,"props":8838,"children":8839},{},[8840,8842,8849,8851,8858],{"type":26,"value":8841},"It's still not a straightforward prospect if you need to support older browsers - even IE 11 will require you to dip your toes into the shark-infested pool of browser-specific extensions like ",{"type":21,"tag":29,"props":8843,"children":8846},{"href":8844,"rel":8845},"https://msdn.microsoft.com/en-us/library/hh779016(v=vs.85).aspx",[93],[8847],{"type":26,"value":8848},"msSaveBlob",{"type":26,"value":8850},"; and then there's aborted efforts like the ",{"type":21,"tag":29,"props":8852,"children":8855},{"href":8853,"rel":8854},"https://developer.mozilla.org/en-US/docs/Web/API/FileSystem",[93],[8856],{"type":26,"value":8857},"FileSystem API",{"type":26,"value":378},{"type":21,"tag":22,"props":8860,"children":8861},{},[8862,8864,8871,8872,8879],{"type":26,"value":8863},"However, if you've managed to make a reliance on only modern/evergreen browsers stick for your project, a couple of HTML5 APIs have your content downloading needs covered - the ",{"type":21,"tag":29,"props":8865,"children":8868},{"href":8866,"rel":8867},"http://caniuse.com/#feat=download",[93],[8869],{"type":26,"value":8870},"Download Attribute",{"type":26,"value":7274},{"type":21,"tag":29,"props":8873,"children":8876},{"href":8874,"rel":8875},"http://caniuse.com/#feat=bloburls",[93],[8877],{"type":26,"value":8878},"Blob URLs",{"type":26,"value":378},{"type":21,"tag":3549,"props":8881,"children":8883},{"id":8882},"blob-urls",[8884],{"type":26,"value":8878},{"type":21,"tag":22,"props":8886,"children":8887},{},[8888,8890,8896,8898,8905,8907,8913,8915,8921],{"type":26,"value":8889},"So what are ",{"type":21,"tag":29,"props":8891,"children":8894},{"href":8892,"rel":8893},"https://developer.mozilla.org/en-US/docs/Web/API/URL/createObjectURL",[93],[8895],{"type":26,"value":8878},{"type":26,"value":8897},"? In short, they're a way of referencing a ",{"type":21,"tag":29,"props":8899,"children":8902},{"href":8900,"rel":8901},"https://developer.mozilla.org/en/docs/Web/API/Blob",[93],[8903],{"type":26,"value":8904},"Blob",{"type":26,"value":8906}," in the browser that allows us to interact with it like it was a remote file reference - for instance, we can assign it as the value of the ",{"type":21,"tag":63,"props":8908,"children":8910},{"className":8909},[],[8911],{"type":26,"value":8912},"src",{"type":26,"value":8914}," attribute of an ",{"type":21,"tag":63,"props":8916,"children":8918},{"className":8917},[],[8919],{"type":26,"value":8920},"img",{"type":26,"value":8922}," tag.",{"type":21,"tag":22,"props":8924,"children":8925},{},[8926],{"type":26,"value":8927},"Of course, Blob URLs are only useful if you can use Blobs, so you can implicitly expect any browser supporting the former to support the latter as well. This make getting a blob url a three part process, each of which we'll be discussing today:",{"type":21,"tag":3739,"props":8929,"children":8930},{},[8931,8936,8941],{"type":21,"tag":3681,"props":8932,"children":8933},{},[8934],{"type":26,"value":8935},"Get the blob;",{"type":21,"tag":3681,"props":8937,"children":8938},{},[8939],{"type":26,"value":8940},"Create the object url for the blob;",{"type":21,"tag":3681,"props":8942,"children":8943},{},[8944],{"type":26,"value":8945},"After we're finished with the url, revoke it.",{"type":21,"tag":22,"props":8947,"children":8948},{},[8949,8951,8958,8960,8967],{"type":26,"value":8950},"In our scenario above, getting a Blob is trivial - the ",{"type":21,"tag":29,"props":8952,"children":8955},{"href":8953,"rel":8954},"https://developer.mozilla.org/en/docs/Web/API/HTMLCanvasElement",[93],[8956],{"type":26,"value":8957},"HTMLCanvasElement",{"type":26,"value":8959}," interface offers us a convenient ",{"type":21,"tag":29,"props":8961,"children":8964},{"href":8962,"rel":8963},"https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toBlob",[93],[8965],{"type":26,"value":8966},"toBlob",{"type":26,"value":8968}," function that we can call asynchronously to get the contents of the canvas as a Blob.",{"type":21,"tag":22,"props":8970,"children":8971},{},[8972],{"type":26,"value":8973},"Let's say we had a bunch of comma-seperated values that we wanted to give to the user instead, however. In that case, we can just construct a new Blob from the string, like so:",{"type":21,"tag":200,"props":8975,"children":8977},{"className":202,"code":8976,"language":12,"meta":8,"style":8},"// Assuming we have our CSV in a string variable named 'csv'.\nvar blob = new Blob(csv, {type: 'text/csv'});\n",[8978],{"type":21,"tag":63,"props":8979,"children":8980},{"__ignoreMap":8},[8981,8989],{"type":21,"tag":209,"props":8982,"children":8983},{"class":211,"line":212},[8984],{"type":21,"tag":209,"props":8985,"children":8986},{"style":448},[8987],{"type":26,"value":8988},"// Assuming we have our CSV in a string variable named 'csv'.\n",{"type":21,"tag":209,"props":8990,"children":8991},{"class":211,"line":244},[8992,8997,9002,9006,9010,9015,9020,9025],{"type":21,"tag":209,"props":8993,"children":8994},{"style":216},[8995],{"type":26,"value":8996},"var",{"type":21,"tag":209,"props":8998,"children":8999},{"style":222},[9000],{"type":26,"value":9001}," blob ",{"type":21,"tag":209,"props":9003,"children":9004},{"style":216},[9005],{"type":26,"value":1432},{"type":21,"tag":209,"props":9007,"children":9008},{"style":216},[9009],{"type":26,"value":4667},{"type":21,"tag":209,"props":9011,"children":9012},{"style":360},[9013],{"type":26,"value":9014}," Blob",{"type":21,"tag":209,"props":9016,"children":9017},{"style":222},[9018],{"type":26,"value":9019},"(csv, {type: ",{"type":21,"tag":209,"props":9021,"children":9022},{"style":233},[9023],{"type":26,"value":9024},"'text/csv'",{"type":21,"tag":209,"props":9026,"children":9027},{"style":222},[9028],{"type":26,"value":469},{"type":21,"tag":22,"props":9030,"children":9031},{},[9032,9034,9041],{"type":26,"value":9033},"Easy, right? We could also do this with arbitrary binary data, passing in a ",{"type":21,"tag":29,"props":9035,"children":9038},{"href":9036,"rel":9037},"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays",[93],[9039],{"type":26,"value":9040},"typed array",{"type":26,"value":191},{"type":21,"tag":200,"props":9043,"children":9047},{"className":9044,"code":9045,"language":9046,"meta":8,"style":8},"language-javascript shiki shiki-themes github-light github-dark","var blob = new Blob([the_typed_array], {type: 'application/octet-stream'});\n","javascript",[9048],{"type":21,"tag":63,"props":9049,"children":9050},{"__ignoreMap":8},[9051],{"type":21,"tag":209,"props":9052,"children":9053},{"class":211,"line":212},[9054,9058,9062,9066,9070,9074,9079,9084],{"type":21,"tag":209,"props":9055,"children":9056},{"style":216},[9057],{"type":26,"value":8996},{"type":21,"tag":209,"props":9059,"children":9060},{"style":222},[9061],{"type":26,"value":9001},{"type":21,"tag":209,"props":9063,"children":9064},{"style":216},[9065],{"type":26,"value":1432},{"type":21,"tag":209,"props":9067,"children":9068},{"style":216},[9069],{"type":26,"value":4667},{"type":21,"tag":209,"props":9071,"children":9072},{"style":360},[9073],{"type":26,"value":9014},{"type":21,"tag":209,"props":9075,"children":9076},{"style":222},[9077],{"type":26,"value":9078},"([the_typed_array], {type: ",{"type":21,"tag":209,"props":9080,"children":9081},{"style":233},[9082],{"type":26,"value":9083},"'application/octet-stream'",{"type":21,"tag":209,"props":9085,"children":9086},{"style":222},[9087],{"type":26,"value":469},{"type":21,"tag":22,"props":9089,"children":9090},{},[9091],{"type":26,"value":9092},"This could be generating save files for games, user-specific executables, etc.",{"type":21,"tag":22,"props":9094,"children":9095},{},[9096],{"type":26,"value":9097},"Now that we have our blob one way or the other, creating the object URL is just as easy:",{"type":21,"tag":200,"props":9099,"children":9101},{"className":9044,"code":9100,"language":9046,"meta":8,"style":8},"var blobURL = URL.createObjectURL(blob);\n",[9102],{"type":21,"tag":63,"props":9103,"children":9104},{"__ignoreMap":8},[9105],{"type":21,"tag":209,"props":9106,"children":9107},{"class":211,"line":212},[9108,9112,9117,9121,9126,9130,9135],{"type":21,"tag":209,"props":9109,"children":9110},{"style":216},[9111],{"type":26,"value":8996},{"type":21,"tag":209,"props":9113,"children":9114},{"style":222},[9115],{"type":26,"value":9116}," blobURL ",{"type":21,"tag":209,"props":9118,"children":9119},{"style":216},[9120],{"type":26,"value":1432},{"type":21,"tag":209,"props":9122,"children":9123},{"style":263},[9124],{"type":26,"value":9125}," URL",{"type":21,"tag":209,"props":9127,"children":9128},{"style":222},[9129],{"type":26,"value":378},{"type":21,"tag":209,"props":9131,"children":9132},{"style":360},[9133],{"type":26,"value":9134},"createObjectURL",{"type":21,"tag":209,"props":9136,"children":9137},{"style":222},[9138],{"type":26,"value":9139},"(blob);\n",{"type":21,"tag":22,"props":9141,"children":9142},{},[9143,9145,9150,9152,9157],{"type":26,"value":9144},"On the topic of point 3, above, we ",{"type":21,"tag":1084,"props":9146,"children":9147},{},[9148],{"type":26,"value":9149},"could",{"type":26,"value":9151}," just rely on the garbage collection of the browser - the lifetime of our object urls are tied to the document. However, it's good practice to revoke the urls yourself - otherwise blobs that could otherwise be garbage collected may stick around, unecessarily consuming memory. Also keep in mind that each object url is unique - if you call ",{"type":21,"tag":63,"props":9153,"children":9155},{"className":9154},[],[9156],{"type":26,"value":9134},{"type":26,"value":9158}," against the same blob three times, you get three different URLs you'll need to revoke separately.",{"type":21,"tag":22,"props":9160,"children":9161},{},[9162,9164,9169,9171,9176],{"type":26,"value":9163},"On the other hand, if you're using the object url as, for example, the ",{"type":21,"tag":63,"props":9165,"children":9167},{"className":9166},[],[9168],{"type":26,"value":8912},{"type":26,"value":9170}," of an ",{"type":21,"tag":63,"props":9172,"children":9174},{"className":9173},[],[9175],{"type":26,"value":8920},{"type":26,"value":9177},", you don't want to revoke said URL until you remove the img from the DOM, otherwise you'll end up with a broken img tag.",{"type":21,"tag":200,"props":9179,"children":9181},{"className":9044,"code":9180,"language":9046,"meta":8,"style":8},"URL.revokeObjectURL(blobURL);\n",[9182],{"type":21,"tag":63,"props":9183,"children":9184},{"__ignoreMap":8},[9185],{"type":21,"tag":209,"props":9186,"children":9187},{"class":211,"line":212},[9188,9193,9197,9202],{"type":21,"tag":209,"props":9189,"children":9190},{"style":263},[9191],{"type":26,"value":9192},"URL",{"type":21,"tag":209,"props":9194,"children":9195},{"style":222},[9196],{"type":26,"value":378},{"type":21,"tag":209,"props":9198,"children":9199},{"style":360},[9200],{"type":26,"value":9201},"revokeObjectURL",{"type":21,"tag":209,"props":9203,"children":9204},{"style":222},[9205],{"type":26,"value":9206},"(blobURL);\n",{"type":21,"tag":3549,"props":9208,"children":9210},{"id":9209},"anchor-download-attribute",[9211],{"type":26,"value":9212},"Anchor Download Attribute",{"type":21,"tag":22,"props":9214,"children":9215},{},[9216],{"type":26,"value":9217},"For a while, it seemed like browser vendors were set to give us a more comprehensive access to the file system, or some sandboxed portion thereof. That withered on the vine, but it didn't take with it the need to sometimes download generated content - and so we have the anchor download attribute. It's actually a pleasantly intuitive overloading of the anchor element - classically, we might point to a file on a server with the anchor element, expecting that the user would click on it and thereby trigger the download - assuming the server sent the appropriate headers.",{"type":21,"tag":22,"props":9219,"children":9220},{},[9221,9223,9229],{"type":26,"value":9222},"In this case, we can indicate that we want the client to download whatever the anchor is pointing to, even if the ",{"type":21,"tag":63,"props":9224,"children":9226},{"className":9225},[],[9227],{"type":26,"value":9228},"content-disposition",{"type":26,"value":9230}," headers we would normally require aren't sent, and we can specify a default name for the resulting file - and combining that with object urls lets us inform the browser that we want it to download the client-side Blob that the anchor is pointing to.",{"type":21,"tag":22,"props":9232,"children":9233},{},[9234,9236,9242],{"type":26,"value":9235},"So, assuming we have a ",{"type":21,"tag":63,"props":9237,"children":9239},{"className":9238},[],[9240],{"type":26,"value":9241},"blobURL",{"type":26,"value":9243}," from the process above:",{"type":21,"tag":200,"props":9245,"children":9247},{"className":9044,"code":9246,"language":9046,"meta":8,"style":8},"var anchor = document.createElement('a');\nanchor.href = blobURL;\nanchor.download = 'name_of_file.ext';\n",[9248],{"type":21,"tag":63,"props":9249,"children":9250},{"__ignoreMap":8},[9251,9290,9307],{"type":21,"tag":209,"props":9252,"children":9253},{"class":211,"line":212},[9254,9258,9263,9267,9272,9277,9281,9286],{"type":21,"tag":209,"props":9255,"children":9256},{"style":216},[9257],{"type":26,"value":8996},{"type":21,"tag":209,"props":9259,"children":9260},{"style":222},[9261],{"type":26,"value":9262}," anchor ",{"type":21,"tag":209,"props":9264,"children":9265},{"style":216},[9266],{"type":26,"value":1432},{"type":21,"tag":209,"props":9268,"children":9269},{"style":222},[9270],{"type":26,"value":9271}," document.",{"type":21,"tag":209,"props":9273,"children":9274},{"style":360},[9275],{"type":26,"value":9276},"createElement",{"type":21,"tag":209,"props":9278,"children":9279},{"style":222},[9280],{"type":26,"value":368},{"type":21,"tag":209,"props":9282,"children":9283},{"style":233},[9284],{"type":26,"value":9285},"'a'",{"type":21,"tag":209,"props":9287,"children":9288},{"style":222},[9289],{"type":26,"value":2608},{"type":21,"tag":209,"props":9291,"children":9292},{"class":211,"line":244},[9293,9298,9302],{"type":21,"tag":209,"props":9294,"children":9295},{"style":222},[9296],{"type":26,"value":9297},"anchor.href ",{"type":21,"tag":209,"props":9299,"children":9300},{"style":216},[9301],{"type":26,"value":1432},{"type":21,"tag":209,"props":9303,"children":9304},{"style":222},[9305],{"type":26,"value":9306}," blobURL;\n",{"type":21,"tag":209,"props":9308,"children":9309},{"class":211,"line":254},[9310,9315,9319,9324],{"type":21,"tag":209,"props":9311,"children":9312},{"style":222},[9313],{"type":26,"value":9314},"anchor.download ",{"type":21,"tag":209,"props":9316,"children":9317},{"style":216},[9318],{"type":26,"value":1432},{"type":21,"tag":209,"props":9320,"children":9321},{"style":233},[9322],{"type":26,"value":9323}," 'name_of_file.ext'",{"type":21,"tag":209,"props":9325,"children":9326},{"style":222},[9327],{"type":26,"value":241},{"type":21,"tag":22,"props":9329,"children":9330},{},[9331],{"type":26,"value":9332},"If we wanted to show this anchor to the user for them to click on, we could simply add it wherever appropriate. If, however, we wanted to trigger a download automatically, this too is fairly straightforward:",{"type":21,"tag":200,"props":9334,"children":9336},{"className":9044,"code":9335,"language":9046,"meta":8,"style":8},"anchor.style.display = \"none\";\ndocument.body.appendChild(anchor);\nanchor.click();\n",[9337],{"type":21,"tag":63,"props":9338,"children":9339},{"__ignoreMap":8},[9340,9361,9379],{"type":21,"tag":209,"props":9341,"children":9342},{"class":211,"line":212},[9343,9348,9352,9357],{"type":21,"tag":209,"props":9344,"children":9345},{"style":222},[9346],{"type":26,"value":9347},"anchor.style.display ",{"type":21,"tag":209,"props":9349,"children":9350},{"style":216},[9351],{"type":26,"value":1432},{"type":21,"tag":209,"props":9353,"children":9354},{"style":233},[9355],{"type":26,"value":9356}," \"none\"",{"type":21,"tag":209,"props":9358,"children":9359},{"style":222},[9360],{"type":26,"value":241},{"type":21,"tag":209,"props":9362,"children":9363},{"class":211,"line":244},[9364,9369,9374],{"type":21,"tag":209,"props":9365,"children":9366},{"style":222},[9367],{"type":26,"value":9368},"document.body.",{"type":21,"tag":209,"props":9370,"children":9371},{"style":360},[9372],{"type":26,"value":9373},"appendChild",{"type":21,"tag":209,"props":9375,"children":9376},{"style":222},[9377],{"type":26,"value":9378},"(anchor);\n",{"type":21,"tag":209,"props":9380,"children":9381},{"class":211,"line":254},[9382,9387,9392],{"type":21,"tag":209,"props":9383,"children":9384},{"style":222},[9385],{"type":26,"value":9386},"anchor.",{"type":21,"tag":209,"props":9388,"children":9389},{"style":360},[9390],{"type":26,"value":9391},"click",{"type":21,"tag":209,"props":9393,"children":9394},{"style":222},[9395],{"type":26,"value":4842},{"type":21,"tag":22,"props":9397,"children":9398},{},[9399],{"type":26,"value":9400},"Note that we still need to add the anchor to the body. Because this triggers the blocking download logic in the browser, we can then add a little further logic in a timeout to remove the anchor (and, if we're done with the url, revoke it):",{"type":21,"tag":200,"props":9402,"children":9404},{"className":9044,"code":9403,"language":9046,"meta":8,"style":8},"setTimeout(function(){\n    URL.revokeObjectURL(url);\n    document.body.removeChild(anchor);\n}, 1);\n",[9405],{"type":21,"tag":63,"props":9406,"children":9407},{"__ignoreMap":8},[9408,9428,9449,9466],{"type":21,"tag":209,"props":9409,"children":9410},{"class":211,"line":212},[9411,9416,9420,9424],{"type":21,"tag":209,"props":9412,"children":9413},{"style":360},[9414],{"type":26,"value":9415},"setTimeout",{"type":21,"tag":209,"props":9417,"children":9418},{"style":222},[9419],{"type":26,"value":368},{"type":21,"tag":209,"props":9421,"children":9422},{"style":216},[9423],{"type":26,"value":5370},{"type":21,"tag":209,"props":9425,"children":9426},{"style":222},[9427],{"type":26,"value":2561},{"type":21,"tag":209,"props":9429,"children":9430},{"class":211,"line":244},[9431,9436,9440,9444],{"type":21,"tag":209,"props":9432,"children":9433},{"style":263},[9434],{"type":26,"value":9435},"    URL",{"type":21,"tag":209,"props":9437,"children":9438},{"style":222},[9439],{"type":26,"value":378},{"type":21,"tag":209,"props":9441,"children":9442},{"style":360},[9443],{"type":26,"value":9201},{"type":21,"tag":209,"props":9445,"children":9446},{"style":222},[9447],{"type":26,"value":9448},"(url);\n",{"type":21,"tag":209,"props":9450,"children":9451},{"class":211,"line":254},[9452,9457,9462],{"type":21,"tag":209,"props":9453,"children":9454},{"style":222},[9455],{"type":26,"value":9456},"    document.body.",{"type":21,"tag":209,"props":9458,"children":9459},{"style":360},[9460],{"type":26,"value":9461},"removeChild",{"type":21,"tag":209,"props":9463,"children":9464},{"style":222},[9465],{"type":26,"value":9378},{"type":21,"tag":209,"props":9467,"children":9468},{"class":211,"line":279},[9469,9474,9478],{"type":21,"tag":209,"props":9470,"children":9471},{"style":222},[9472],{"type":26,"value":9473},"}, ",{"type":21,"tag":209,"props":9475,"children":9476},{"style":263},[9477],{"type":26,"value":3224},{"type":21,"tag":209,"props":9479,"children":9480},{"style":222},[9481],{"type":26,"value":2608},{"type":21,"tag":22,"props":9483,"children":9484},{},[9485],{"type":26,"value":9486},"And now, the user should be presented with a download of the client-side generated content, with the specified name, without needing any plugins or bounces off the server. Beautiful.",{"type":21,"tag":3490,"props":9488,"children":9489},{},[9490],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":9492},[9493,9494],{"id":8882,"depth":244,"text":8878},{"id":9209,"depth":244,"text":9212},"content:ckeefer:2017-1:downloadingclientsidecontent.md","ckeefer/2017-1/downloadingclientsidecontent.md","ckeefer/2017-1/downloadingclientsidecontent",{"user":3518,"name":3519},{"_path":9500,"_dir":9501,"_draft":7,"_partial":7,"_locale":8,"title":9502,"description":9503,"excerpt":9503,"publishDate":9504,"tags":9505,"body":9506,"_type":3511,"_id":12723,"_source":3513,"_file":12724,"_stem":12725,"_extension":3516,"author":12726},"/ckeefer/2017-2/morepwatoya-part1","2017-2","More PWA to Ya! (Progressive Web Apps, Part 1)","It's project kickoff time, and you're having a conversation with your client about what form the application will take:","2017-02-01",[7334,7333,7335],{"type":18,"children":9507,"toc":12712},[9508,9512,9607,9621,9626,9638,9643,9648,9654,9668,9673,9681,9693,9698,9759,9764,9798,9804,9809,9838,10142,10147,10293,10314,10320,10325,10345,11185,11191,11196,12549,12554,12560,12565,12578,12584,12597,12611,12632,12638,12651,12656,12684,12689,12703,12708],{"type":21,"tag":22,"props":9509,"children":9510},{},[9511],{"type":26,"value":9503},{"type":21,"tag":4462,"props":9513,"children":9514},{},[9515,9525,9535,9544,9553,9562,9571,9580,9589,9598],{"type":21,"tag":22,"props":9516,"children":9517},{},[9518,9523],{"type":21,"tag":1084,"props":9519,"children":9520},{},[9521],{"type":26,"value":9522},"Client",{"type":26,"value":9524},": I'm thinking mobile app. Our users will definitely be using this on the go.",{"type":21,"tag":22,"props":9526,"children":9527},{},[9528,9533],{"type":21,"tag":1084,"props":9529,"children":9530},{},[9531],{"type":26,"value":9532},"Dev",{"type":26,"value":9534},": Sure, we can do a native mobile-",{"type":21,"tag":22,"props":9536,"children":9537},{},[9538,9542],{"type":21,"tag":1084,"props":9539,"children":9540},{},[9541],{"type":26,"value":9522},{"type":26,"value":9543},": Mind you, we'll want a desktop version too. We'll need to use it from the office.",{"type":21,"tag":22,"props":9545,"children":9546},{},[9547,9551],{"type":21,"tag":1084,"props":9548,"children":9549},{},[9550],{"type":26,"value":9532},{"type":26,"value":9552},": Okay, well, a responsive web app-",{"type":21,"tag":22,"props":9554,"children":9555},{},[9556,9560],{"type":21,"tag":1084,"props":9557,"children":9558},{},[9559],{"type":26,"value":9522},{"type":26,"value":9561},": One of our priorities is definitely ease of access - we'll need the app accessible from the home screen, 'cause who has time for typing in URLs, amirite? We'll also want it to be useable offline, whenever people want to.",{"type":21,"tag":22,"props":9563,"children":9564},{},[9565,9569],{"type":21,"tag":1084,"props":9566,"children":9567},{},[9568],{"type":26,"value":9532},{"type":26,"value":9570},": Ye-yeah, no problem, we can wrap your web app in a webview, bundle it up as a native app, and-",{"type":21,"tag":22,"props":9572,"children":9573},{},[9574,9578],{"type":21,"tag":1084,"props":9575,"children":9576},{},[9577],{"type":26,"value":9522},{"type":26,"value":9579},": Yeah, cool. So they'll just be able to go to the site and install the app, right?",{"type":21,"tag":22,"props":9581,"children":9582},{},[9583,9587],{"type":21,"tag":1084,"props":9584,"children":9585},{},[9586],{"type":26,"value":9532},{"type":26,"value":9588},": Well, no, they'll have to download it from the appropriate App Store.",{"type":21,"tag":22,"props":9590,"children":9591},{},[9592,9596],{"type":21,"tag":1084,"props":9593,"children":9594},{},[9595],{"type":26,"value":9522},{"type":26,"value":9597},": Eh, that's a no-go - this is internal only, we can't have it showing up in the app stores. Didn't I make that clear from the start?",{"type":21,"tag":22,"props":9599,"children":9600},{},[9601,9605],{"type":21,"tag":1084,"props":9602,"children":9603},{},[9604],{"type":26,"value":9532},{"type":26,"value":9606},": ...",{"type":21,"tag":22,"props":9608,"children":9609},{},[9610,9612,9619],{"type":26,"value":9611},"The term your client was looking for is ",{"type":21,"tag":29,"props":9613,"children":9616},{"href":9614,"rel":9615},"https://developers.google.com/web/progressive-web-apps/",[93],[9617],{"type":26,"value":9618},"Progressive Web App",{"type":26,"value":9620}," - an application that acts like a responsive web app when accessed from the browser on any device, but can be installed to mobile devices like a native application. The link above makes the case for PWAs, so we won't belabour the point - if you're still here, it's because you're convinced it's time to build a PWA.",{"type":21,"tag":22,"props":9622,"children":9623},{},[9624],{"type":26,"value":9625},"Instead, let's dig into the details. We're going to assume you have, or are building, a responsive or mobile-focused web application, and want to convert it to a PWA. Keep in mind that, like wrapping a webapp in a webview, all the heavy lifting is still done by you, the developer, in CSS, HTML and JS - there's no PWA magic to make it look 'native'.",{"type":21,"tag":22,"props":9627,"children":9628},{},[9629,9631,9636],{"type":26,"value":9630},"Well, actually, there is a ",{"type":21,"tag":1084,"props":9632,"children":9633},{},[9634],{"type":26,"value":9635},"little",{"type":26,"value":9637}," magic. We'll get to that next time.",{"type":21,"tag":22,"props":9639,"children":9640},{},[9641],{"type":26,"value":9642},"Part 1 will focus on implementing a PWA the standards-compliant way. In Part 2, we'll address the 'little bit of magic' PWA's can have on Android to appear more native, and PWA's on iOS Safari, because it always has to be a special snowflake.",{"type":21,"tag":22,"props":9644,"children":9645},{},[9646],{"type":26,"value":9647},"Let's begin.",{"type":21,"tag":3549,"props":9649,"children":9651},{"id":9650},"service-please",[9652],{"type":26,"value":9653},"Service, Please",{"type":21,"tag":22,"props":9655,"children":9656},{},[9657,9659,9666],{"type":26,"value":9658},"Familiar with ",{"type":21,"tag":29,"props":9660,"children":9663},{"href":9661,"rel":9662},"https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API",[93],[9664],{"type":26,"value":9665},"Service Workers",{"type":26,"value":9667},"? If not, get ready to do some reading on them - Service Workers are the clockwork that make PWAs tick.",{"type":21,"tag":22,"props":9669,"children":9670},{},[9671],{"type":26,"value":9672},"Mozilla's summary of Service Workers make it clear how this is so - and also, how complex a Service Worker can be:",{"type":21,"tag":4462,"props":9674,"children":9675},{},[9676],{"type":21,"tag":22,"props":9677,"children":9678},{},[9679],{"type":26,"value":9680},"Service workers essentially act as proxy servers that sit between web applications, and the browser and network (when available). They are intended to (amongst other things) enable the creation of effective offline experiences, intercepting network requests and taking appropriate action based on whether the network is available and updated assets reside on the server. They will also allow access to push notifications and background sync APIs.",{"type":21,"tag":22,"props":9682,"children":9683},{},[9684,9686,9691],{"type":26,"value":9685},"If you're familiar with ",{"type":21,"tag":29,"props":9687,"children":9689},{"href":4512,"rel":9688},[93],[9690],{"type":26,"value":4516},{"type":26,"value":9692},", you're about half-way there - Service Workers run on their own 'thread' (actual implementation details are up to the browser, of course), and have no access to the DOM, like a Web Worker. They have significantly more power than a web worker, however, particularly in terms of interacting with network requests; and, as a result, have more requirements to meet.",{"type":21,"tag":22,"props":9694,"children":9695},{},[9696],{"type":26,"value":9697},"Let's run down the checklist, and then we'll get into some implementation details. For a PWA's Service Worker you will need:",{"type":21,"tag":3677,"props":9699,"children":9700},{},[9701,9713,9732],{"type":21,"tag":3681,"props":9702,"children":9703},{},[9704,9706,9711],{"type":26,"value":9705},"A secure context - Service Workers must be run from a TLS-secured domain (https), because they can be Men-in-the-middle on every request from the browser for a given domain. The ",{"type":21,"tag":1084,"props":9707,"children":9708},{},[9709],{"type":26,"value":9710},"localhost",{"type":26,"value":9712}," special-case domain is the only exception to this rule, for the sake of development.",{"type":21,"tag":3681,"props":9714,"children":9715},{},[9716,9718,9723,9725,9730],{"type":26,"value":9717},"A full list of the items you need to cache (for the caching and serving from cache functionality of a Service Worker, which is a requirement to have your application considered a PWA). Wildcards can't be used - you need to give the full (relative) path of the resource you want cached. If you're familiar with the ",{"type":21,"tag":29,"props":9719,"children":9721},{"href":8732,"rel":9720},[93],[9722],{"type":26,"value":8736},{"type":26,"value":9724}," this restriction will be familiar to you. For your application to be considered a PWA, at ",{"type":21,"tag":1084,"props":9726,"children":9727},{},[9728],{"type":26,"value":9729},"least",{"type":26,"value":9731}," the start url must completely load when the user is offline.",{"type":21,"tag":3681,"props":9733,"children":9734},{},[9735,9737,9743,9745,9750,9752,9757],{"type":26,"value":9736},"A means of serving the Service Worker from the root of the path that you want the Service Worker to have control over - so, if you want the Service Worker to be able to control and serve resources for your entire application, and your application is at ",{"type":21,"tag":29,"props":9738,"children":9741},{"href":9739,"rel":9740},"https://app.example.com/",[93],[9742],{"type":26,"value":9739},{"type":26,"value":9744},", you will need to be able to serve the Service Worker from ",{"type":21,"tag":1084,"props":9746,"children":9747},{},[9748],{"type":26,"value":9749},"/",{"type":26,"value":9751}," (as opposed to, e.g. ",{"type":21,"tag":1084,"props":9753,"children":9754},{},[9755],{"type":26,"value":9756},"/static/js/workers/",{"type":26,"value":9758}," - if you serve from there, the only resources the Service Worker will be able to control will be those under that path).",{"type":21,"tag":22,"props":9760,"children":9761},{},[9762],{"type":26,"value":9763},"Additional checklist items for a PWA include:",{"type":21,"tag":3677,"props":9765,"children":9766},{},[9767,9772,9784],{"type":21,"tag":3681,"props":9768,"children":9769},{},[9770],{"type":26,"value":9771},"A responsive (or mobile-focused) design.",{"type":21,"tag":3681,"props":9773,"children":9774},{},[9775,9777,9782],{"type":26,"value":9776},"Quick initial load - Google, the company behind the original PWA spec (you may have heard of them), ",{"type":21,"tag":5270,"props":9778,"children":9779},{},[9780],{"type":26,"value":9781},"strongly",{"type":26,"value":9783}," suggests that your start url load under 10 seconds on a simulated 3G network - so no loading a half-dozen affiliate advertisements.",{"type":21,"tag":3681,"props":9785,"children":9786},{},[9787,9789,9796],{"type":26,"value":9788},"You will want to consider making your application a ",{"type":21,"tag":29,"props":9790,"children":9793},{"href":9791,"rel":9792},"https://en.wikipedia.org/wiki/Single-page_application",[93],[9794],{"type":26,"value":9795},"SPA",{"type":26,"value":9797}," - it's generally a good fit for this use case, especially if it allows you to cache more up-front, or trim down the number of bits your application needs to transfer over the network.",{"type":21,"tag":3549,"props":9799,"children":9801},{"id":9800},"looking-for-a-hard-worker-room-and-board-provided",[9802],{"type":26,"value":9803},"Looking for a Hard Worker, Room and Board Provided",{"type":21,"tag":22,"props":9805,"children":9806},{},[9807],{"type":26,"value":9808},"First things first, let's set up our web server to serve that Service Worker (lot of variations on 'serve' in that sentence) from the root of our domain, so we can control all resources and requests therein. We're going to assume you're using Python and Django in the example below, but the principle will always be the same.",{"type":21,"tag":22,"props":9810,"children":9811},{},[9812,9814,9820,9822,9828,9830,9836],{"type":26,"value":9813},"First, we'll create a service worker named ",{"type":21,"tag":63,"props":9815,"children":9817},{"className":9816},[],[9818],{"type":26,"value":9819},"CacheWorker.js",{"type":26,"value":9821}," in our ",{"type":21,"tag":63,"props":9823,"children":9825},{"className":9824},[],[9826],{"type":26,"value":9827},"static",{"type":26,"value":9829}," directory, under a ",{"type":21,"tag":63,"props":9831,"children":9833},{"className":9832},[],[9834],{"type":26,"value":9835},"serviceWorkers",{"type":26,"value":9837}," directory. Then, we can create the view to serve this worker (and any others we might want to serve with potential control over all requests):",{"type":21,"tag":200,"props":9839,"children":9843},{"className":9840,"code":9841,"language":9842,"meta":8,"style":8},"language-python shiki shiki-themes github-light github-dark","from django.conf import settings\n\ndef serve_worker(request, worker_name):\n    \"\"\"\n    Serve the requested service worker from the appropriate location in the static files.\n    We need to serve the worker this way in order to allow it access to requests made against the\n    root - whatever /sub/dir the worker ends up getting served from is the only location it will\n    have visibility on, so serving from / is the only way to ensure the worker has visibility on all\n    requests. Only a-zA-Z-_ characters can appear in the service worker name.\n\n    :param request:\n    :param worker_name:\n    :return:\n    \"\"\"\n    worker_path = path.join(settings.STATIC_ROOT, 'serviceWorkers', \"{}.js\".format(worker_name))\n    try:\n        with open(worker_path, 'r') as worker_file:\n            return HttpResponse(worker_file, content_type='application/javascript')\n    except IOError:\n        return HttpResponseNotFound()\n","python",[9844],{"type":21,"tag":63,"props":9845,"children":9846},{"__ignoreMap":8},[9847,9868,9875,9893,9901,9909,9917,9925,9933,9941,9948,9956,9964,9972,9979,10034,10046,10082,10113,10130],{"type":21,"tag":209,"props":9848,"children":9849},{"class":211,"line":212},[9850,9854,9859,9863],{"type":21,"tag":209,"props":9851,"children":9852},{"style":216},[9853],{"type":26,"value":230},{"type":21,"tag":209,"props":9855,"children":9856},{"style":222},[9857],{"type":26,"value":9858}," django.conf ",{"type":21,"tag":209,"props":9860,"children":9861},{"style":216},[9862],{"type":26,"value":219},{"type":21,"tag":209,"props":9864,"children":9865},{"style":222},[9866],{"type":26,"value":9867}," settings\n",{"type":21,"tag":209,"props":9869,"children":9870},{"class":211,"line":244},[9871],{"type":21,"tag":209,"props":9872,"children":9873},{"emptyLinePlaceholder":248},[9874],{"type":26,"value":251},{"type":21,"tag":209,"props":9876,"children":9877},{"class":211,"line":254},[9878,9883,9888],{"type":21,"tag":209,"props":9879,"children":9880},{"style":216},[9881],{"type":26,"value":9882},"def",{"type":21,"tag":209,"props":9884,"children":9885},{"style":360},[9886],{"type":26,"value":9887}," serve_worker",{"type":21,"tag":209,"props":9889,"children":9890},{"style":222},[9891],{"type":26,"value":9892},"(request, worker_name):\n",{"type":21,"tag":209,"props":9894,"children":9895},{"class":211,"line":279},[9896],{"type":21,"tag":209,"props":9897,"children":9898},{"style":233},[9899],{"type":26,"value":9900},"    \"\"\"\n",{"type":21,"tag":209,"props":9902,"children":9903},{"class":211,"line":288},[9904],{"type":21,"tag":209,"props":9905,"children":9906},{"style":233},[9907],{"type":26,"value":9908},"    Serve the requested service worker from the appropriate location in the static files.\n",{"type":21,"tag":209,"props":9910,"children":9911},{"class":211,"line":307},[9912],{"type":21,"tag":209,"props":9913,"children":9914},{"style":233},[9915],{"type":26,"value":9916},"    We need to serve the worker this way in order to allow it access to requests made against the\n",{"type":21,"tag":209,"props":9918,"children":9919},{"class":211,"line":325},[9920],{"type":21,"tag":209,"props":9921,"children":9922},{"style":233},[9923],{"type":26,"value":9924},"    root - whatever /sub/dir the worker ends up getting served from is the only location it will\n",{"type":21,"tag":209,"props":9926,"children":9927},{"class":211,"line":334},[9928],{"type":21,"tag":209,"props":9929,"children":9930},{"style":233},[9931],{"type":26,"value":9932},"    have visibility on, so serving from / is the only way to ensure the worker has visibility on all\n",{"type":21,"tag":209,"props":9934,"children":9935},{"class":211,"line":343},[9936],{"type":21,"tag":209,"props":9937,"children":9938},{"style":233},[9939],{"type":26,"value":9940},"    requests. Only a-zA-Z-_ characters can appear in the service worker name.\n",{"type":21,"tag":209,"props":9942,"children":9943},{"class":211,"line":351},[9944],{"type":21,"tag":209,"props":9945,"children":9946},{"emptyLinePlaceholder":248},[9947],{"type":26,"value":251},{"type":21,"tag":209,"props":9949,"children":9950},{"class":211,"line":444},[9951],{"type":21,"tag":209,"props":9952,"children":9953},{"style":233},[9954],{"type":26,"value":9955},"    :param request:\n",{"type":21,"tag":209,"props":9957,"children":9958},{"class":211,"line":454},[9959],{"type":21,"tag":209,"props":9960,"children":9961},{"style":233},[9962],{"type":26,"value":9963},"    :param worker_name:\n",{"type":21,"tag":209,"props":9965,"children":9966},{"class":211,"line":463},[9967],{"type":21,"tag":209,"props":9968,"children":9969},{"style":233},[9970],{"type":26,"value":9971},"    :return:\n",{"type":21,"tag":209,"props":9973,"children":9974},{"class":211,"line":472},[9975],{"type":21,"tag":209,"props":9976,"children":9977},{"style":233},[9978],{"type":26,"value":9900},{"type":21,"tag":209,"props":9980,"children":9981},{"class":211,"line":480},[9982,9987,9991,9996,10001,10005,10010,10014,10019,10024,10029],{"type":21,"tag":209,"props":9983,"children":9984},{"style":222},[9985],{"type":26,"value":9986},"    worker_path ",{"type":21,"tag":209,"props":9988,"children":9989},{"style":216},[9990],{"type":26,"value":1432},{"type":21,"tag":209,"props":9992,"children":9993},{"style":222},[9994],{"type":26,"value":9995}," path.join(settings.",{"type":21,"tag":209,"props":9997,"children":9998},{"style":263},[9999],{"type":26,"value":10000},"STATIC_ROOT",{"type":21,"tag":209,"props":10002,"children":10003},{"style":222},[10004],{"type":26,"value":408},{"type":21,"tag":209,"props":10006,"children":10007},{"style":233},[10008],{"type":26,"value":10009},"'serviceWorkers'",{"type":21,"tag":209,"props":10011,"children":10012},{"style":222},[10013],{"type":26,"value":408},{"type":21,"tag":209,"props":10015,"children":10016},{"style":233},[10017],{"type":26,"value":10018},"\"",{"type":21,"tag":209,"props":10020,"children":10021},{"style":263},[10022],{"type":26,"value":10023},"{}",{"type":21,"tag":209,"props":10025,"children":10026},{"style":233},[10027],{"type":26,"value":10028},".js\"",{"type":21,"tag":209,"props":10030,"children":10031},{"style":222},[10032],{"type":26,"value":10033},".format(worker_name))\n",{"type":21,"tag":209,"props":10035,"children":10036},{"class":211,"line":489},[10037,10042],{"type":21,"tag":209,"props":10038,"children":10039},{"style":216},[10040],{"type":26,"value":10041},"    try",{"type":21,"tag":209,"props":10043,"children":10044},{"style":222},[10045],{"type":26,"value":844},{"type":21,"tag":209,"props":10047,"children":10048},{"class":211,"line":847},[10049,10054,10059,10064,10069,10073,10077],{"type":21,"tag":209,"props":10050,"children":10051},{"style":216},[10052],{"type":26,"value":10053},"        with",{"type":21,"tag":209,"props":10055,"children":10056},{"style":263},[10057],{"type":26,"value":10058}," open",{"type":21,"tag":209,"props":10060,"children":10061},{"style":222},[10062],{"type":26,"value":10063},"(worker_path, ",{"type":21,"tag":209,"props":10065,"children":10066},{"style":233},[10067],{"type":26,"value":10068},"'r'",{"type":21,"tag":209,"props":10070,"children":10071},{"style":222},[10072],{"type":26,"value":432},{"type":21,"tag":209,"props":10074,"children":10075},{"style":216},[10076],{"type":26,"value":1781},{"type":21,"tag":209,"props":10078,"children":10079},{"style":222},[10080],{"type":26,"value":10081}," worker_file:\n",{"type":21,"tag":209,"props":10083,"children":10084},{"class":211,"line":860},[10085,10089,10094,10099,10103,10108],{"type":21,"tag":209,"props":10086,"children":10087},{"style":216},[10088],{"type":26,"value":5101},{"type":21,"tag":209,"props":10090,"children":10091},{"style":222},[10092],{"type":26,"value":10093}," HttpResponse(worker_file, ",{"type":21,"tag":209,"props":10095,"children":10096},{"style":400},[10097],{"type":26,"value":10098},"content_type",{"type":21,"tag":209,"props":10100,"children":10101},{"style":216},[10102],{"type":26,"value":1432},{"type":21,"tag":209,"props":10104,"children":10105},{"style":233},[10106],{"type":26,"value":10107},"'application/javascript'",{"type":21,"tag":209,"props":10109,"children":10110},{"style":222},[10111],{"type":26,"value":10112},")\n",{"type":21,"tag":209,"props":10114,"children":10115},{"class":211,"line":877},[10116,10121,10126],{"type":21,"tag":209,"props":10117,"children":10118},{"style":216},[10119],{"type":26,"value":10120},"    except",{"type":21,"tag":209,"props":10122,"children":10123},{"style":263},[10124],{"type":26,"value":10125}," IOError",{"type":21,"tag":209,"props":10127,"children":10128},{"style":222},[10129],{"type":26,"value":844},{"type":21,"tag":209,"props":10131,"children":10132},{"class":211,"line":889},[10133,10137],{"type":21,"tag":209,"props":10134,"children":10135},{"style":216},[10136],{"type":26,"value":3069},{"type":21,"tag":209,"props":10138,"children":10139},{"style":222},[10140],{"type":26,"value":10141}," HttpResponseNotFound()\n",{"type":21,"tag":22,"props":10143,"children":10144},{},[10145],{"type":26,"value":10146},"Next, in urls.py, we'll add the route to this view:",{"type":21,"tag":200,"props":10148,"children":10150},{"className":9840,"code":10149,"language":9842,"meta":8,"style":8},"urlpatterns = [\n    # ...other patterns...\n    url(r'^worker-(?P\u003Cworker_name>[a-zA-Z\\-_]+).js$', views.serve_worker, name='serve_worker'),\n    # ...other patterns...\n]\n",[10151],{"type":21,"tag":63,"props":10152,"children":10153},{"__ignoreMap":8},[10154,10171,10179,10278,10285],{"type":21,"tag":209,"props":10155,"children":10156},{"class":211,"line":212},[10157,10162,10166],{"type":21,"tag":209,"props":10158,"children":10159},{"style":222},[10160],{"type":26,"value":10161},"urlpatterns ",{"type":21,"tag":209,"props":10163,"children":10164},{"style":216},[10165],{"type":26,"value":1432},{"type":21,"tag":209,"props":10167,"children":10168},{"style":222},[10169],{"type":26,"value":10170}," [\n",{"type":21,"tag":209,"props":10172,"children":10173},{"class":211,"line":244},[10174],{"type":21,"tag":209,"props":10175,"children":10176},{"style":448},[10177],{"type":26,"value":10178},"    # ...other patterns...\n",{"type":21,"tag":209,"props":10180,"children":10181},{"class":211,"line":254},[10182,10187,10192,10197,10202,10208,10212,10217,10222,10228,10233,10238,10242,10246,10251,10255,10260,10264,10268,10273],{"type":21,"tag":209,"props":10183,"children":10184},{"style":222},[10185],{"type":26,"value":10186},"    url(",{"type":21,"tag":209,"props":10188,"children":10189},{"style":216},[10190],{"type":26,"value":10191},"r",{"type":21,"tag":209,"props":10193,"children":10194},{"style":233},[10195],{"type":26,"value":10196},"'",{"type":21,"tag":209,"props":10198,"children":10199},{"style":263},[10200],{"type":26,"value":10201},"^",{"type":21,"tag":209,"props":10203,"children":10205},{"style":10204},"--shiki-default:#032F62;--shiki-dark:#DBEDFF",[10206],{"type":26,"value":10207},"worker-",{"type":21,"tag":209,"props":10209,"children":10210},{"style":263},[10211],{"type":26,"value":368},{"type":21,"tag":209,"props":10213,"children":10214},{"style":1988},[10215],{"type":26,"value":10216},"?P\u003Cworker_name>",{"type":21,"tag":209,"props":10218,"children":10219},{"style":263},[10220],{"type":26,"value":10221},"[a-zA-Z",{"type":21,"tag":209,"props":10223,"children":10225},{"style":10224},"--shiki-default:#22863A;--shiki-default-font-weight:bold;--shiki-dark:#85E89D;--shiki-dark-font-weight:bold",[10226],{"type":26,"value":10227},"\\-",{"type":21,"tag":209,"props":10229,"children":10230},{"style":263},[10231],{"type":26,"value":10232},"_]",{"type":21,"tag":209,"props":10234,"children":10235},{"style":216},[10236],{"type":26,"value":10237},"+",{"type":21,"tag":209,"props":10239,"children":10240},{"style":263},[10241],{"type":26,"value":2699},{"type":21,"tag":209,"props":10243,"children":10244},{"style":10204},[10245],{"type":26,"value":12},{"type":21,"tag":209,"props":10247,"children":10248},{"style":263},[10249],{"type":26,"value":10250},"$",{"type":21,"tag":209,"props":10252,"children":10253},{"style":233},[10254],{"type":26,"value":10196},{"type":21,"tag":209,"props":10256,"children":10257},{"style":222},[10258],{"type":26,"value":10259},", views.serve_worker, ",{"type":21,"tag":209,"props":10261,"children":10262},{"style":400},[10263],{"type":26,"value":7820},{"type":21,"tag":209,"props":10265,"children":10266},{"style":216},[10267],{"type":26,"value":1432},{"type":21,"tag":209,"props":10269,"children":10270},{"style":233},[10271],{"type":26,"value":10272},"'serve_worker'",{"type":21,"tag":209,"props":10274,"children":10275},{"style":222},[10276],{"type":26,"value":10277},"),\n",{"type":21,"tag":209,"props":10279,"children":10280},{"class":211,"line":279},[10281],{"type":21,"tag":209,"props":10282,"children":10283},{"style":448},[10284],{"type":26,"value":10178},{"type":21,"tag":209,"props":10286,"children":10287},{"class":211,"line":288},[10288],{"type":21,"tag":209,"props":10289,"children":10290},{"style":222},[10291],{"type":26,"value":10292},"]\n",{"type":21,"tag":22,"props":10294,"children":10295},{},[10296,10298,10304,10306,10312],{"type":26,"value":10297},"Now, assuming our domain was ",{"type":21,"tag":63,"props":10299,"children":10301},{"className":10300},[],[10302],{"type":26,"value":10303},"https://app.example.com",{"type":26,"value":10305},", a request to ",{"type":21,"tag":63,"props":10307,"children":10309},{"className":10308},[],[10310],{"type":26,"value":10311},"https://app.example.com/worker-cacheWorker.js",{"type":26,"value":10313}," will return our worker script.",{"type":21,"tag":3549,"props":10315,"children":10317},{"id":10316},"putting-your-workers-in-their-place",[10318],{"type":26,"value":10319},"Putting Your Workers in their Place",{"type":21,"tag":22,"props":10321,"children":10322},{},[10323],{"type":26,"value":10324},"Now that we're serving our worker script from the desired location, we need to tell the browser that it should be requesting said worker script, and installing it as a Service Worker.",{"type":21,"tag":22,"props":10326,"children":10327},{},[10328,10330,10337,10339,10343],{"type":26,"value":10329},"To this effect, we will want to use the ",{"type":21,"tag":29,"props":10331,"children":10334},{"href":10332,"rel":10333},"https://developer.mozilla.org/en-US/docs/Web/API/Navigator/serviceWorker",[93],[10335],{"type":26,"value":10336},"ServiceWorkerContainer",{"type":26,"value":10338}," API to register our service worker. Of course, since our PWA is a ",{"type":21,"tag":1084,"props":10340,"children":10341},{},[10342],{"type":26,"value":4004},{"type":26,"value":10344}," enhancement, we will check to ensure that the browser actually supports Service Workers before we try and install it - your application should have some fallback behaviour when it encounters a browser that doesn't.",{"type":21,"tag":200,"props":10346,"children":10348},{"className":202,"code":10347,"language":12,"meta":8,"style":8},"/**\n * Install service workers in those browsers which support them.\n */\n(function(window){\n    var serviceWorkers = {\n        \"IMMEDIATE\": [],\n        \"LOAD\": ['cacheWorker'],\n        \"DELAY\": []\n    };\n\n    /**\n     * Attempt to register the worker, and log either the success or failure to the console.\n     * @param {String} worker\n     */\n    function registerWorker(worker){\n        window.navigator.serviceWorker.register('/worker-'+worker+'.js').then(function(reg){\n            console.log('Registration successful for worker '+worker+', with scope: ' + reg.scope);\n        }, function(error){\n            console.log('Service Worker registration failed for worker: ', worker, error);\n        });\n    }\n\n    /**\n     * Handle messages sent to the main thread by Service Workers.\n     * @param event\n     */\n    function handleMessage(event){\n        console.log(\"TODO: Your app should do something with the event data sent by the worker.\", event.data.message, event.data.data);\n    }\n\n    // Check for ServiceWorker support.\n    if ('serviceWorker' in window.navigator){\n        // Listen for messages broadcasted by any service worker\n        window.navigator.serviceWorker.addEventListener('message', handleMessage);\n\n        /*\n        * For each service worker, consider their priority queue.\n        * Workers in the 'IMMEDIATE' queue are registered as soon as we can - this is useful if,\n        * for example, we need to immediately be able to intercept requests.\n        * Workers within queue 'LOAD' are registered after document load - this is the time to start caching\n        * resources, for example, without contending with the browser for bandwidth.\n        * Workers in queue 'DELAY' are registered after the application lets us know explicitly that now is a\n        * good time. How your application goes about doing this is up to you. This last category\n        * is good for workers that are going to be carrying out long-term activities, like\n        * long-polling a server.\n        */\n        serviceWorkers.IMMEDIATE.forEach(registerWorker);\n\n        window.addEventListener('load', function(){\n            serviceWorkers.LOAD.forEach(registerWorker);\n        });\n\n        window.addEventListener('yourCustomDelayEvent', function(){\n            serviceWorkers.DELAY.forEach(registerWorker);\n        });\n    }\n})(window);\n",[10349],{"type":21,"tag":63,"props":10350,"children":10351},{"__ignoreMap":8},[10352,10359,10367,10374,10398,10419,10432,10455,10468,10475,10482,10489,10497,10518,10525,10550,10618,10665,10690,10715,10722,10729,10736,10743,10751,10767,10774,10799,10824,10831,10838,10846,10873,10881,10906,10913,10921,10929,10937,10945,10953,10961,10969,10977,10985,10993,11001,11028,11035,11068,11093,11100,11107,11139,11163,11170,11177],{"type":21,"tag":209,"props":10353,"children":10354},{"class":211,"line":212},[10355],{"type":21,"tag":209,"props":10356,"children":10357},{"style":448},[10358],{"type":26,"value":731},{"type":21,"tag":209,"props":10360,"children":10361},{"class":211,"line":244},[10362],{"type":21,"tag":209,"props":10363,"children":10364},{"style":448},[10365],{"type":26,"value":10366}," * Install service workers in those browsers which support them.\n",{"type":21,"tag":209,"props":10368,"children":10369},{"class":211,"line":254},[10370],{"type":21,"tag":209,"props":10371,"children":10372},{"style":448},[10373],{"type":26,"value":755},{"type":21,"tag":209,"props":10375,"children":10376},{"class":211,"line":279},[10377,10381,10385,10389,10394],{"type":21,"tag":209,"props":10378,"children":10379},{"style":222},[10380],{"type":26,"value":368},{"type":21,"tag":209,"props":10382,"children":10383},{"style":216},[10384],{"type":26,"value":5370},{"type":21,"tag":209,"props":10386,"children":10387},{"style":222},[10388],{"type":26,"value":368},{"type":21,"tag":209,"props":10390,"children":10391},{"style":400},[10392],{"type":26,"value":10393},"window",{"type":21,"tag":209,"props":10395,"children":10396},{"style":222},[10397],{"type":26,"value":2369},{"type":21,"tag":209,"props":10399,"children":10400},{"class":211,"line":288},[10401,10406,10411,10415],{"type":21,"tag":209,"props":10402,"children":10403},{"style":216},[10404],{"type":26,"value":10405},"    var",{"type":21,"tag":209,"props":10407,"children":10408},{"style":222},[10409],{"type":26,"value":10410}," serviceWorkers ",{"type":21,"tag":209,"props":10412,"children":10413},{"style":216},[10414],{"type":26,"value":1432},{"type":21,"tag":209,"props":10416,"children":10417},{"style":222},[10418],{"type":26,"value":276},{"type":21,"tag":209,"props":10420,"children":10421},{"class":211,"line":307},[10422,10427],{"type":21,"tag":209,"props":10423,"children":10424},{"style":233},[10425],{"type":26,"value":10426},"        \"IMMEDIATE\"",{"type":21,"tag":209,"props":10428,"children":10429},{"style":222},[10430],{"type":26,"value":10431},": [],\n",{"type":21,"tag":209,"props":10433,"children":10434},{"class":211,"line":325},[10435,10440,10445,10450],{"type":21,"tag":209,"props":10436,"children":10437},{"style":233},[10438],{"type":26,"value":10439},"        \"LOAD\"",{"type":21,"tag":209,"props":10441,"children":10442},{"style":222},[10443],{"type":26,"value":10444},": [",{"type":21,"tag":209,"props":10446,"children":10447},{"style":233},[10448],{"type":26,"value":10449},"'cacheWorker'",{"type":21,"tag":209,"props":10451,"children":10452},{"style":222},[10453],{"type":26,"value":10454},"],\n",{"type":21,"tag":209,"props":10456,"children":10457},{"class":211,"line":334},[10458,10463],{"type":21,"tag":209,"props":10459,"children":10460},{"style":233},[10461],{"type":26,"value":10462},"        \"DELAY\"",{"type":21,"tag":209,"props":10464,"children":10465},{"style":222},[10466],{"type":26,"value":10467},": []\n",{"type":21,"tag":209,"props":10469,"children":10470},{"class":211,"line":343},[10471],{"type":21,"tag":209,"props":10472,"children":10473},{"style":222},[10474],{"type":26,"value":4850},{"type":21,"tag":209,"props":10476,"children":10477},{"class":211,"line":351},[10478],{"type":21,"tag":209,"props":10479,"children":10480},{"emptyLinePlaceholder":248},[10481],{"type":26,"value":251},{"type":21,"tag":209,"props":10483,"children":10484},{"class":211,"line":444},[10485],{"type":21,"tag":209,"props":10486,"children":10487},{"style":448},[10488],{"type":26,"value":4697},{"type":21,"tag":209,"props":10490,"children":10491},{"class":211,"line":454},[10492],{"type":21,"tag":209,"props":10493,"children":10494},{"style":448},[10495],{"type":26,"value":10496},"     * Attempt to register the worker, and log either the success or failure to the console.\n",{"type":21,"tag":209,"props":10498,"children":10499},{"class":211,"line":463},[10500,10504,10508,10513],{"type":21,"tag":209,"props":10501,"children":10502},{"style":448},[10503],{"type":26,"value":4713},{"type":21,"tag":209,"props":10505,"children":10506},{"style":216},[10507],{"type":26,"value":4718},{"type":21,"tag":209,"props":10509,"children":10510},{"style":360},[10511],{"type":26,"value":10512}," {String}",{"type":21,"tag":209,"props":10514,"children":10515},{"style":222},[10516],{"type":26,"value":10517}," worker\n",{"type":21,"tag":209,"props":10519,"children":10520},{"class":211,"line":472},[10521],{"type":21,"tag":209,"props":10522,"children":10523},{"style":448},[10524],{"type":26,"value":4753},{"type":21,"tag":209,"props":10526,"children":10527},{"class":211,"line":480},[10528,10532,10537,10541,10546],{"type":21,"tag":209,"props":10529,"children":10530},{"style":216},[10531],{"type":26,"value":2981},{"type":21,"tag":209,"props":10533,"children":10534},{"style":360},[10535],{"type":26,"value":10536}," registerWorker",{"type":21,"tag":209,"props":10538,"children":10539},{"style":222},[10540],{"type":26,"value":368},{"type":21,"tag":209,"props":10542,"children":10543},{"style":400},[10544],{"type":26,"value":10545},"worker",{"type":21,"tag":209,"props":10547,"children":10548},{"style":222},[10549],{"type":26,"value":2369},{"type":21,"tag":209,"props":10551,"children":10552},{"class":211,"line":489},[10553,10558,10563,10567,10572,10576,10580,10584,10589,10593,10597,10601,10605,10609,10614],{"type":21,"tag":209,"props":10554,"children":10555},{"style":222},[10556],{"type":26,"value":10557},"        window.navigator.serviceWorker.",{"type":21,"tag":209,"props":10559,"children":10560},{"style":360},[10561],{"type":26,"value":10562},"register",{"type":21,"tag":209,"props":10564,"children":10565},{"style":222},[10566],{"type":26,"value":368},{"type":21,"tag":209,"props":10568,"children":10569},{"style":233},[10570],{"type":26,"value":10571},"'/worker-'",{"type":21,"tag":209,"props":10573,"children":10574},{"style":216},[10575],{"type":26,"value":10237},{"type":21,"tag":209,"props":10577,"children":10578},{"style":222},[10579],{"type":26,"value":10545},{"type":21,"tag":209,"props":10581,"children":10582},{"style":216},[10583],{"type":26,"value":10237},{"type":21,"tag":209,"props":10585,"children":10586},{"style":233},[10587],{"type":26,"value":10588},"'.js'",{"type":21,"tag":209,"props":10590,"children":10591},{"style":222},[10592],{"type":26,"value":2699},{"type":21,"tag":209,"props":10594,"children":10595},{"style":360},[10596],{"type":26,"value":2704},{"type":21,"tag":209,"props":10598,"children":10599},{"style":222},[10600],{"type":26,"value":368},{"type":21,"tag":209,"props":10602,"children":10603},{"style":216},[10604],{"type":26,"value":5370},{"type":21,"tag":209,"props":10606,"children":10607},{"style":222},[10608],{"type":26,"value":368},{"type":21,"tag":209,"props":10610,"children":10611},{"style":400},[10612],{"type":26,"value":10613},"reg",{"type":21,"tag":209,"props":10615,"children":10616},{"style":222},[10617],{"type":26,"value":2369},{"type":21,"tag":209,"props":10619,"children":10620},{"class":211,"line":847},[10621,10625,10629,10633,10638,10642,10646,10650,10655,10660],{"type":21,"tag":209,"props":10622,"children":10623},{"style":222},[10624],{"type":26,"value":2495},{"type":21,"tag":209,"props":10626,"children":10627},{"style":360},[10628],{"type":26,"value":1059},{"type":21,"tag":209,"props":10630,"children":10631},{"style":222},[10632],{"type":26,"value":368},{"type":21,"tag":209,"props":10634,"children":10635},{"style":233},[10636],{"type":26,"value":10637},"'Registration successful for worker '",{"type":21,"tag":209,"props":10639,"children":10640},{"style":216},[10641],{"type":26,"value":10237},{"type":21,"tag":209,"props":10643,"children":10644},{"style":222},[10645],{"type":26,"value":10545},{"type":21,"tag":209,"props":10647,"children":10648},{"style":216},[10649],{"type":26,"value":10237},{"type":21,"tag":209,"props":10651,"children":10652},{"style":233},[10653],{"type":26,"value":10654},"', with scope: '",{"type":21,"tag":209,"props":10656,"children":10657},{"style":216},[10658],{"type":26,"value":10659}," +",{"type":21,"tag":209,"props":10661,"children":10662},{"style":222},[10663],{"type":26,"value":10664}," reg.scope);\n",{"type":21,"tag":209,"props":10666,"children":10667},{"class":211,"line":860},[10668,10673,10677,10681,10686],{"type":21,"tag":209,"props":10669,"children":10670},{"style":222},[10671],{"type":26,"value":10672},"        }, ",{"type":21,"tag":209,"props":10674,"children":10675},{"style":216},[10676],{"type":26,"value":5370},{"type":21,"tag":209,"props":10678,"children":10679},{"style":222},[10680],{"type":26,"value":368},{"type":21,"tag":209,"props":10682,"children":10683},{"style":400},[10684],{"type":26,"value":10685},"error",{"type":21,"tag":209,"props":10687,"children":10688},{"style":222},[10689],{"type":26,"value":2369},{"type":21,"tag":209,"props":10691,"children":10692},{"class":211,"line":877},[10693,10697,10701,10705,10710],{"type":21,"tag":209,"props":10694,"children":10695},{"style":222},[10696],{"type":26,"value":2495},{"type":21,"tag":209,"props":10698,"children":10699},{"style":360},[10700],{"type":26,"value":1059},{"type":21,"tag":209,"props":10702,"children":10703},{"style":222},[10704],{"type":26,"value":368},{"type":21,"tag":209,"props":10706,"children":10707},{"style":233},[10708],{"type":26,"value":10709},"'Service Worker registration failed for worker: '",{"type":21,"tag":209,"props":10711,"children":10712},{"style":222},[10713],{"type":26,"value":10714},", worker, error);\n",{"type":21,"tag":209,"props":10716,"children":10717},{"class":211,"line":889},[10718],{"type":21,"tag":209,"props":10719,"children":10720},{"style":222},[10721],{"type":26,"value":5114},{"type":21,"tag":209,"props":10723,"children":10724},{"class":211,"line":902},[10725],{"type":21,"tag":209,"props":10726,"children":10727},{"style":222},[10728],{"type":26,"value":331},{"type":21,"tag":209,"props":10730,"children":10731},{"class":211,"line":914},[10732],{"type":21,"tag":209,"props":10733,"children":10734},{"emptyLinePlaceholder":248},[10735],{"type":26,"value":251},{"type":21,"tag":209,"props":10737,"children":10738},{"class":211,"line":922},[10739],{"type":21,"tag":209,"props":10740,"children":10741},{"style":448},[10742],{"type":26,"value":4697},{"type":21,"tag":209,"props":10744,"children":10745},{"class":211,"line":2312},[10746],{"type":21,"tag":209,"props":10747,"children":10748},{"style":448},[10749],{"type":26,"value":10750},"     * Handle messages sent to the main thread by Service Workers.\n",{"type":21,"tag":209,"props":10752,"children":10753},{"class":211,"line":2321},[10754,10758,10762],{"type":21,"tag":209,"props":10755,"children":10756},{"style":448},[10757],{"type":26,"value":4713},{"type":21,"tag":209,"props":10759,"children":10760},{"style":216},[10761],{"type":26,"value":4718},{"type":21,"tag":209,"props":10763,"children":10764},{"style":222},[10765],{"type":26,"value":10766}," event\n",{"type":21,"tag":209,"props":10768,"children":10769},{"class":211,"line":2372},[10770],{"type":21,"tag":209,"props":10771,"children":10772},{"style":448},[10773],{"type":26,"value":4753},{"type":21,"tag":209,"props":10775,"children":10776},{"class":211,"line":2381},[10777,10781,10786,10790,10795],{"type":21,"tag":209,"props":10778,"children":10779},{"style":216},[10780],{"type":26,"value":2981},{"type":21,"tag":209,"props":10782,"children":10783},{"style":360},[10784],{"type":26,"value":10785}," handleMessage",{"type":21,"tag":209,"props":10787,"children":10788},{"style":222},[10789],{"type":26,"value":368},{"type":21,"tag":209,"props":10791,"children":10792},{"style":400},[10793],{"type":26,"value":10794},"event",{"type":21,"tag":209,"props":10796,"children":10797},{"style":222},[10798],{"type":26,"value":2369},{"type":21,"tag":209,"props":10800,"children":10801},{"class":211,"line":2389},[10802,10806,10810,10814,10819],{"type":21,"tag":209,"props":10803,"children":10804},{"style":222},[10805],{"type":26,"value":3374},{"type":21,"tag":209,"props":10807,"children":10808},{"style":360},[10809],{"type":26,"value":1059},{"type":21,"tag":209,"props":10811,"children":10812},{"style":222},[10813],{"type":26,"value":368},{"type":21,"tag":209,"props":10815,"children":10816},{"style":233},[10817],{"type":26,"value":10818},"\"TODO: Your app should do something with the event data sent by the worker.\"",{"type":21,"tag":209,"props":10820,"children":10821},{"style":222},[10822],{"type":26,"value":10823},", event.data.message, event.data.data);\n",{"type":21,"tag":209,"props":10825,"children":10826},{"class":211,"line":2397},[10827],{"type":21,"tag":209,"props":10828,"children":10829},{"style":222},[10830],{"type":26,"value":331},{"type":21,"tag":209,"props":10832,"children":10833},{"class":211,"line":2406},[10834],{"type":21,"tag":209,"props":10835,"children":10836},{"emptyLinePlaceholder":248},[10837],{"type":26,"value":251},{"type":21,"tag":209,"props":10839,"children":10840},{"class":211,"line":2415},[10841],{"type":21,"tag":209,"props":10842,"children":10843},{"style":448},[10844],{"type":26,"value":10845},"    // Check for ServiceWorker support.\n",{"type":21,"tag":209,"props":10847,"children":10848},{"class":211,"line":2424},[10849,10854,10858,10863,10868],{"type":21,"tag":209,"props":10850,"children":10851},{"style":216},[10852],{"type":26,"value":10853},"    if",{"type":21,"tag":209,"props":10855,"children":10856},{"style":222},[10857],{"type":26,"value":4776},{"type":21,"tag":209,"props":10859,"children":10860},{"style":233},[10861],{"type":26,"value":10862},"'serviceWorker'",{"type":21,"tag":209,"props":10864,"children":10865},{"style":216},[10866],{"type":26,"value":10867}," in",{"type":21,"tag":209,"props":10869,"children":10870},{"style":222},[10871],{"type":26,"value":10872}," window.navigator){\n",{"type":21,"tag":209,"props":10874,"children":10875},{"class":211,"line":2433},[10876],{"type":21,"tag":209,"props":10877,"children":10878},{"style":448},[10879],{"type":26,"value":10880},"        // Listen for messages broadcasted by any service worker\n",{"type":21,"tag":209,"props":10882,"children":10883},{"class":211,"line":2442},[10884,10888,10892,10896,10901],{"type":21,"tag":209,"props":10885,"children":10886},{"style":222},[10887],{"type":26,"value":10557},{"type":21,"tag":209,"props":10889,"children":10890},{"style":360},[10891],{"type":26,"value":6424},{"type":21,"tag":209,"props":10893,"children":10894},{"style":222},[10895],{"type":26,"value":368},{"type":21,"tag":209,"props":10897,"children":10898},{"style":233},[10899],{"type":26,"value":10900},"'message'",{"type":21,"tag":209,"props":10902,"children":10903},{"style":222},[10904],{"type":26,"value":10905},", handleMessage);\n",{"type":21,"tag":209,"props":10907,"children":10908},{"class":211,"line":2471},[10909],{"type":21,"tag":209,"props":10910,"children":10911},{"emptyLinePlaceholder":248},[10912],{"type":26,"value":251},{"type":21,"tag":209,"props":10914,"children":10915},{"class":211,"line":2480},[10916],{"type":21,"tag":209,"props":10917,"children":10918},{"style":448},[10919],{"type":26,"value":10920},"        /*\n",{"type":21,"tag":209,"props":10922,"children":10923},{"class":211,"line":2489},[10924],{"type":21,"tag":209,"props":10925,"children":10926},{"style":448},[10927],{"type":26,"value":10928},"        * For each service worker, consider their priority queue.\n",{"type":21,"tag":209,"props":10930,"children":10931},{"class":211,"line":2516},[10932],{"type":21,"tag":209,"props":10933,"children":10934},{"style":448},[10935],{"type":26,"value":10936},"        * Workers in the 'IMMEDIATE' queue are registered as soon as we can - this is useful if,\n",{"type":21,"tag":209,"props":10938,"children":10939},{"class":211,"line":2525},[10940],{"type":21,"tag":209,"props":10941,"children":10942},{"style":448},[10943],{"type":26,"value":10944},"        * for example, we need to immediately be able to intercept requests.\n",{"type":21,"tag":209,"props":10946,"children":10947},{"class":211,"line":2533},[10948],{"type":21,"tag":209,"props":10949,"children":10950},{"style":448},[10951],{"type":26,"value":10952},"        * Workers within queue 'LOAD' are registered after document load - this is the time to start caching\n",{"type":21,"tag":209,"props":10954,"children":10955},{"class":211,"line":2542},[10956],{"type":21,"tag":209,"props":10957,"children":10958},{"style":448},[10959],{"type":26,"value":10960},"        * resources, for example, without contending with the browser for bandwidth.\n",{"type":21,"tag":209,"props":10962,"children":10963},{"class":211,"line":2550},[10964],{"type":21,"tag":209,"props":10965,"children":10966},{"style":448},[10967],{"type":26,"value":10968},"        * Workers in queue 'DELAY' are registered after the application lets us know explicitly that now is a\n",{"type":21,"tag":209,"props":10970,"children":10971},{"class":211,"line":2564},[10972],{"type":21,"tag":209,"props":10973,"children":10974},{"style":448},[10975],{"type":26,"value":10976},"        * good time. How your application goes about doing this is up to you. This last category\n",{"type":21,"tag":209,"props":10978,"children":10979},{"class":211,"line":2611},[10980],{"type":21,"tag":209,"props":10981,"children":10982},{"style":448},[10983],{"type":26,"value":10984},"        * is good for workers that are going to be carrying out long-term activities, like\n",{"type":21,"tag":209,"props":10986,"children":10987},{"class":211,"line":2619},[10988],{"type":21,"tag":209,"props":10989,"children":10990},{"style":448},[10991],{"type":26,"value":10992},"        * long-polling a server.\n",{"type":21,"tag":209,"props":10994,"children":10995},{"class":211,"line":2627},[10996],{"type":21,"tag":209,"props":10997,"children":10998},{"style":448},[10999],{"type":26,"value":11000},"        */\n",{"type":21,"tag":209,"props":11002,"children":11003},{"class":211,"line":2636},[11004,11009,11014,11018,11023],{"type":21,"tag":209,"props":11005,"children":11006},{"style":222},[11007],{"type":26,"value":11008},"        serviceWorkers.",{"type":21,"tag":209,"props":11010,"children":11011},{"style":263},[11012],{"type":26,"value":11013},"IMMEDIATE",{"type":21,"tag":209,"props":11015,"children":11016},{"style":222},[11017],{"type":26,"value":378},{"type":21,"tag":209,"props":11019,"children":11020},{"style":360},[11021],{"type":26,"value":11022},"forEach",{"type":21,"tag":209,"props":11024,"children":11025},{"style":222},[11026],{"type":26,"value":11027},"(registerWorker);\n",{"type":21,"tag":209,"props":11029,"children":11030},{"class":211,"line":2644},[11031],{"type":21,"tag":209,"props":11032,"children":11033},{"emptyLinePlaceholder":248},[11034],{"type":26,"value":251},{"type":21,"tag":209,"props":11036,"children":11037},{"class":211,"line":2657},[11038,11043,11047,11051,11056,11060,11064],{"type":21,"tag":209,"props":11039,"children":11040},{"style":222},[11041],{"type":26,"value":11042},"        window.",{"type":21,"tag":209,"props":11044,"children":11045},{"style":360},[11046],{"type":26,"value":6424},{"type":21,"tag":209,"props":11048,"children":11049},{"style":222},[11050],{"type":26,"value":368},{"type":21,"tag":209,"props":11052,"children":11053},{"style":233},[11054],{"type":26,"value":11055},"'load'",{"type":21,"tag":209,"props":11057,"children":11058},{"style":222},[11059],{"type":26,"value":408},{"type":21,"tag":209,"props":11061,"children":11062},{"style":216},[11063],{"type":26,"value":5370},{"type":21,"tag":209,"props":11065,"children":11066},{"style":222},[11067],{"type":26,"value":2561},{"type":21,"tag":209,"props":11069,"children":11070},{"class":211,"line":2728},[11071,11076,11081,11085,11089],{"type":21,"tag":209,"props":11072,"children":11073},{"style":222},[11074],{"type":26,"value":11075},"            serviceWorkers.",{"type":21,"tag":209,"props":11077,"children":11078},{"style":263},[11079],{"type":26,"value":11080},"LOAD",{"type":21,"tag":209,"props":11082,"children":11083},{"style":222},[11084],{"type":26,"value":378},{"type":21,"tag":209,"props":11086,"children":11087},{"style":360},[11088],{"type":26,"value":11022},{"type":21,"tag":209,"props":11090,"children":11091},{"style":222},[11092],{"type":26,"value":11027},{"type":21,"tag":209,"props":11094,"children":11095},{"class":211,"line":2758},[11096],{"type":21,"tag":209,"props":11097,"children":11098},{"style":222},[11099],{"type":26,"value":5114},{"type":21,"tag":209,"props":11101,"children":11102},{"class":211,"line":2776},[11103],{"type":21,"tag":209,"props":11104,"children":11105},{"emptyLinePlaceholder":248},[11106],{"type":26,"value":251},{"type":21,"tag":209,"props":11108,"children":11109},{"class":211,"line":2785},[11110,11114,11118,11122,11127,11131,11135],{"type":21,"tag":209,"props":11111,"children":11112},{"style":222},[11113],{"type":26,"value":11042},{"type":21,"tag":209,"props":11115,"children":11116},{"style":360},[11117],{"type":26,"value":6424},{"type":21,"tag":209,"props":11119,"children":11120},{"style":222},[11121],{"type":26,"value":368},{"type":21,"tag":209,"props":11123,"children":11124},{"style":233},[11125],{"type":26,"value":11126},"'yourCustomDelayEvent'",{"type":21,"tag":209,"props":11128,"children":11129},{"style":222},[11130],{"type":26,"value":408},{"type":21,"tag":209,"props":11132,"children":11133},{"style":216},[11134],{"type":26,"value":5370},{"type":21,"tag":209,"props":11136,"children":11137},{"style":222},[11138],{"type":26,"value":2561},{"type":21,"tag":209,"props":11140,"children":11141},{"class":211,"line":2793},[11142,11146,11151,11155,11159],{"type":21,"tag":209,"props":11143,"children":11144},{"style":222},[11145],{"type":26,"value":11075},{"type":21,"tag":209,"props":11147,"children":11148},{"style":263},[11149],{"type":26,"value":11150},"DELAY",{"type":21,"tag":209,"props":11152,"children":11153},{"style":222},[11154],{"type":26,"value":378},{"type":21,"tag":209,"props":11156,"children":11157},{"style":360},[11158],{"type":26,"value":11022},{"type":21,"tag":209,"props":11160,"children":11161},{"style":222},[11162],{"type":26,"value":11027},{"type":21,"tag":209,"props":11164,"children":11165},{"class":211,"line":2801},[11166],{"type":21,"tag":209,"props":11167,"children":11168},{"style":222},[11169],{"type":26,"value":5114},{"type":21,"tag":209,"props":11171,"children":11172},{"class":211,"line":2809},[11173],{"type":21,"tag":209,"props":11174,"children":11175},{"style":222},[11176],{"type":26,"value":331},{"type":21,"tag":209,"props":11178,"children":11179},{"class":211,"line":6219},[11180],{"type":21,"tag":209,"props":11181,"children":11182},{"style":222},[11183],{"type":26,"value":11184},"})(window);\n",{"type":21,"tag":3549,"props":11186,"children":11188},{"id":11187},"cache-me-im-falling",[11189],{"type":26,"value":11190},"Cache Me, I'm Falling",{"type":21,"tag":22,"props":11192,"children":11193},{},[11194],{"type":26,"value":11195},"So, we have our server sending our cacheWorker file along properly, and we have the browser registering the service worker, and downloading and installing our script. That's great - except, our cacheWorker script is empty, so it doesn't do anything. Let's fix that.",{"type":21,"tag":200,"props":11197,"children":11199},{"className":202,"code":11198,"language":12,"meta":8,"style":8},"/**\n * Service worker intended for caching and serving files when the application is offline,\n * to meet the requirements for a PWA.\n * @author Christopher Keefer\n */\nvar cacheVersion = 1,\n    staticCache = 'static-cache-v'+cacheVersion,\n    cacheableResources = [\n        // Root - This MUST be in the cacheable resources for a PWA!\n        '/',\n        // Images\n        '/static/img/yourLogo.png',\n        //... any other static image resources your application will need ...\n        // CSS\n        '/static/css/yourapp.min.css',\n        // ... any other styling your app will need, order doesn't matter ....\n        // Fonts\n        '/static/css/fonts/roboto/roboto-regular.woff2',\n        // ... any other fonts ...\n        // JS\n        '/static/js/yourapp.min.js'\n        // ... any other JS - as with the other entries, the order you specify here doesn't matter,\n        // the files will be loaded in the order you indicate in your HTML document. ...\n    ];\n\n/**\n * On install of this worker, add all cacheableResources to the staticCache.\n * Note that workers will be (re-)installed when they have changed (byte-wise comparison)\n * from the last worker encountered with the registered url (see the installation of workers, above),\n * which can be as simple as changing the cacheVersion number to point to a new 'version' of the cache.\n * You will want to update that cacheVersion number each time you change any of the cached resources.\n * Doing so will cause the worker to re-request and re-cache the cacheableResources, which is how we\n * will refresh cached resources for the application.\n */\nself.addEventListener('install', function(event){\n    event.waitUntil(\n        caches.open(staticCache).then(function(cache){\n            return cache.addAll(cacheableResources);\n        }).then(function(){\n            // Take control of the client as soon as we're installed\n            // and the cache has been updated.\n            return self.skipWaiting();\n        })\n    );\n});\n\n/**\n * On activation of this service worker, delete old caches. Note that\n * we return a promise that resolves when all promises returned by\n * the delete calls within it resolve.\n * Once we've deleted the old cache, we need to let the clients know that\n * a new service worker (with a new cache) has taken over, and they'll\n * need to reload in order to get the newly cached resources, via\n * postMessage.\n * @param event\n */\nself.addEventListener('activate', function(event){\n    event.waitUntil(\n        caches.keys().then(function(cacheNames){\n            return Promise.all(\n                cacheNames.map(function(cacheName){\n                    if (cacheName !== staticCache){\n                        return caches.delete(cacheName);\n                    }\n                })\n            );\n        }).then(function(){\n            return self.clients.matchAll().then(function(clients){\n                return Promise.all(clients.map(function(client){\n                    return client.postMessage({message:'needs-reload'});\n                }));\n            });\n        })\n    );\n});\n\n/**\n * Intercept network requests so that we can serve the requested resource from the\n * cache, if we have it, or otherwise defer to the network.\n */\nself.addEventListener('fetch', function(event){\n    // Workaround for Chromium bug that makes ignoring the search\n    // parameter very slow when matching the request against the\n    // cached values: https://bugs.chromium.org/p/chromium/issues/detail?id=682677.\n    // Your application may not need this - or hey, it may even be fixed by the time\n    // you're reading this!\n    var hasSearch = (event.request.url.indexOf('?') !== -1);\n\n    event.respondWith(\n        caches.match(event.request, {\n            ignoreSearch: hasSearch\n        }).then(function(response){\n            return response || fetch(event.request);\n        })\n    );\n});\n",[11200],{"type":21,"tag":63,"props":11201,"children":11202},{"__ignoreMap":8},[11203,11210,11218,11226,11244,11251,11276,11302,11318,11326,11338,11346,11358,11366,11374,11386,11394,11402,11414,11422,11430,11438,11446,11454,11462,11469,11476,11484,11492,11500,11508,11516,11524,11532,11539,11580,11598,11641,11663,11687,11695,11703,11724,11732,11740,11747,11754,11761,11769,11777,11785,11793,11801,11809,11817,11832,11839,11879,11894,11936,11960,11994,12017,12040,12048,12056,12064,12087,12133,12182,12214,12222,12229,12236,12243,12250,12257,12264,12272,12280,12287,12327,12335,12343,12351,12359,12367,12423,12430,12446,12463,12471,12503,12528,12535,12542],{"type":21,"tag":209,"props":11204,"children":11205},{"class":211,"line":212},[11206],{"type":21,"tag":209,"props":11207,"children":11208},{"style":448},[11209],{"type":26,"value":731},{"type":21,"tag":209,"props":11211,"children":11212},{"class":211,"line":244},[11213],{"type":21,"tag":209,"props":11214,"children":11215},{"style":448},[11216],{"type":26,"value":11217}," * Service worker intended for caching and serving files when the application is offline,\n",{"type":21,"tag":209,"props":11219,"children":11220},{"class":211,"line":254},[11221],{"type":21,"tag":209,"props":11222,"children":11223},{"style":448},[11224],{"type":26,"value":11225}," * to meet the requirements for a PWA.\n",{"type":21,"tag":209,"props":11227,"children":11228},{"class":211,"line":279},[11229,11234,11239],{"type":21,"tag":209,"props":11230,"children":11231},{"style":448},[11232],{"type":26,"value":11233}," * ",{"type":21,"tag":209,"props":11235,"children":11236},{"style":216},[11237],{"type":26,"value":11238},"@author",{"type":21,"tag":209,"props":11240,"children":11241},{"style":360},[11242],{"type":26,"value":11243}," Christopher Keefer\n",{"type":21,"tag":209,"props":11245,"children":11246},{"class":211,"line":288},[11247],{"type":21,"tag":209,"props":11248,"children":11249},{"style":448},[11250],{"type":26,"value":755},{"type":21,"tag":209,"props":11252,"children":11253},{"class":211,"line":307},[11254,11258,11263,11267,11272],{"type":21,"tag":209,"props":11255,"children":11256},{"style":216},[11257],{"type":26,"value":8996},{"type":21,"tag":209,"props":11259,"children":11260},{"style":222},[11261],{"type":26,"value":11262}," cacheVersion ",{"type":21,"tag":209,"props":11264,"children":11265},{"style":216},[11266],{"type":26,"value":1432},{"type":21,"tag":209,"props":11268,"children":11269},{"style":263},[11270],{"type":26,"value":11271}," 1",{"type":21,"tag":209,"props":11273,"children":11274},{"style":222},[11275],{"type":26,"value":304},{"type":21,"tag":209,"props":11277,"children":11278},{"class":211,"line":325},[11279,11284,11288,11293,11297],{"type":21,"tag":209,"props":11280,"children":11281},{"style":222},[11282],{"type":26,"value":11283},"    staticCache ",{"type":21,"tag":209,"props":11285,"children":11286},{"style":216},[11287],{"type":26,"value":1432},{"type":21,"tag":209,"props":11289,"children":11290},{"style":233},[11291],{"type":26,"value":11292}," 'static-cache-v'",{"type":21,"tag":209,"props":11294,"children":11295},{"style":216},[11296],{"type":26,"value":10237},{"type":21,"tag":209,"props":11298,"children":11299},{"style":222},[11300],{"type":26,"value":11301},"cacheVersion,\n",{"type":21,"tag":209,"props":11303,"children":11304},{"class":211,"line":334},[11305,11310,11314],{"type":21,"tag":209,"props":11306,"children":11307},{"style":222},[11308],{"type":26,"value":11309},"    cacheableResources ",{"type":21,"tag":209,"props":11311,"children":11312},{"style":216},[11313],{"type":26,"value":1432},{"type":21,"tag":209,"props":11315,"children":11316},{"style":222},[11317],{"type":26,"value":10170},{"type":21,"tag":209,"props":11319,"children":11320},{"class":211,"line":343},[11321],{"type":21,"tag":209,"props":11322,"children":11323},{"style":448},[11324],{"type":26,"value":11325},"        // Root - This MUST be in the cacheable resources for a PWA!\n",{"type":21,"tag":209,"props":11327,"children":11328},{"class":211,"line":351},[11329,11334],{"type":21,"tag":209,"props":11330,"children":11331},{"style":233},[11332],{"type":26,"value":11333},"        '/'",{"type":21,"tag":209,"props":11335,"children":11336},{"style":222},[11337],{"type":26,"value":304},{"type":21,"tag":209,"props":11339,"children":11340},{"class":211,"line":444},[11341],{"type":21,"tag":209,"props":11342,"children":11343},{"style":448},[11344],{"type":26,"value":11345},"        // Images\n",{"type":21,"tag":209,"props":11347,"children":11348},{"class":211,"line":454},[11349,11354],{"type":21,"tag":209,"props":11350,"children":11351},{"style":233},[11352],{"type":26,"value":11353},"        '/static/img/yourLogo.png'",{"type":21,"tag":209,"props":11355,"children":11356},{"style":222},[11357],{"type":26,"value":304},{"type":21,"tag":209,"props":11359,"children":11360},{"class":211,"line":463},[11361],{"type":21,"tag":209,"props":11362,"children":11363},{"style":448},[11364],{"type":26,"value":11365},"        //... any other static image resources your application will need ...\n",{"type":21,"tag":209,"props":11367,"children":11368},{"class":211,"line":472},[11369],{"type":21,"tag":209,"props":11370,"children":11371},{"style":448},[11372],{"type":26,"value":11373},"        // CSS\n",{"type":21,"tag":209,"props":11375,"children":11376},{"class":211,"line":480},[11377,11382],{"type":21,"tag":209,"props":11378,"children":11379},{"style":233},[11380],{"type":26,"value":11381},"        '/static/css/yourapp.min.css'",{"type":21,"tag":209,"props":11383,"children":11384},{"style":222},[11385],{"type":26,"value":304},{"type":21,"tag":209,"props":11387,"children":11388},{"class":211,"line":489},[11389],{"type":21,"tag":209,"props":11390,"children":11391},{"style":448},[11392],{"type":26,"value":11393},"        // ... any other styling your app will need, order doesn't matter ....\n",{"type":21,"tag":209,"props":11395,"children":11396},{"class":211,"line":847},[11397],{"type":21,"tag":209,"props":11398,"children":11399},{"style":448},[11400],{"type":26,"value":11401},"        // Fonts\n",{"type":21,"tag":209,"props":11403,"children":11404},{"class":211,"line":860},[11405,11410],{"type":21,"tag":209,"props":11406,"children":11407},{"style":233},[11408],{"type":26,"value":11409},"        '/static/css/fonts/roboto/roboto-regular.woff2'",{"type":21,"tag":209,"props":11411,"children":11412},{"style":222},[11413],{"type":26,"value":304},{"type":21,"tag":209,"props":11415,"children":11416},{"class":211,"line":877},[11417],{"type":21,"tag":209,"props":11418,"children":11419},{"style":448},[11420],{"type":26,"value":11421},"        // ... any other fonts ...\n",{"type":21,"tag":209,"props":11423,"children":11424},{"class":211,"line":889},[11425],{"type":21,"tag":209,"props":11426,"children":11427},{"style":448},[11428],{"type":26,"value":11429},"        // JS\n",{"type":21,"tag":209,"props":11431,"children":11432},{"class":211,"line":902},[11433],{"type":21,"tag":209,"props":11434,"children":11435},{"style":233},[11436],{"type":26,"value":11437},"        '/static/js/yourapp.min.js'\n",{"type":21,"tag":209,"props":11439,"children":11440},{"class":211,"line":914},[11441],{"type":21,"tag":209,"props":11442,"children":11443},{"style":448},[11444],{"type":26,"value":11445},"        // ... any other JS - as with the other entries, the order you specify here doesn't matter,\n",{"type":21,"tag":209,"props":11447,"children":11448},{"class":211,"line":922},[11449],{"type":21,"tag":209,"props":11450,"children":11451},{"style":448},[11452],{"type":26,"value":11453},"        // the files will be loaded in the order you indicate in your HTML document. ...\n",{"type":21,"tag":209,"props":11455,"children":11456},{"class":211,"line":2312},[11457],{"type":21,"tag":209,"props":11458,"children":11459},{"style":222},[11460],{"type":26,"value":11461},"    ];\n",{"type":21,"tag":209,"props":11463,"children":11464},{"class":211,"line":2321},[11465],{"type":21,"tag":209,"props":11466,"children":11467},{"emptyLinePlaceholder":248},[11468],{"type":26,"value":251},{"type":21,"tag":209,"props":11470,"children":11471},{"class":211,"line":2372},[11472],{"type":21,"tag":209,"props":11473,"children":11474},{"style":448},[11475],{"type":26,"value":731},{"type":21,"tag":209,"props":11477,"children":11478},{"class":211,"line":2381},[11479],{"type":21,"tag":209,"props":11480,"children":11481},{"style":448},[11482],{"type":26,"value":11483}," * On install of this worker, add all cacheableResources to the staticCache.\n",{"type":21,"tag":209,"props":11485,"children":11486},{"class":211,"line":2389},[11487],{"type":21,"tag":209,"props":11488,"children":11489},{"style":448},[11490],{"type":26,"value":11491}," * Note that workers will be (re-)installed when they have changed (byte-wise comparison)\n",{"type":21,"tag":209,"props":11493,"children":11494},{"class":211,"line":2397},[11495],{"type":21,"tag":209,"props":11496,"children":11497},{"style":448},[11498],{"type":26,"value":11499}," * from the last worker encountered with the registered url (see the installation of workers, above),\n",{"type":21,"tag":209,"props":11501,"children":11502},{"class":211,"line":2406},[11503],{"type":21,"tag":209,"props":11504,"children":11505},{"style":448},[11506],{"type":26,"value":11507}," * which can be as simple as changing the cacheVersion number to point to a new 'version' of the cache.\n",{"type":21,"tag":209,"props":11509,"children":11510},{"class":211,"line":2415},[11511],{"type":21,"tag":209,"props":11512,"children":11513},{"style":448},[11514],{"type":26,"value":11515}," * You will want to update that cacheVersion number each time you change any of the cached resources.\n",{"type":21,"tag":209,"props":11517,"children":11518},{"class":211,"line":2424},[11519],{"type":21,"tag":209,"props":11520,"children":11521},{"style":448},[11522],{"type":26,"value":11523}," * Doing so will cause the worker to re-request and re-cache the cacheableResources, which is how we\n",{"type":21,"tag":209,"props":11525,"children":11526},{"class":211,"line":2433},[11527],{"type":21,"tag":209,"props":11528,"children":11529},{"style":448},[11530],{"type":26,"value":11531}," * will refresh cached resources for the application.\n",{"type":21,"tag":209,"props":11533,"children":11534},{"class":211,"line":2442},[11535],{"type":21,"tag":209,"props":11536,"children":11537},{"style":448},[11538],{"type":26,"value":755},{"type":21,"tag":209,"props":11540,"children":11541},{"class":211,"line":2471},[11542,11547,11551,11555,11560,11564,11568,11572,11576],{"type":21,"tag":209,"props":11543,"children":11544},{"style":222},[11545],{"type":26,"value":11546},"self.",{"type":21,"tag":209,"props":11548,"children":11549},{"style":360},[11550],{"type":26,"value":6424},{"type":21,"tag":209,"props":11552,"children":11553},{"style":222},[11554],{"type":26,"value":368},{"type":21,"tag":209,"props":11556,"children":11557},{"style":233},[11558],{"type":26,"value":11559},"'install'",{"type":21,"tag":209,"props":11561,"children":11562},{"style":222},[11563],{"type":26,"value":408},{"type":21,"tag":209,"props":11565,"children":11566},{"style":216},[11567],{"type":26,"value":5370},{"type":21,"tag":209,"props":11569,"children":11570},{"style":222},[11571],{"type":26,"value":368},{"type":21,"tag":209,"props":11573,"children":11574},{"style":400},[11575],{"type":26,"value":10794},{"type":21,"tag":209,"props":11577,"children":11578},{"style":222},[11579],{"type":26,"value":2369},{"type":21,"tag":209,"props":11581,"children":11582},{"class":211,"line":2480},[11583,11588,11593],{"type":21,"tag":209,"props":11584,"children":11585},{"style":222},[11586],{"type":26,"value":11587},"    event.",{"type":21,"tag":209,"props":11589,"children":11590},{"style":360},[11591],{"type":26,"value":11592},"waitUntil",{"type":21,"tag":209,"props":11594,"children":11595},{"style":222},[11596],{"type":26,"value":11597},"(\n",{"type":21,"tag":209,"props":11599,"children":11600},{"class":211,"line":2489},[11601,11606,11611,11616,11620,11624,11628,11632,11637],{"type":21,"tag":209,"props":11602,"children":11603},{"style":222},[11604],{"type":26,"value":11605},"        caches.",{"type":21,"tag":209,"props":11607,"children":11608},{"style":360},[11609],{"type":26,"value":11610},"open",{"type":21,"tag":209,"props":11612,"children":11613},{"style":222},[11614],{"type":26,"value":11615},"(staticCache).",{"type":21,"tag":209,"props":11617,"children":11618},{"style":360},[11619],{"type":26,"value":2704},{"type":21,"tag":209,"props":11621,"children":11622},{"style":222},[11623],{"type":26,"value":368},{"type":21,"tag":209,"props":11625,"children":11626},{"style":216},[11627],{"type":26,"value":5370},{"type":21,"tag":209,"props":11629,"children":11630},{"style":222},[11631],{"type":26,"value":368},{"type":21,"tag":209,"props":11633,"children":11634},{"style":400},[11635],{"type":26,"value":11636},"cache",{"type":21,"tag":209,"props":11638,"children":11639},{"style":222},[11640],{"type":26,"value":2369},{"type":21,"tag":209,"props":11642,"children":11643},{"class":211,"line":2516},[11644,11648,11653,11658],{"type":21,"tag":209,"props":11645,"children":11646},{"style":216},[11647],{"type":26,"value":5101},{"type":21,"tag":209,"props":11649,"children":11650},{"style":222},[11651],{"type":26,"value":11652}," cache.",{"type":21,"tag":209,"props":11654,"children":11655},{"style":360},[11656],{"type":26,"value":11657},"addAll",{"type":21,"tag":209,"props":11659,"children":11660},{"style":222},[11661],{"type":26,"value":11662},"(cacheableResources);\n",{"type":21,"tag":209,"props":11664,"children":11665},{"class":211,"line":2525},[11666,11671,11675,11679,11683],{"type":21,"tag":209,"props":11667,"children":11668},{"style":222},[11669],{"type":26,"value":11670},"        }).",{"type":21,"tag":209,"props":11672,"children":11673},{"style":360},[11674],{"type":26,"value":2704},{"type":21,"tag":209,"props":11676,"children":11677},{"style":222},[11678],{"type":26,"value":368},{"type":21,"tag":209,"props":11680,"children":11681},{"style":216},[11682],{"type":26,"value":5370},{"type":21,"tag":209,"props":11684,"children":11685},{"style":222},[11686],{"type":26,"value":2561},{"type":21,"tag":209,"props":11688,"children":11689},{"class":211,"line":2533},[11690],{"type":21,"tag":209,"props":11691,"children":11692},{"style":448},[11693],{"type":26,"value":11694},"            // Take control of the client as soon as we're installed\n",{"type":21,"tag":209,"props":11696,"children":11697},{"class":211,"line":2542},[11698],{"type":21,"tag":209,"props":11699,"children":11700},{"style":448},[11701],{"type":26,"value":11702},"            // and the cache has been updated.\n",{"type":21,"tag":209,"props":11704,"children":11705},{"class":211,"line":2550},[11706,11710,11715,11720],{"type":21,"tag":209,"props":11707,"children":11708},{"style":216},[11709],{"type":26,"value":5101},{"type":21,"tag":209,"props":11711,"children":11712},{"style":222},[11713],{"type":26,"value":11714}," self.",{"type":21,"tag":209,"props":11716,"children":11717},{"style":360},[11718],{"type":26,"value":11719},"skipWaiting",{"type":21,"tag":209,"props":11721,"children":11722},{"style":222},[11723],{"type":26,"value":4842},{"type":21,"tag":209,"props":11725,"children":11726},{"class":211,"line":2564},[11727],{"type":21,"tag":209,"props":11728,"children":11729},{"style":222},[11730],{"type":26,"value":11731},"        })\n",{"type":21,"tag":209,"props":11733,"children":11734},{"class":211,"line":2611},[11735],{"type":21,"tag":209,"props":11736,"children":11737},{"style":222},[11738],{"type":26,"value":11739},"    );\n",{"type":21,"tag":209,"props":11741,"children":11742},{"class":211,"line":2619},[11743],{"type":21,"tag":209,"props":11744,"children":11745},{"style":222},[11746],{"type":26,"value":469},{"type":21,"tag":209,"props":11748,"children":11749},{"class":211,"line":2627},[11750],{"type":21,"tag":209,"props":11751,"children":11752},{"emptyLinePlaceholder":248},[11753],{"type":26,"value":251},{"type":21,"tag":209,"props":11755,"children":11756},{"class":211,"line":2636},[11757],{"type":21,"tag":209,"props":11758,"children":11759},{"style":448},[11760],{"type":26,"value":731},{"type":21,"tag":209,"props":11762,"children":11763},{"class":211,"line":2644},[11764],{"type":21,"tag":209,"props":11765,"children":11766},{"style":448},[11767],{"type":26,"value":11768}," * On activation of this service worker, delete old caches. Note that\n",{"type":21,"tag":209,"props":11770,"children":11771},{"class":211,"line":2657},[11772],{"type":21,"tag":209,"props":11773,"children":11774},{"style":448},[11775],{"type":26,"value":11776}," * we return a promise that resolves when all promises returned by\n",{"type":21,"tag":209,"props":11778,"children":11779},{"class":211,"line":2728},[11780],{"type":21,"tag":209,"props":11781,"children":11782},{"style":448},[11783],{"type":26,"value":11784}," * the delete calls within it resolve.\n",{"type":21,"tag":209,"props":11786,"children":11787},{"class":211,"line":2758},[11788],{"type":21,"tag":209,"props":11789,"children":11790},{"style":448},[11791],{"type":26,"value":11792}," * Once we've deleted the old cache, we need to let the clients know that\n",{"type":21,"tag":209,"props":11794,"children":11795},{"class":211,"line":2776},[11796],{"type":21,"tag":209,"props":11797,"children":11798},{"style":448},[11799],{"type":26,"value":11800}," * a new service worker (with a new cache) has taken over, and they'll\n",{"type":21,"tag":209,"props":11802,"children":11803},{"class":211,"line":2785},[11804],{"type":21,"tag":209,"props":11805,"children":11806},{"style":448},[11807],{"type":26,"value":11808}," * need to reload in order to get the newly cached resources, via\n",{"type":21,"tag":209,"props":11810,"children":11811},{"class":211,"line":2793},[11812],{"type":21,"tag":209,"props":11813,"children":11814},{"style":448},[11815],{"type":26,"value":11816}," * postMessage.\n",{"type":21,"tag":209,"props":11818,"children":11819},{"class":211,"line":2801},[11820,11824,11828],{"type":21,"tag":209,"props":11821,"children":11822},{"style":448},[11823],{"type":26,"value":11233},{"type":21,"tag":209,"props":11825,"children":11826},{"style":216},[11827],{"type":26,"value":4718},{"type":21,"tag":209,"props":11829,"children":11830},{"style":222},[11831],{"type":26,"value":10766},{"type":21,"tag":209,"props":11833,"children":11834},{"class":211,"line":2809},[11835],{"type":21,"tag":209,"props":11836,"children":11837},{"style":448},[11838],{"type":26,"value":755},{"type":21,"tag":209,"props":11840,"children":11841},{"class":211,"line":6219},[11842,11846,11850,11854,11859,11863,11867,11871,11875],{"type":21,"tag":209,"props":11843,"children":11844},{"style":222},[11845],{"type":26,"value":11546},{"type":21,"tag":209,"props":11847,"children":11848},{"style":360},[11849],{"type":26,"value":6424},{"type":21,"tag":209,"props":11851,"children":11852},{"style":222},[11853],{"type":26,"value":368},{"type":21,"tag":209,"props":11855,"children":11856},{"style":233},[11857],{"type":26,"value":11858},"'activate'",{"type":21,"tag":209,"props":11860,"children":11861},{"style":222},[11862],{"type":26,"value":408},{"type":21,"tag":209,"props":11864,"children":11865},{"style":216},[11866],{"type":26,"value":5370},{"type":21,"tag":209,"props":11868,"children":11869},{"style":222},[11870],{"type":26,"value":368},{"type":21,"tag":209,"props":11872,"children":11873},{"style":400},[11874],{"type":26,"value":10794},{"type":21,"tag":209,"props":11876,"children":11877},{"style":222},[11878],{"type":26,"value":2369},{"type":21,"tag":209,"props":11880,"children":11881},{"class":211,"line":6228},[11882,11886,11890],{"type":21,"tag":209,"props":11883,"children":11884},{"style":222},[11885],{"type":26,"value":11587},{"type":21,"tag":209,"props":11887,"children":11888},{"style":360},[11889],{"type":26,"value":11592},{"type":21,"tag":209,"props":11891,"children":11892},{"style":222},[11893],{"type":26,"value":11597},{"type":21,"tag":209,"props":11895,"children":11896},{"class":211,"line":6250},[11897,11901,11906,11911,11915,11919,11923,11927,11932],{"type":21,"tag":209,"props":11898,"children":11899},{"style":222},[11900],{"type":26,"value":11605},{"type":21,"tag":209,"props":11902,"children":11903},{"style":360},[11904],{"type":26,"value":11905},"keys",{"type":21,"tag":209,"props":11907,"children":11908},{"style":222},[11909],{"type":26,"value":11910},"().",{"type":21,"tag":209,"props":11912,"children":11913},{"style":360},[11914],{"type":26,"value":2704},{"type":21,"tag":209,"props":11916,"children":11917},{"style":222},[11918],{"type":26,"value":368},{"type":21,"tag":209,"props":11920,"children":11921},{"style":216},[11922],{"type":26,"value":5370},{"type":21,"tag":209,"props":11924,"children":11925},{"style":222},[11926],{"type":26,"value":368},{"type":21,"tag":209,"props":11928,"children":11929},{"style":400},[11930],{"type":26,"value":11931},"cacheNames",{"type":21,"tag":209,"props":11933,"children":11934},{"style":222},[11935],{"type":26,"value":2369},{"type":21,"tag":209,"props":11937,"children":11938},{"class":211,"line":6258},[11939,11943,11947,11951,11956],{"type":21,"tag":209,"props":11940,"children":11941},{"style":216},[11942],{"type":26,"value":5101},{"type":21,"tag":209,"props":11944,"children":11945},{"style":263},[11946],{"type":26,"value":5581},{"type":21,"tag":209,"props":11948,"children":11949},{"style":222},[11950],{"type":26,"value":378},{"type":21,"tag":209,"props":11952,"children":11953},{"style":360},[11954],{"type":26,"value":11955},"all",{"type":21,"tag":209,"props":11957,"children":11958},{"style":222},[11959],{"type":26,"value":11597},{"type":21,"tag":209,"props":11961,"children":11962},{"class":211,"line":6267},[11963,11968,11973,11977,11981,11985,11990],{"type":21,"tag":209,"props":11964,"children":11965},{"style":222},[11966],{"type":26,"value":11967},"                cacheNames.",{"type":21,"tag":209,"props":11969,"children":11970},{"style":360},[11971],{"type":26,"value":11972},"map",{"type":21,"tag":209,"props":11974,"children":11975},{"style":222},[11976],{"type":26,"value":368},{"type":21,"tag":209,"props":11978,"children":11979},{"style":216},[11980],{"type":26,"value":5370},{"type":21,"tag":209,"props":11982,"children":11983},{"style":222},[11984],{"type":26,"value":368},{"type":21,"tag":209,"props":11986,"children":11987},{"style":400},[11988],{"type":26,"value":11989},"cacheName",{"type":21,"tag":209,"props":11991,"children":11992},{"style":222},[11993],{"type":26,"value":2369},{"type":21,"tag":209,"props":11995,"children":11996},{"class":211,"line":6303},[11997,12002,12007,12012],{"type":21,"tag":209,"props":11998,"children":11999},{"style":216},[12000],{"type":26,"value":12001},"                    if",{"type":21,"tag":209,"props":12003,"children":12004},{"style":222},[12005],{"type":26,"value":12006}," (cacheName ",{"type":21,"tag":209,"props":12008,"children":12009},{"style":216},[12010],{"type":26,"value":12011},"!==",{"type":21,"tag":209,"props":12013,"children":12014},{"style":222},[12015],{"type":26,"value":12016}," staticCache){\n",{"type":21,"tag":209,"props":12018,"children":12019},{"class":211,"line":6336},[12020,12025,12030,12035],{"type":21,"tag":209,"props":12021,"children":12022},{"style":216},[12023],{"type":26,"value":12024},"                        return",{"type":21,"tag":209,"props":12026,"children":12027},{"style":222},[12028],{"type":26,"value":12029}," caches.",{"type":21,"tag":209,"props":12031,"children":12032},{"style":360},[12033],{"type":26,"value":12034},"delete",{"type":21,"tag":209,"props":12036,"children":12037},{"style":222},[12038],{"type":26,"value":12039},"(cacheName);\n",{"type":21,"tag":209,"props":12041,"children":12042},{"class":211,"line":6369},[12043],{"type":21,"tag":209,"props":12044,"children":12045},{"style":222},[12046],{"type":26,"value":12047},"                    }\n",{"type":21,"tag":209,"props":12049,"children":12050},{"class":211,"line":6378},[12051],{"type":21,"tag":209,"props":12052,"children":12053},{"style":222},[12054],{"type":26,"value":12055},"                })\n",{"type":21,"tag":209,"props":12057,"children":12058},{"class":211,"line":6387},[12059],{"type":21,"tag":209,"props":12060,"children":12061},{"style":222},[12062],{"type":26,"value":12063},"            );\n",{"type":21,"tag":209,"props":12065,"children":12066},{"class":211,"line":6395},[12067,12071,12075,12079,12083],{"type":21,"tag":209,"props":12068,"children":12069},{"style":222},[12070],{"type":26,"value":11670},{"type":21,"tag":209,"props":12072,"children":12073},{"style":360},[12074],{"type":26,"value":2704},{"type":21,"tag":209,"props":12076,"children":12077},{"style":222},[12078],{"type":26,"value":368},{"type":21,"tag":209,"props":12080,"children":12081},{"style":216},[12082],{"type":26,"value":5370},{"type":21,"tag":209,"props":12084,"children":12085},{"style":222},[12086],{"type":26,"value":2561},{"type":21,"tag":209,"props":12088,"children":12089},{"class":211,"line":6404},[12090,12094,12099,12104,12108,12112,12116,12120,12124,12129],{"type":21,"tag":209,"props":12091,"children":12092},{"style":216},[12093],{"type":26,"value":5101},{"type":21,"tag":209,"props":12095,"children":12096},{"style":222},[12097],{"type":26,"value":12098}," self.clients.",{"type":21,"tag":209,"props":12100,"children":12101},{"style":360},[12102],{"type":26,"value":12103},"matchAll",{"type":21,"tag":209,"props":12105,"children":12106},{"style":222},[12107],{"type":26,"value":11910},{"type":21,"tag":209,"props":12109,"children":12110},{"style":360},[12111],{"type":26,"value":2704},{"type":21,"tag":209,"props":12113,"children":12114},{"style":222},[12115],{"type":26,"value":368},{"type":21,"tag":209,"props":12117,"children":12118},{"style":216},[12119],{"type":26,"value":5370},{"type":21,"tag":209,"props":12121,"children":12122},{"style":222},[12123],{"type":26,"value":368},{"type":21,"tag":209,"props":12125,"children":12126},{"style":400},[12127],{"type":26,"value":12128},"clients",{"type":21,"tag":209,"props":12130,"children":12131},{"style":222},[12132],{"type":26,"value":2369},{"type":21,"tag":209,"props":12134,"children":12135},{"class":211,"line":6413},[12136,12140,12144,12148,12152,12157,12161,12165,12169,12173,12178],{"type":21,"tag":209,"props":12137,"children":12138},{"style":216},[12139],{"type":26,"value":5653},{"type":21,"tag":209,"props":12141,"children":12142},{"style":263},[12143],{"type":26,"value":5581},{"type":21,"tag":209,"props":12145,"children":12146},{"style":222},[12147],{"type":26,"value":378},{"type":21,"tag":209,"props":12149,"children":12150},{"style":360},[12151],{"type":26,"value":11955},{"type":21,"tag":209,"props":12153,"children":12154},{"style":222},[12155],{"type":26,"value":12156},"(clients.",{"type":21,"tag":209,"props":12158,"children":12159},{"style":360},[12160],{"type":26,"value":11972},{"type":21,"tag":209,"props":12162,"children":12163},{"style":222},[12164],{"type":26,"value":368},{"type":21,"tag":209,"props":12166,"children":12167},{"style":216},[12168],{"type":26,"value":5370},{"type":21,"tag":209,"props":12170,"children":12171},{"style":222},[12172],{"type":26,"value":368},{"type":21,"tag":209,"props":12174,"children":12175},{"style":400},[12176],{"type":26,"value":12177},"client",{"type":21,"tag":209,"props":12179,"children":12180},{"style":222},[12181],{"type":26,"value":2369},{"type":21,"tag":209,"props":12183,"children":12184},{"class":211,"line":6447},[12185,12190,12195,12200,12205,12210],{"type":21,"tag":209,"props":12186,"children":12187},{"style":216},[12188],{"type":26,"value":12189},"                    return",{"type":21,"tag":209,"props":12191,"children":12192},{"style":222},[12193],{"type":26,"value":12194}," client.",{"type":21,"tag":209,"props":12196,"children":12197},{"style":360},[12198],{"type":26,"value":12199},"postMessage",{"type":21,"tag":209,"props":12201,"children":12202},{"style":222},[12203],{"type":26,"value":12204},"({message:",{"type":21,"tag":209,"props":12206,"children":12207},{"style":233},[12208],{"type":26,"value":12209},"'needs-reload'",{"type":21,"tag":209,"props":12211,"children":12212},{"style":222},[12213],{"type":26,"value":469},{"type":21,"tag":209,"props":12215,"children":12216},{"class":211,"line":6479},[12217],{"type":21,"tag":209,"props":12218,"children":12219},{"style":222},[12220],{"type":26,"value":12221},"                }));\n",{"type":21,"tag":209,"props":12223,"children":12224},{"class":211,"line":6511},[12225],{"type":21,"tag":209,"props":12226,"children":12227},{"style":222},[12228],{"type":26,"value":2782},{"type":21,"tag":209,"props":12230,"children":12231},{"class":211,"line":6519},[12232],{"type":21,"tag":209,"props":12233,"children":12234},{"style":222},[12235],{"type":26,"value":11731},{"type":21,"tag":209,"props":12237,"children":12238},{"class":211,"line":6527},[12239],{"type":21,"tag":209,"props":12240,"children":12241},{"style":222},[12242],{"type":26,"value":11739},{"type":21,"tag":209,"props":12244,"children":12245},{"class":211,"line":6535},[12246],{"type":21,"tag":209,"props":12247,"children":12248},{"style":222},[12249],{"type":26,"value":469},{"type":21,"tag":209,"props":12251,"children":12252},{"class":211,"line":6543},[12253],{"type":21,"tag":209,"props":12254,"children":12255},{"emptyLinePlaceholder":248},[12256],{"type":26,"value":251},{"type":21,"tag":209,"props":12258,"children":12259},{"class":211,"line":6552},[12260],{"type":21,"tag":209,"props":12261,"children":12262},{"style":448},[12263],{"type":26,"value":731},{"type":21,"tag":209,"props":12265,"children":12266},{"class":211,"line":6572},[12267],{"type":21,"tag":209,"props":12268,"children":12269},{"style":448},[12270],{"type":26,"value":12271}," * Intercept network requests so that we can serve the requested resource from the\n",{"type":21,"tag":209,"props":12273,"children":12274},{"class":211,"line":6589},[12275],{"type":21,"tag":209,"props":12276,"children":12277},{"style":448},[12278],{"type":26,"value":12279}," * cache, if we have it, or otherwise defer to the network.\n",{"type":21,"tag":209,"props":12281,"children":12282},{"class":211,"line":6597},[12283],{"type":21,"tag":209,"props":12284,"children":12285},{"style":448},[12286],{"type":26,"value":755},{"type":21,"tag":209,"props":12288,"children":12289},{"class":211,"line":6625},[12290,12294,12298,12302,12307,12311,12315,12319,12323],{"type":21,"tag":209,"props":12291,"children":12292},{"style":222},[12293],{"type":26,"value":11546},{"type":21,"tag":209,"props":12295,"children":12296},{"style":360},[12297],{"type":26,"value":6424},{"type":21,"tag":209,"props":12299,"children":12300},{"style":222},[12301],{"type":26,"value":368},{"type":21,"tag":209,"props":12303,"children":12304},{"style":233},[12305],{"type":26,"value":12306},"'fetch'",{"type":21,"tag":209,"props":12308,"children":12309},{"style":222},[12310],{"type":26,"value":408},{"type":21,"tag":209,"props":12312,"children":12313},{"style":216},[12314],{"type":26,"value":5370},{"type":21,"tag":209,"props":12316,"children":12317},{"style":222},[12318],{"type":26,"value":368},{"type":21,"tag":209,"props":12320,"children":12321},{"style":400},[12322],{"type":26,"value":10794},{"type":21,"tag":209,"props":12324,"children":12325},{"style":222},[12326],{"type":26,"value":2369},{"type":21,"tag":209,"props":12328,"children":12329},{"class":211,"line":6648},[12330],{"type":21,"tag":209,"props":12331,"children":12332},{"style":448},[12333],{"type":26,"value":12334},"    // Workaround for Chromium bug that makes ignoring the search\n",{"type":21,"tag":209,"props":12336,"children":12337},{"class":211,"line":6670},[12338],{"type":21,"tag":209,"props":12339,"children":12340},{"style":448},[12341],{"type":26,"value":12342},"    // parameter very slow when matching the request against the\n",{"type":21,"tag":209,"props":12344,"children":12345},{"class":211,"line":6678},[12346],{"type":21,"tag":209,"props":12347,"children":12348},{"style":448},[12349],{"type":26,"value":12350},"    // cached values: https://bugs.chromium.org/p/chromium/issues/detail?id=682677.\n",{"type":21,"tag":209,"props":12352,"children":12353},{"class":211,"line":6686},[12354],{"type":21,"tag":209,"props":12355,"children":12356},{"style":448},[12357],{"type":26,"value":12358},"    // Your application may not need this - or hey, it may even be fixed by the time\n",{"type":21,"tag":209,"props":12360,"children":12361},{"class":211,"line":6714},[12362],{"type":21,"tag":209,"props":12363,"children":12364},{"style":448},[12365],{"type":26,"value":12366},"    // you're reading this!\n",{"type":21,"tag":209,"props":12368,"children":12369},{"class":211,"line":6747},[12370,12374,12379,12383,12388,12393,12397,12402,12406,12410,12415,12419],{"type":21,"tag":209,"props":12371,"children":12372},{"style":216},[12373],{"type":26,"value":10405},{"type":21,"tag":209,"props":12375,"children":12376},{"style":222},[12377],{"type":26,"value":12378}," hasSearch ",{"type":21,"tag":209,"props":12380,"children":12381},{"style":216},[12382],{"type":26,"value":1432},{"type":21,"tag":209,"props":12384,"children":12385},{"style":222},[12386],{"type":26,"value":12387}," (event.request.url.",{"type":21,"tag":209,"props":12389,"children":12390},{"style":360},[12391],{"type":26,"value":12392},"indexOf",{"type":21,"tag":209,"props":12394,"children":12395},{"style":222},[12396],{"type":26,"value":368},{"type":21,"tag":209,"props":12398,"children":12399},{"style":233},[12400],{"type":26,"value":12401},"'?'",{"type":21,"tag":209,"props":12403,"children":12404},{"style":222},[12405],{"type":26,"value":432},{"type":21,"tag":209,"props":12407,"children":12408},{"style":216},[12409],{"type":26,"value":12011},{"type":21,"tag":209,"props":12411,"children":12412},{"style":216},[12413],{"type":26,"value":12414}," -",{"type":21,"tag":209,"props":12416,"children":12417},{"style":263},[12418],{"type":26,"value":3224},{"type":21,"tag":209,"props":12420,"children":12421},{"style":222},[12422],{"type":26,"value":2608},{"type":21,"tag":209,"props":12424,"children":12425},{"class":211,"line":6761},[12426],{"type":21,"tag":209,"props":12427,"children":12428},{"emptyLinePlaceholder":248},[12429],{"type":26,"value":251},{"type":21,"tag":209,"props":12431,"children":12432},{"class":211,"line":6769},[12433,12437,12442],{"type":21,"tag":209,"props":12434,"children":12435},{"style":222},[12436],{"type":26,"value":11587},{"type":21,"tag":209,"props":12438,"children":12439},{"style":360},[12440],{"type":26,"value":12441},"respondWith",{"type":21,"tag":209,"props":12443,"children":12444},{"style":222},[12445],{"type":26,"value":11597},{"type":21,"tag":209,"props":12447,"children":12448},{"class":211,"line":6782},[12449,12453,12458],{"type":21,"tag":209,"props":12450,"children":12451},{"style":222},[12452],{"type":26,"value":11605},{"type":21,"tag":209,"props":12454,"children":12455},{"style":360},[12456],{"type":26,"value":12457},"match",{"type":21,"tag":209,"props":12459,"children":12460},{"style":222},[12461],{"type":26,"value":12462},"(event.request, {\n",{"type":21,"tag":209,"props":12464,"children":12465},{"class":211,"line":6812},[12466],{"type":21,"tag":209,"props":12467,"children":12468},{"style":222},[12469],{"type":26,"value":12470},"            ignoreSearch: hasSearch\n",{"type":21,"tag":209,"props":12472,"children":12473},{"class":211,"line":6831},[12474,12478,12482,12486,12490,12494,12499],{"type":21,"tag":209,"props":12475,"children":12476},{"style":222},[12477],{"type":26,"value":11670},{"type":21,"tag":209,"props":12479,"children":12480},{"style":360},[12481],{"type":26,"value":2704},{"type":21,"tag":209,"props":12483,"children":12484},{"style":222},[12485],{"type":26,"value":368},{"type":21,"tag":209,"props":12487,"children":12488},{"style":216},[12489],{"type":26,"value":5370},{"type":21,"tag":209,"props":12491,"children":12492},{"style":222},[12493],{"type":26,"value":368},{"type":21,"tag":209,"props":12495,"children":12496},{"style":400},[12497],{"type":26,"value":12498},"response",{"type":21,"tag":209,"props":12500,"children":12501},{"style":222},[12502],{"type":26,"value":2369},{"type":21,"tag":209,"props":12504,"children":12505},{"class":211,"line":6840},[12506,12510,12515,12519,12523],{"type":21,"tag":209,"props":12507,"children":12508},{"style":216},[12509],{"type":26,"value":5101},{"type":21,"tag":209,"props":12511,"children":12512},{"style":222},[12513],{"type":26,"value":12514}," response ",{"type":21,"tag":209,"props":12516,"children":12517},{"style":216},[12518],{"type":26,"value":4677},{"type":21,"tag":209,"props":12520,"children":12521},{"style":360},[12522],{"type":26,"value":4811},{"type":21,"tag":209,"props":12524,"children":12525},{"style":222},[12526],{"type":26,"value":12527},"(event.request);\n",{"type":21,"tag":209,"props":12529,"children":12530},{"class":211,"line":6864},[12531],{"type":21,"tag":209,"props":12532,"children":12533},{"style":222},[12534],{"type":26,"value":11731},{"type":21,"tag":209,"props":12536,"children":12537},{"class":211,"line":6872},[12538],{"type":21,"tag":209,"props":12539,"children":12540},{"style":222},[12541],{"type":26,"value":11739},{"type":21,"tag":209,"props":12543,"children":12544},{"class":211,"line":6880},[12545],{"type":21,"tag":209,"props":12546,"children":12547},{"style":222},[12548],{"type":26,"value":469},{"type":21,"tag":22,"props":12550,"children":12551},{},[12552],{"type":26,"value":12553},"So, that's a lot to take in, but the comments above should help. Let's break down a few of the more complex bits:",{"type":21,"tag":51,"props":12555,"children":12557},{"id":12556},"install",[12558],{"type":26,"value":12559},"Install",{"type":21,"tag":22,"props":12561,"children":12562},{},[12563],{"type":26,"value":12564},"So, you'll notice that we have add an event listener for 'install'. This is the event that gets fired when a new version of the Service Worker is installed - whether for the first time, or because the Service Worker has changed in some way. The browser does a byte-wise comparison of the downloaded script, so any change will trigger a re-install of the script.",{"type":21,"tag":22,"props":12566,"children":12567},{},[12568,12570,12576],{"type":26,"value":12569},"Often, you won't need to change anything in the script itself, but some of the cached resources have changed, and we need to tell the browser that we want to refresh the cache. In order to do this, we'll change the ",{"type":21,"tag":63,"props":12571,"children":12573},{"className":12572},[],[12574],{"type":26,"value":12575},"cacheVersion",{"type":26,"value":12577}," number, which will trigger the browser to re-install the Service Worker, triggering our install event, and allowing us to re-downloand and cache all of the updated resources.",{"type":21,"tag":51,"props":12579,"children":12581},{"id":12580},"activate",[12582],{"type":26,"value":12583},"Activate",{"type":21,"tag":22,"props":12585,"children":12586},{},[12587,12589,12595],{"type":26,"value":12588},"After that, we have a listener on the 'activate' event. This gets triggered when our service worker takes control of the context - once it becomes 'active'. You'll notice in our 'install' event that we're calling ",{"type":21,"tag":63,"props":12590,"children":12592},{"className":12591},[],[12593],{"type":26,"value":12594},"self.skipWaiting();",{"type":26,"value":12596},". The normal behaviour is that when a new Service Worker is installed, it doesn't take over from the old Service Worker until the page is refreshed. This could be fine for your case, but in many cases, we'll want to start serving the new resources right away, so we tell the browser to skip waiting for this Service Worker, and activate it immediately, allowing it to take over from the old Service Worker (if any).",{"type":21,"tag":22,"props":12598,"children":12599},{},[12600,12602,12609],{"type":26,"value":12601},"In the activate event listener, we then clear out all of our old cache versions, leaving just the specified cache available. You'll want to take a look at the ",{"type":21,"tag":29,"props":12603,"children":12606},{"href":12604,"rel":12605},"https://developer.mozilla.org/en-US/docs/Web/API/Cache",[93],[12607],{"type":26,"value":12608},"Cache Interface",{"type":26,"value":12610}," for more details here.",{"type":21,"tag":22,"props":12612,"children":12613},{},[12614,12616,12622,12624,12630],{"type":26,"value":12615},"Finally, once we've cleared out the old caches, we post a message back to main thread of any clients we have control over that they should reload, since the cache has been updated (remember the ",{"type":21,"tag":63,"props":12617,"children":12619},{"className":12618},[],[12620],{"type":26,"value":12621},"handleMessage",{"type":26,"value":12623}," function in the install workers script?). What you want to do with this message will depend on your application, but it could be as simple as calling ",{"type":21,"tag":63,"props":12625,"children":12627},{"className":12626},[],[12628],{"type":26,"value":12629},"location.reload()",{"type":26,"value":12631}," to get the new resources from the Service Worker.",{"type":21,"tag":51,"props":12633,"children":12635},{"id":12634},"fetch",[12636],{"type":26,"value":12637},"Fetch",{"type":21,"tag":22,"props":12639,"children":12640},{},[12641,12643,12649],{"type":26,"value":12642},"And here's where the actual offline-enabling functionality happens. You'll want to take a look at the ",{"type":21,"tag":29,"props":12644,"children":12647},{"href":12645,"rel":12646},"https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch",[93],[12648],{"type":26,"value":5199},{"type":26,"value":12650}," for more details on fetch, but the point here is that we're intercepting all requests from the client (that's the browser main thread for our origin), and checking the requested resource name against our cache. If we have the resource, we return it from our cache, and otherwise we pass the request through to the network.",{"type":21,"tag":22,"props":12652,"children":12653},{},[12654],{"type":26,"value":12655},"Two things are worth noting here:",{"type":21,"tag":3739,"props":12657,"children":12658},{},[12659,12670],{"type":21,"tag":3681,"props":12660,"children":12661},{},[12662,12664,12668],{"type":26,"value":12663},"Our fetch intercept catches ",{"type":21,"tag":1084,"props":12665,"children":12666},{},[12667],{"type":26,"value":11955},{"type":26,"value":12669}," requests - not just XMLHTTPRequests, for example, but every single request the main thread makes of the network. There's a lot that can be done with this - we're just scratching the surface here.",{"type":21,"tag":3681,"props":12671,"children":12672},{},[12673,12675,12682],{"type":26,"value":12674},"The 'serve from cache if available, and otherwise pass to the network' is just one potential model for how we can handle caching and serving resources with the Service Worker - see ",{"type":21,"tag":29,"props":12676,"children":12679},{"href":12677,"rel":12678},"https://developers.google.com/web/ilt/pwa/lab-caching-files-with-service-worker",[93],[12680],{"type":26,"value":12681},"this article on Caching File with Service Worker",{"type":26,"value":12683}," for some alternative approaches.",{"type":21,"tag":3549,"props":12685,"children":12686},{"id":8764},[12687],{"type":26,"value":12688},"Are We There Yet?",{"type":21,"tag":22,"props":12690,"children":12691},{},[12692,12694,12701],{"type":26,"value":12693},"Pretty much! Assuming you can mark the other items off the checklists above, your application should now be ready to serve itself as a PWA. To confirm this, you can use the ",{"type":21,"tag":29,"props":12695,"children":12698},{"href":12696,"rel":12697},"https://developers.google.com/web/tools/lighthouse/",[93],[12699],{"type":26,"value":12700},"Lighthouse Extension",{"type":26,"value":12702}," from Google to test your site, and confirm that all is as it should be.",{"type":21,"tag":22,"props":12704,"children":12705},{},[12706],{"type":26,"value":12707},"While this gives you a PWA suitable for, say, desktop use, there's still a few pieces to the puzzle before we're ready to be assigned real estate on the home screens of Android or iOS devices - we'll be going into that next time.",{"type":21,"tag":3490,"props":12709,"children":12710},{},[12711],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":12713},[12714,12715,12716,12717,12722],{"id":9650,"depth":244,"text":9653},{"id":9800,"depth":244,"text":9803},{"id":10316,"depth":244,"text":10319},{"id":11187,"depth":244,"text":11190,"children":12718},[12719,12720,12721],{"id":12556,"depth":254,"text":12559},{"id":12580,"depth":254,"text":12583},{"id":12634,"depth":254,"text":12637},{"id":8764,"depth":244,"text":12688},"content:ckeefer:2017-2:MorePWAToYa-Part1.md","ckeefer/2017-2/MorePWAToYa-Part1.md","ckeefer/2017-2/MorePWAToYa-Part1",{"user":3518,"name":3519},{"_path":12728,"_dir":12729,"_draft":7,"_partial":7,"_locale":8,"title":12730,"description":12731,"publishDate":12732,"tags":12733,"excerpt":12731,"body":12736,"_type":3511,"_id":13793,"_source":3513,"_file":13794,"_stem":13795,"_extension":3516,"author":13796},"/ckeefer/2016-8/herokupdf","2016-8","Generating PDFs: wkhtmltopdf & Heroku","So, it has come to this.","2016-12-21",[12734,12735,9842],"heroku","pdf",{"type":18,"children":12737,"toc":13787},[12738,12742,12753,12758,12763,12794,12814,12819,12824,12836,12865,12885,12890,12919,12925,12938,12952,12971,12994,13051,13056,13090,13095,13241,13246,13252,13264,13751,13757,13783],{"type":21,"tag":22,"props":12739,"children":12740},{},[12741],{"type":26,"value":12731},{"type":21,"tag":22,"props":12743,"children":12744},{},[12745,12747,12752],{"type":26,"value":12746},"Reports, yes, your application will have to have reports - in brand colours, with images and logos abounding, and probably festooned with graphs of various sizes, shapes and degrees of relevance to what was once a nice, streamlined set of data. This report has just become a part of the application 'product', meant not just to communicate, but also to entice and enthrall. Form has become just as important as function... and, did I forget to mention? It also needs to be ",{"type":21,"tag":1084,"props":12748,"children":12749},{},[12750],{"type":26,"value":12751},"exportable",{"type":26,"value":378},{"type":21,"tag":22,"props":12754,"children":12755},{},[12756],{"type":26,"value":12757},"Exportable, portable, downloadable, shareable - because as I mentioned, it's not just data now. It is now something clients/users need to be able to 'have', to attach to emails, send to their marketing departments, and incorporate into their powerpoints.",{"type":21,"tag":22,"props":12759,"children":12760},{},[12761],{"type":26,"value":12762},"There's a few ways to make this happen, but generally speaking, it's time to break out the PDFs.",{"type":21,"tag":22,"props":12764,"children":12765},{},[12766,12768,12775,12777,12784,12785,12792],{"type":26,"value":12767},"The Portable Document Format (PDF) has been a staple of web applications for some time, now - it's well-suited to the sharing of information in a self-contained package, and it's increasingly well-supported as ",{"type":21,"tag":29,"props":12769,"children":12772},{"href":12770,"rel":12771},"https://support.mozilla.org/en-US/kb/view-pdf-files-firefox",[93],[12773],{"type":26,"value":12774},"many",{"type":26,"value":12776}," ",{"type":21,"tag":29,"props":12778,"children":12781},{"href":12779,"rel":12780},"https://pdfium.googlesource.com/pdfium/",[93],[12782],{"type":26,"value":12783},"modern",{"type":26,"value":12776},{"type":21,"tag":29,"props":12786,"children":12789},{"href":12787,"rel":12788},"http://blog.trendmicro.com/trendlabs-security-intelligence/windows-10s-new-browser-microsoft-edge-improved-but-also-new-risks/",[93],[12790],{"type":26,"value":12791},"browsers",{"type":26,"value":12793}," bake support for the display of PDFs directly into the browser.",{"type":21,"tag":22,"props":12795,"children":12796},{},[12797,12799,12805,12807,12812],{"type":26,"value":12798},"There are a number of ways to produce a PDF. We could use one of the various libraries for our language of choice - say, ",{"type":21,"tag":29,"props":12800,"children":12802},{"href":12801},"assets/pdf_reference_1-7.pdf",[12803],{"type":26,"value":12804},"published specification",{"type":26,"value":12806},", so if we really had a lot of free-time on our hands and/or a masochistic streak, we could even do the necessary bit-twiddling ourselves. If we needed to just output some simple text or static images, these might be the way to go (except for the bit-twiddling. Most projects will not benefit from you suddenly deciding you need to devote the next ",{"type":21,"tag":1084,"props":12808,"children":12809},{},[12810],{"type":26,"value":12811},"n",{"type":26,"value":12813}," months to creating a new PDF library from scratch, no matter how fun that might sound).",{"type":21,"tag":22,"props":12815,"children":12816},{},[12817],{"type":26,"value":12818},"In the scenario I posit above, however, we're transitioning from an HTML page which displayed the data, to a full, glossy report - but it still needs to show up in the browser first, and support PDF as an export option. We could have two completely separate code-bases to support the web page display, and to build the PDF, but wouldn't it be nice if we could just render our web page to a PDF?",{"type":21,"tag":51,"props":12820,"children":12822},{"id":12821},"wkhtmltopdf",[12823],{"type":26,"value":12821},{"type":21,"tag":22,"props":12825,"children":12826},{},[12827,12829,12834],{"type":26,"value":12828},"If that line of thinking seems familiar, you've probably also heard of ",{"type":21,"tag":29,"props":12830,"children":12832},{"href":12831},"wkhtmltopdf.org",[12833],{"type":26,"value":12821},{"type":26,"value":12835},". wkhtmltopdf is an open source command line tool (and C library) that relies on the WebKit rendering engine, which underlies Safari and, until the still fairly recent fork to Blink, powered the Chrome browser as well. The rendering engine uses the same HTML and CSS (and, optionally, JavaScript, with some limitations) that would be used to render your web page, and sends the output on to be converted into images and eventually, incorporating a number of specifiable configuration details, into a PDF.",{"type":21,"tag":22,"props":12837,"children":12838},{},[12839,12841,12847,12848,12854,12856,12863],{"type":26,"value":12840},"Assuming this sounds just like what the doctor ordered, installing wkhtmltopdf on most linux distros is just an ",{"type":21,"tag":63,"props":12842,"children":12844},{"className":12843},[],[12845],{"type":26,"value":12846},"apt-get",{"type":26,"value":408},{"type":21,"tag":63,"props":12849,"children":12851},{"className":12850},[],[12852],{"type":26,"value":12853},"yum install",{"type":26,"value":12855},", etc. away; or you can download a ",{"type":21,"tag":29,"props":12857,"children":12860},{"href":12858,"rel":12859},"http://wkhtmltopdf.org/downloads.html",[93],[12861],{"type":26,"value":12862},"pre-compiled binary",{"type":26,"value":12864}," if building from source is giving you trouble (and it might, particularly when attempting to build it on a server without any GUI libraries in place).",{"type":21,"tag":22,"props":12866,"children":12867},{},[12868,12870,12874,12876,12883],{"type":26,"value":12869},"Now that we have the binary available, we ",{"type":21,"tag":1084,"props":12871,"children":12872},{},[12873],{"type":26,"value":9149},{"type":26,"value":12875}," just call out to the command-line from our language of choice; we can make our lives a little easier by using a wrapper libary, however. I first used ",{"type":21,"tag":29,"props":12877,"children":12880},{"href":12878,"rel":12879},"https://pypi.python.org/pypi/pdfkit",[93],[12881],{"type":26,"value":12882},"pdfkit",{"type":26,"value":12884}," years ago with Ruby and it has been my go-to since for both Ruby and Python, but there are any number to choose from if pdfkit doesn't strike your fancy.",{"type":21,"tag":22,"props":12886,"children":12887},{},[12888],{"type":26,"value":12889},"For the purpose of this article, however, we're going to assume you're taking my suggestions, so let's add pdfkit to our requirements.txt file (update the version as needed):",{"type":21,"tag":200,"props":12891,"children":12893},{"className":9840,"code":12892,"language":9842,"meta":8,"style":8},"pdfkit==0.6.0\n",[12894],{"type":21,"tag":63,"props":12895,"children":12896},{"__ignoreMap":8},[12897],{"type":21,"tag":209,"props":12898,"children":12899},{"class":211,"line":212},[12900,12904,12909,12914],{"type":21,"tag":209,"props":12901,"children":12902},{"style":222},[12903],{"type":26,"value":12882},{"type":21,"tag":209,"props":12905,"children":12906},{"style":216},[12907],{"type":26,"value":12908},"==",{"type":21,"tag":209,"props":12910,"children":12911},{"style":263},[12912],{"type":26,"value":12913},"0.6",{"type":21,"tag":209,"props":12915,"children":12916},{"style":222},[12917],{"type":26,"value":12918},".0\n",{"type":21,"tag":51,"props":12920,"children":12922},{"id":12921},"heroku-wkhtmlopdf-pack-and-which-wkhtmltopdf",[12923],{"type":26,"value":12924},"Heroku, wkhtmlopdf-pack, and which wkhtmltopdf",{"type":21,"tag":22,"props":12926,"children":12927},{},[12928,12930,12936],{"type":26,"value":12929},"So, this gets you set for working in your local 'nix dev box, but what about when it comes time to put this on a staging server or go live? If you're using a similar environment to your development system, the setup will be much the same - but let's add another piece to this puzzle, and posit that we're going to need to run on the still very popular ",{"type":21,"tag":29,"props":12931,"children":12933},{"href":12932},"heroku.com",[12934],{"type":26,"value":12935},"Heroku",{"type":26,"value":12937}," platform.",{"type":21,"tag":22,"props":12939,"children":12940},{},[12941,12943,12950],{"type":26,"value":12942},"In that case, we can't rely on the standard wkhtmltopdf binaries, as they aren't compatible. Instead, we need to 'vendor in' a pre-compiled binary for their platform - that's the purpose of the various Heroku ",{"type":21,"tag":29,"props":12944,"children":12947},{"href":12945,"rel":12946},"https://devcenter.heroku.com/articles/buildpacks",[93],[12948],{"type":26,"value":12949},"buildpacks",{"type":26,"value":12951}," that you may be familiar with if you've used Heroku before.",{"type":21,"tag":22,"props":12953,"children":12954},{},[12955,12956,12960,12962,12969],{"type":26,"value":27},{"type":21,"tag":1084,"props":12957,"children":12958},{},[12959],{"type":26,"value":9149},{"type":26,"value":12961}," compile the necessary binary for ourselves in a ",{"type":21,"tag":29,"props":12963,"children":12966},{"href":12964,"rel":12965},"https://devcenter.heroku.com/articles/buildpack-api#binaries",[93],[12967],{"type":26,"value":12968},"heroku dyno via Heroku run",{"type":26,"value":12970},", but it would be nicer not to spend the time/money if we don't have to; and luckily, we're not the first to think so.",{"type":21,"tag":22,"props":12972,"children":12973},{},[12974,12976,12983,12985,12992],{"type":26,"value":12975},"Enter ",{"type":21,"tag":29,"props":12977,"children":12980},{"href":12978,"rel":12979},"https://pypi.python.org/pypi/wkhtmltopdf-pack/0.12.3.0",[93],[12981],{"type":26,"value":12982},"wkhtmltopdf-pack",{"type":26,"value":12984},". Based on a ",{"type":21,"tag":29,"props":12986,"children":12989},{"href":12987,"rel":12988},"https://github.com/rposborne/wkhtmltopdf-heroku",[93],[12990],{"type":26,"value":12991},"similar project for Ruby",{"type":26,"value":12993},", this python package simply installs a pre-compiled wkhtmltopdf binary that's compatible with Heroku's Cedar-14 platform, quick and easy, so let's add that to our requirements.txt file as well.",{"type":21,"tag":200,"props":12995,"children":12997},{"className":9840,"code":12996,"language":9842,"meta":8,"style":8},"wkhtmltopdf-pack==0.12.3.0\npdfkit==0.6.0\n",[12998],{"type":21,"tag":63,"props":12999,"children":13000},{"__ignoreMap":8},[13001,13032],{"type":21,"tag":209,"props":13002,"children":13003},{"class":211,"line":212},[13004,13008,13013,13018,13022,13027],{"type":21,"tag":209,"props":13005,"children":13006},{"style":222},[13007],{"type":26,"value":12821},{"type":21,"tag":209,"props":13009,"children":13010},{"style":216},[13011],{"type":26,"value":13012},"-",{"type":21,"tag":209,"props":13014,"children":13015},{"style":222},[13016],{"type":26,"value":13017},"pack",{"type":21,"tag":209,"props":13019,"children":13020},{"style":216},[13021],{"type":26,"value":12908},{"type":21,"tag":209,"props":13023,"children":13024},{"style":263},[13025],{"type":26,"value":13026},"0.12",{"type":21,"tag":209,"props":13028,"children":13029},{"style":222},[13030],{"type":26,"value":13031},".3.0\n",{"type":21,"tag":209,"props":13033,"children":13034},{"class":211,"line":244},[13035,13039,13043,13047],{"type":21,"tag":209,"props":13036,"children":13037},{"style":222},[13038],{"type":26,"value":12882},{"type":21,"tag":209,"props":13040,"children":13041},{"style":216},[13042],{"type":26,"value":12908},{"type":21,"tag":209,"props":13044,"children":13045},{"style":263},[13046],{"type":26,"value":12913},{"type":21,"tag":209,"props":13048,"children":13049},{"style":222},[13050],{"type":26,"value":12918},{"type":21,"tag":22,"props":13052,"children":13053},{},[13054],{"type":26,"value":13055},"Now, we're faced with one additional hurdle, which is that we'll want to use the wkhtmltopdf-pack binary on heroku, but the wkhtmltopdf binary on our 'nix dev system. So, let's add an environment setting indicating the name of the binary we're looking for on heroku. Go to your dashboard, find the app to set this for, and click on settings. Then, add this config variable:",{"type":21,"tag":200,"props":13057,"children":13059},{"className":9840,"code":13058,"language":9842,"meta":8,"style":8},"Key: WKHTMLTOPDF_BINARY    Value: wkhtmltopdf-pack\n",[13060],{"type":21,"tag":63,"props":13061,"children":13062},{"__ignoreMap":8},[13063],{"type":21,"tag":209,"props":13064,"children":13065},{"class":211,"line":212},[13066,13071,13076,13081,13085],{"type":21,"tag":209,"props":13067,"children":13068},{"style":222},[13069],{"type":26,"value":13070},"Key: ",{"type":21,"tag":209,"props":13072,"children":13073},{"style":263},[13074],{"type":26,"value":13075},"WKHTMLTOPDF_BINARY",{"type":21,"tag":209,"props":13077,"children":13078},{"style":222},[13079],{"type":26,"value":13080},"    Value: wkhtmltopdf",{"type":21,"tag":209,"props":13082,"children":13083},{"style":216},[13084],{"type":26,"value":13012},{"type":21,"tag":209,"props":13086,"children":13087},{"style":222},[13088],{"type":26,"value":13089},"pack\n",{"type":21,"tag":22,"props":13091,"children":13092},{},[13093],{"type":26,"value":13094},"And now, let's add a little logic to ask the system which wkhtmltopdf binary we should use. This can go into whatever bootstrap config your framework might use (so, for instance, in Django's settings.py), or simply before your use of wkhtmltopdf/pdfkit.",{"type":21,"tag":200,"props":13096,"children":13098},{"className":9840,"code":13097,"language":9842,"meta":8,"style":8},"# Ensure virtualenv path is part of PATH env var\nos.environ['PATH'] += os.pathsep + os.path.dirname(sys.executable)  \nWKHTMLTOPDF_CMD = subprocess.Popen(\n    ['which', os.environ.get('WKHTMLTOPDF_BINARY', 'wkhtmltopdf')], # Note we default to 'wkhtmltopdf' as the binary name\n    stdout=subprocess.PIPE).communicate()[0].strip()\n",[13099],{"type":21,"tag":63,"props":13100,"children":13101},{"__ignoreMap":8},[13102,13110,13146,13163,13205],{"type":21,"tag":209,"props":13103,"children":13104},{"class":211,"line":212},[13105],{"type":21,"tag":209,"props":13106,"children":13107},{"style":448},[13108],{"type":26,"value":13109},"# Ensure virtualenv path is part of PATH env var\n",{"type":21,"tag":209,"props":13111,"children":13112},{"class":211,"line":244},[13113,13118,13123,13127,13132,13137,13141],{"type":21,"tag":209,"props":13114,"children":13115},{"style":222},[13116],{"type":26,"value":13117},"os.environ[",{"type":21,"tag":209,"props":13119,"children":13120},{"style":233},[13121],{"type":26,"value":13122},"'PATH'",{"type":21,"tag":209,"props":13124,"children":13125},{"style":222},[13126],{"type":26,"value":1427},{"type":21,"tag":209,"props":13128,"children":13129},{"style":216},[13130],{"type":26,"value":13131},"+=",{"type":21,"tag":209,"props":13133,"children":13134},{"style":222},[13135],{"type":26,"value":13136}," os.pathsep ",{"type":21,"tag":209,"props":13138,"children":13139},{"style":216},[13140],{"type":26,"value":10237},{"type":21,"tag":209,"props":13142,"children":13143},{"style":222},[13144],{"type":26,"value":13145}," os.path.dirname(sys.executable)  \n",{"type":21,"tag":209,"props":13147,"children":13148},{"class":211,"line":254},[13149,13154,13158],{"type":21,"tag":209,"props":13150,"children":13151},{"style":263},[13152],{"type":26,"value":13153},"WKHTMLTOPDF_CMD",{"type":21,"tag":209,"props":13155,"children":13156},{"style":216},[13157],{"type":26,"value":271},{"type":21,"tag":209,"props":13159,"children":13160},{"style":222},[13161],{"type":26,"value":13162}," subprocess.Popen(\n",{"type":21,"tag":209,"props":13164,"children":13165},{"class":211,"line":279},[13166,13171,13176,13181,13186,13190,13195,13200],{"type":21,"tag":209,"props":13167,"children":13168},{"style":222},[13169],{"type":26,"value":13170},"    [",{"type":21,"tag":209,"props":13172,"children":13173},{"style":233},[13174],{"type":26,"value":13175},"'which'",{"type":21,"tag":209,"props":13177,"children":13178},{"style":222},[13179],{"type":26,"value":13180},", os.environ.get(",{"type":21,"tag":209,"props":13182,"children":13183},{"style":233},[13184],{"type":26,"value":13185},"'WKHTMLTOPDF_BINARY'",{"type":21,"tag":209,"props":13187,"children":13188},{"style":222},[13189],{"type":26,"value":408},{"type":21,"tag":209,"props":13191,"children":13192},{"style":233},[13193],{"type":26,"value":13194},"'wkhtmltopdf'",{"type":21,"tag":209,"props":13196,"children":13197},{"style":222},[13198],{"type":26,"value":13199},")], ",{"type":21,"tag":209,"props":13201,"children":13202},{"style":448},[13203],{"type":26,"value":13204},"# Note we default to 'wkhtmltopdf' as the binary name\n",{"type":21,"tag":209,"props":13206,"children":13207},{"class":211,"line":288},[13208,13213,13217,13222,13227,13232,13236],{"type":21,"tag":209,"props":13209,"children":13210},{"style":400},[13211],{"type":26,"value":13212},"    stdout",{"type":21,"tag":209,"props":13214,"children":13215},{"style":216},[13216],{"type":26,"value":1432},{"type":21,"tag":209,"props":13218,"children":13219},{"style":222},[13220],{"type":26,"value":13221},"subprocess.",{"type":21,"tag":209,"props":13223,"children":13224},{"style":263},[13225],{"type":26,"value":13226},"PIPE",{"type":21,"tag":209,"props":13228,"children":13229},{"style":222},[13230],{"type":26,"value":13231},").communicate()[",{"type":21,"tag":209,"props":13233,"children":13234},{"style":263},[13235],{"type":26,"value":6048},{"type":21,"tag":209,"props":13237,"children":13238},{"style":222},[13239],{"type":26,"value":13240},"].strip()\n",{"type":21,"tag":22,"props":13242,"children":13243},{},[13244],{"type":26,"value":13245},"The value of WKHTMLTOPDF_CMD should now point to the binary we'll want to use.",{"type":21,"tag":51,"props":13247,"children":13249},{"id":13248},"pdfkit-example",[13250],{"type":26,"value":13251},"pdfkit Example",{"type":21,"tag":22,"props":13253,"children":13254},{},[13255,13257,13263],{"type":26,"value":13256},"Finally, let's take a look at a quick example of what using pdfkit with this binary might look like. PDFKit offers us fairly easy access to the various configuration options for the binary, and let's us set which binary we want to use, as shown below. ",{"type":21,"tag":29,"props":13258,"children":13260},{"href":12878,"rel":13259},[93],[13261],{"type":26,"value":13262},"See the documentation for more details",{"type":26,"value":378},{"type":21,"tag":200,"props":13265,"children":13267},{"className":9840,"code":13266,"language":9842,"meta":8,"style":8},"    pdfkit_config = pdfkit.configuration(wkhtmltopdf=settings.WKHTMLTOPDF_CMD)\n    wk_options = {\n        'page-size': 'Letter',\n        'orientation': 'landscape',\n        'title': title,\n        # In order to specify command-line options that are simple toggles\n        # using this dict format, we give the option the value None\n        'no-outline': None,\n        'disable-javascript': None,\n        'encoding': 'UTF-8',\n        'margin-left': '0.1cm',\n        'margin-right': '0.1cm',\n        'margin-top': '0.1cm',\n        'margin-bottom': '0.1cm',\n        'lowquality': None,\n    }\n\n    # We can generate the pdf from a url, file or, as shown here, a string\n    pdfkit.from_string(\n        # This example uses Django's render_to_string function to return the result of\n        # rendering an HTML template as a string, which we can then pass to pdfkit and on\n        # into wkhtmltopdf\n        input=render_to_string('reportPDF.html', context=params, request=request),\n        # We can output to a variable or a file - in this case, we're outputting to a file\n        output_path=os.path.join('filepath', 'filename'),\n        options=wk_options,\n        configuration=pdfkit_config\n    )\n",[13268],{"type":21,"tag":63,"props":13269,"children":13270},{"__ignoreMap":8},[13271,13309,13325,13346,13367,13380,13388,13396,13417,13437,13458,13479,13499,13519,13539,13559,13566,13573,13581,13589,13597,13605,13613,13666,13674,13709,13726,13743],{"type":21,"tag":209,"props":13272,"children":13273},{"class":211,"line":212},[13274,13279,13283,13288,13292,13296,13301,13305],{"type":21,"tag":209,"props":13275,"children":13276},{"style":222},[13277],{"type":26,"value":13278},"    pdfkit_config ",{"type":21,"tag":209,"props":13280,"children":13281},{"style":216},[13282],{"type":26,"value":1432},{"type":21,"tag":209,"props":13284,"children":13285},{"style":222},[13286],{"type":26,"value":13287}," pdfkit.configuration(",{"type":21,"tag":209,"props":13289,"children":13290},{"style":400},[13291],{"type":26,"value":12821},{"type":21,"tag":209,"props":13293,"children":13294},{"style":216},[13295],{"type":26,"value":1432},{"type":21,"tag":209,"props":13297,"children":13298},{"style":222},[13299],{"type":26,"value":13300},"settings.",{"type":21,"tag":209,"props":13302,"children":13303},{"style":263},[13304],{"type":26,"value":13153},{"type":21,"tag":209,"props":13306,"children":13307},{"style":222},[13308],{"type":26,"value":10112},{"type":21,"tag":209,"props":13310,"children":13311},{"class":211,"line":244},[13312,13317,13321],{"type":21,"tag":209,"props":13313,"children":13314},{"style":222},[13315],{"type":26,"value":13316},"    wk_options ",{"type":21,"tag":209,"props":13318,"children":13319},{"style":216},[13320],{"type":26,"value":1432},{"type":21,"tag":209,"props":13322,"children":13323},{"style":222},[13324],{"type":26,"value":276},{"type":21,"tag":209,"props":13326,"children":13327},{"class":211,"line":254},[13328,13333,13337,13342],{"type":21,"tag":209,"props":13329,"children":13330},{"style":233},[13331],{"type":26,"value":13332},"        'page-size'",{"type":21,"tag":209,"props":13334,"children":13335},{"style":222},[13336],{"type":26,"value":7427},{"type":21,"tag":209,"props":13338,"children":13339},{"style":233},[13340],{"type":26,"value":13341},"'Letter'",{"type":21,"tag":209,"props":13343,"children":13344},{"style":222},[13345],{"type":26,"value":304},{"type":21,"tag":209,"props":13347,"children":13348},{"class":211,"line":279},[13349,13354,13358,13363],{"type":21,"tag":209,"props":13350,"children":13351},{"style":233},[13352],{"type":26,"value":13353},"        'orientation'",{"type":21,"tag":209,"props":13355,"children":13356},{"style":222},[13357],{"type":26,"value":7427},{"type":21,"tag":209,"props":13359,"children":13360},{"style":233},[13361],{"type":26,"value":13362},"'landscape'",{"type":21,"tag":209,"props":13364,"children":13365},{"style":222},[13366],{"type":26,"value":304},{"type":21,"tag":209,"props":13368,"children":13369},{"class":211,"line":288},[13370,13375],{"type":21,"tag":209,"props":13371,"children":13372},{"style":233},[13373],{"type":26,"value":13374},"        'title'",{"type":21,"tag":209,"props":13376,"children":13377},{"style":222},[13378],{"type":26,"value":13379},": title,\n",{"type":21,"tag":209,"props":13381,"children":13382},{"class":211,"line":307},[13383],{"type":21,"tag":209,"props":13384,"children":13385},{"style":448},[13386],{"type":26,"value":13387},"        # In order to specify command-line options that are simple toggles\n",{"type":21,"tag":209,"props":13389,"children":13390},{"class":211,"line":325},[13391],{"type":21,"tag":209,"props":13392,"children":13393},{"style":448},[13394],{"type":26,"value":13395},"        # using this dict format, we give the option the value None\n",{"type":21,"tag":209,"props":13397,"children":13398},{"class":211,"line":334},[13399,13404,13408,13413],{"type":21,"tag":209,"props":13400,"children":13401},{"style":233},[13402],{"type":26,"value":13403},"        'no-outline'",{"type":21,"tag":209,"props":13405,"children":13406},{"style":222},[13407],{"type":26,"value":7427},{"type":21,"tag":209,"props":13409,"children":13410},{"style":263},[13411],{"type":26,"value":13412},"None",{"type":21,"tag":209,"props":13414,"children":13415},{"style":222},[13416],{"type":26,"value":304},{"type":21,"tag":209,"props":13418,"children":13419},{"class":211,"line":343},[13420,13425,13429,13433],{"type":21,"tag":209,"props":13421,"children":13422},{"style":233},[13423],{"type":26,"value":13424},"        'disable-javascript'",{"type":21,"tag":209,"props":13426,"children":13427},{"style":222},[13428],{"type":26,"value":7427},{"type":21,"tag":209,"props":13430,"children":13431},{"style":263},[13432],{"type":26,"value":13412},{"type":21,"tag":209,"props":13434,"children":13435},{"style":222},[13436],{"type":26,"value":304},{"type":21,"tag":209,"props":13438,"children":13439},{"class":211,"line":351},[13440,13445,13449,13454],{"type":21,"tag":209,"props":13441,"children":13442},{"style":233},[13443],{"type":26,"value":13444},"        'encoding'",{"type":21,"tag":209,"props":13446,"children":13447},{"style":222},[13448],{"type":26,"value":7427},{"type":21,"tag":209,"props":13450,"children":13451},{"style":233},[13452],{"type":26,"value":13453},"'UTF-8'",{"type":21,"tag":209,"props":13455,"children":13456},{"style":222},[13457],{"type":26,"value":304},{"type":21,"tag":209,"props":13459,"children":13460},{"class":211,"line":444},[13461,13466,13470,13475],{"type":21,"tag":209,"props":13462,"children":13463},{"style":233},[13464],{"type":26,"value":13465},"        'margin-left'",{"type":21,"tag":209,"props":13467,"children":13468},{"style":222},[13469],{"type":26,"value":7427},{"type":21,"tag":209,"props":13471,"children":13472},{"style":233},[13473],{"type":26,"value":13474},"'0.1cm'",{"type":21,"tag":209,"props":13476,"children":13477},{"style":222},[13478],{"type":26,"value":304},{"type":21,"tag":209,"props":13480,"children":13481},{"class":211,"line":454},[13482,13487,13491,13495],{"type":21,"tag":209,"props":13483,"children":13484},{"style":233},[13485],{"type":26,"value":13486},"        'margin-right'",{"type":21,"tag":209,"props":13488,"children":13489},{"style":222},[13490],{"type":26,"value":7427},{"type":21,"tag":209,"props":13492,"children":13493},{"style":233},[13494],{"type":26,"value":13474},{"type":21,"tag":209,"props":13496,"children":13497},{"style":222},[13498],{"type":26,"value":304},{"type":21,"tag":209,"props":13500,"children":13501},{"class":211,"line":463},[13502,13507,13511,13515],{"type":21,"tag":209,"props":13503,"children":13504},{"style":233},[13505],{"type":26,"value":13506},"        'margin-top'",{"type":21,"tag":209,"props":13508,"children":13509},{"style":222},[13510],{"type":26,"value":7427},{"type":21,"tag":209,"props":13512,"children":13513},{"style":233},[13514],{"type":26,"value":13474},{"type":21,"tag":209,"props":13516,"children":13517},{"style":222},[13518],{"type":26,"value":304},{"type":21,"tag":209,"props":13520,"children":13521},{"class":211,"line":472},[13522,13527,13531,13535],{"type":21,"tag":209,"props":13523,"children":13524},{"style":233},[13525],{"type":26,"value":13526},"        'margin-bottom'",{"type":21,"tag":209,"props":13528,"children":13529},{"style":222},[13530],{"type":26,"value":7427},{"type":21,"tag":209,"props":13532,"children":13533},{"style":233},[13534],{"type":26,"value":13474},{"type":21,"tag":209,"props":13536,"children":13537},{"style":222},[13538],{"type":26,"value":304},{"type":21,"tag":209,"props":13540,"children":13541},{"class":211,"line":480},[13542,13547,13551,13555],{"type":21,"tag":209,"props":13543,"children":13544},{"style":233},[13545],{"type":26,"value":13546},"        'lowquality'",{"type":21,"tag":209,"props":13548,"children":13549},{"style":222},[13550],{"type":26,"value":7427},{"type":21,"tag":209,"props":13552,"children":13553},{"style":263},[13554],{"type":26,"value":13412},{"type":21,"tag":209,"props":13556,"children":13557},{"style":222},[13558],{"type":26,"value":304},{"type":21,"tag":209,"props":13560,"children":13561},{"class":211,"line":489},[13562],{"type":21,"tag":209,"props":13563,"children":13564},{"style":222},[13565],{"type":26,"value":331},{"type":21,"tag":209,"props":13567,"children":13568},{"class":211,"line":847},[13569],{"type":21,"tag":209,"props":13570,"children":13571},{"emptyLinePlaceholder":248},[13572],{"type":26,"value":251},{"type":21,"tag":209,"props":13574,"children":13575},{"class":211,"line":860},[13576],{"type":21,"tag":209,"props":13577,"children":13578},{"style":448},[13579],{"type":26,"value":13580},"    # We can generate the pdf from a url, file or, as shown here, a string\n",{"type":21,"tag":209,"props":13582,"children":13583},{"class":211,"line":877},[13584],{"type":21,"tag":209,"props":13585,"children":13586},{"style":222},[13587],{"type":26,"value":13588},"    pdfkit.from_string(\n",{"type":21,"tag":209,"props":13590,"children":13591},{"class":211,"line":889},[13592],{"type":21,"tag":209,"props":13593,"children":13594},{"style":448},[13595],{"type":26,"value":13596},"        # This example uses Django's render_to_string function to return the result of\n",{"type":21,"tag":209,"props":13598,"children":13599},{"class":211,"line":902},[13600],{"type":21,"tag":209,"props":13601,"children":13602},{"style":448},[13603],{"type":26,"value":13604},"        # rendering an HTML template as a string, which we can then pass to pdfkit and on\n",{"type":21,"tag":209,"props":13606,"children":13607},{"class":211,"line":914},[13608],{"type":21,"tag":209,"props":13609,"children":13610},{"style":448},[13611],{"type":26,"value":13612},"        # into wkhtmltopdf\n",{"type":21,"tag":209,"props":13614,"children":13615},{"class":211,"line":922},[13616,13621,13625,13630,13635,13639,13644,13648,13653,13657,13661],{"type":21,"tag":209,"props":13617,"children":13618},{"style":400},[13619],{"type":26,"value":13620},"        input",{"type":21,"tag":209,"props":13622,"children":13623},{"style":216},[13624],{"type":26,"value":1432},{"type":21,"tag":209,"props":13626,"children":13627},{"style":222},[13628],{"type":26,"value":13629},"render_to_string(",{"type":21,"tag":209,"props":13631,"children":13632},{"style":233},[13633],{"type":26,"value":13634},"'reportPDF.html'",{"type":21,"tag":209,"props":13636,"children":13637},{"style":222},[13638],{"type":26,"value":408},{"type":21,"tag":209,"props":13640,"children":13641},{"style":400},[13642],{"type":26,"value":13643},"context",{"type":21,"tag":209,"props":13645,"children":13646},{"style":216},[13647],{"type":26,"value":1432},{"type":21,"tag":209,"props":13649,"children":13650},{"style":222},[13651],{"type":26,"value":13652},"params, ",{"type":21,"tag":209,"props":13654,"children":13655},{"style":400},[13656],{"type":26,"value":1343},{"type":21,"tag":209,"props":13658,"children":13659},{"style":216},[13660],{"type":26,"value":1432},{"type":21,"tag":209,"props":13662,"children":13663},{"style":222},[13664],{"type":26,"value":13665},"request),\n",{"type":21,"tag":209,"props":13667,"children":13668},{"class":211,"line":2312},[13669],{"type":21,"tag":209,"props":13670,"children":13671},{"style":448},[13672],{"type":26,"value":13673},"        # We can output to a variable or a file - in this case, we're outputting to a file\n",{"type":21,"tag":209,"props":13675,"children":13676},{"class":211,"line":2321},[13677,13682,13686,13691,13696,13700,13705],{"type":21,"tag":209,"props":13678,"children":13679},{"style":400},[13680],{"type":26,"value":13681},"        output_path",{"type":21,"tag":209,"props":13683,"children":13684},{"style":216},[13685],{"type":26,"value":1432},{"type":21,"tag":209,"props":13687,"children":13688},{"style":222},[13689],{"type":26,"value":13690},"os.path.join(",{"type":21,"tag":209,"props":13692,"children":13693},{"style":233},[13694],{"type":26,"value":13695},"'filepath'",{"type":21,"tag":209,"props":13697,"children":13698},{"style":222},[13699],{"type":26,"value":408},{"type":21,"tag":209,"props":13701,"children":13702},{"style":233},[13703],{"type":26,"value":13704},"'filename'",{"type":21,"tag":209,"props":13706,"children":13707},{"style":222},[13708],{"type":26,"value":10277},{"type":21,"tag":209,"props":13710,"children":13711},{"class":211,"line":2372},[13712,13717,13721],{"type":21,"tag":209,"props":13713,"children":13714},{"style":400},[13715],{"type":26,"value":13716},"        options",{"type":21,"tag":209,"props":13718,"children":13719},{"style":216},[13720],{"type":26,"value":1432},{"type":21,"tag":209,"props":13722,"children":13723},{"style":222},[13724],{"type":26,"value":13725},"wk_options,\n",{"type":21,"tag":209,"props":13727,"children":13728},{"class":211,"line":2381},[13729,13734,13738],{"type":21,"tag":209,"props":13730,"children":13731},{"style":400},[13732],{"type":26,"value":13733},"        configuration",{"type":21,"tag":209,"props":13735,"children":13736},{"style":216},[13737],{"type":26,"value":1432},{"type":21,"tag":209,"props":13739,"children":13740},{"style":222},[13741],{"type":26,"value":13742},"pdfkit_config\n",{"type":21,"tag":209,"props":13744,"children":13745},{"class":211,"line":2389},[13746],{"type":21,"tag":209,"props":13747,"children":13748},{"style":222},[13749],{"type":26,"value":13750},"    )\n",{"type":21,"tag":51,"props":13752,"children":13754},{"id":13753},"further-reading",[13755],{"type":26,"value":13756},"Further Reading",{"type":21,"tag":3677,"props":13758,"children":13759},{},[13760,13767,13775],{"type":21,"tag":3681,"props":13761,"children":13762},{},[13763],{"type":21,"tag":29,"props":13764,"children":13765},{"href":12831},[13766],{"type":26,"value":12821},{"type":21,"tag":3681,"props":13768,"children":13769},{},[13770],{"type":21,"tag":29,"props":13771,"children":13773},{"href":12878,"rel":13772},[93],[13774],{"type":26,"value":12882},{"type":21,"tag":3681,"props":13776,"children":13777},{},[13778],{"type":21,"tag":29,"props":13779,"children":13781},{"href":12978,"rel":13780},[93],[13782],{"type":26,"value":12982},{"type":21,"tag":3490,"props":13784,"children":13785},{},[13786],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":13788},[13789,13790,13791,13792],{"id":12821,"depth":254,"text":12821},{"id":12921,"depth":254,"text":12924},{"id":13248,"depth":254,"text":13251},{"id":13753,"depth":254,"text":13756},"content:ckeefer:2016-8:HerokuPDF.md","ckeefer/2016-8/HerokuPDF.md","ckeefer/2016-8/HerokuPDF",{"user":3518,"name":3519},{"_path":13798,"_dir":13799,"_draft":7,"_partial":7,"_locale":8,"title":13800,"description":13801,"publishDate":13802,"tags":13803,"excerpt":13801,"body":13805,"_type":3511,"_id":17529,"_source":3513,"_file":17530,"_stem":17531,"_extension":3516,"author":17532},"/ckeefer/2016-7/gofetch2","2016-7","Go Fetch 2! (JavaScript Fetch API)","Last time we discussed the Fetch API in general, taking a look at how it differed from the XMLHttpRequest API, and some of its advantages. Today, we're going to take a look at a little library that you can include in your projects today that offers you localStorage caching for the Fetch API.","2016-10-10",[12,13804,7335],"jquery",{"type":18,"children":13806,"toc":17522},[13807,13817,13823,13836,13842,13854,13881,13894,13899,13905,13919,13925,13930,13959,14564,14583,14905,14918,14924,14937,17518],{"type":21,"tag":22,"props":13808,"children":13809},{},[13810,13815],{"type":21,"tag":29,"props":13811,"children":13813},{"href":13812},"/search/user:ckeefer/go/fetch",[13814],{"type":26,"value":7347},{"type":26,"value":13816}," we discussed the Fetch API in general, taking a look at how it differed from the XMLHttpRequest API, and some of its advantages. Today, we're going to take a look at a little library that you can include in your projects today that offers you localStorage caching for the Fetch API.",{"type":21,"tag":51,"props":13818,"children":13820},{"id":13819},"tlwr",[13821],{"type":26,"value":13822},"TL;WR",{"type":21,"tag":22,"props":13824,"children":13825},{},[13826,13828,13835],{"type":26,"value":13827},"If you're anxious to get to the good stuff, you can head straight to the ",{"type":21,"tag":29,"props":13829,"children":13832},{"href":13830,"rel":13831},"https://github.com/SaneMethod/fetchCache",[93],[13833],{"type":26,"value":13834},"fetchCache Github Repo",{"type":26,"value":378},{"type":21,"tag":51,"props":13837,"children":13839},{"id":13838},"cache-control",[13840],{"type":26,"value":13841},"Cache Control",{"type":21,"tag":22,"props":13843,"children":13844},{},[13845,13847,13852],{"type":26,"value":13846},"Before we get started, those of you more familiar with the Fetch API might be wondering why we need to use localStorage for caching fetch request responses at all. Isn't that what the ",{"type":21,"tag":63,"props":13848,"children":13850},{"className":13849},[],[13851],{"type":26,"value":11636},{"type":26,"value":13853}," property in the fetch settings is for?",{"type":21,"tag":22,"props":13855,"children":13856},{},[13857,13859,13865,13866,13872,13873,13879],{"type":26,"value":13858},"Yes and no. The cache setting allows you greater control over the standard HTTP cache, so that you don't need to use the old trick of appending a datetime string to your request for 'cache-busting' purposes, as you might have done in the past with XHR. Instead, you can simply specify ",{"type":21,"tag":63,"props":13860,"children":13862},{"className":13861},[],[13863],{"type":26,"value":13864},"cache:'no-store'",{"type":26,"value":1922},{"type":21,"tag":63,"props":13867,"children":13869},{"className":13868},[],[13870],{"type":26,"value":13871},"cache:'no-cache'",{"type":26,"value":1922},{"type":21,"tag":63,"props":13874,"children":13876},{"className":13875},[],[13877],{"type":26,"value":13878},"cache:'reload'",{"type":26,"value":13880},", depending on your use case.",{"type":21,"tag":22,"props":13882,"children":13883},{},[13884,13886,13892],{"type":26,"value":13885},"You can also bypass a network request (potentially useful for offline usage) and pull from the HTTP cache via ",{"type":21,"tag":63,"props":13887,"children":13889},{"className":13888},[],[13890],{"type":26,"value":13891},"cache:'force-cache'",{"type":26,"value":13893},", which appears to accomplish one of the goals of caching in localStorage.",{"type":21,"tag":22,"props":13895,"children":13896},{},[13897],{"type":26,"value":13898},"However, that's as far as our control over the cache goes. We can't specify how long we want items to remain in the cache, or what requests line up with which contents of the cache, or validate the contents of the cache before returning them. For that, we need to wrap fetch with a bit of custom logic to allow us to handle the caching ourselves.",{"type":21,"tag":51,"props":13900,"children":13902},{"id":13901},"looks-familiar",[13903],{"type":26,"value":13904},"Looks Familiar",{"type":21,"tag":22,"props":13906,"children":13907},{},[13908,13910,13917],{"type":26,"value":13909},"Just before we dive in, you may find that the API I'm about to present looks familiar - maybe because you've used ",{"type":21,"tag":29,"props":13911,"children":13914},{"href":13912,"rel":13913},"https://github.com/SaneMethod/jquery-ajax-localstorage-cache",[93],[13915],{"type":26,"value":13916},"JALC",{"type":26,"value":13918},", the plugin for similar caching with jQuery.ajax. The API similarity is most definitely on purpose, and you should feel comfortable moving from one to the other.",{"type":21,"tag":51,"props":13920,"children":13922},{"id":13921},"the-breakdown",[13923],{"type":26,"value":13924},"The Breakdown",{"type":21,"tag":22,"props":13926,"children":13927},{},[13928],{"type":26,"value":13929},"So, let's take a look at the code, and discuss what's happening.",{"type":21,"tag":22,"props":13931,"children":13932},{},[13933,13935,13942,13944,13950,13951,13957],{"type":26,"value":13934},"For those of you who've used JALC, much of this will look familiar, and you can reference ",{"type":21,"tag":29,"props":13936,"children":13939},{"href":13937,"rel":13938},"https://artandlogic.com/2013/06/ajax-caching-transports-compatible-with-jquery-deferred/",[93],[13940],{"type":26,"value":13941},"this previous breakdown of the core parts of JALC for more details",{"type":26,"value":13943},", so we'll skip over those. Let's take a look at our ",{"type":21,"tag":63,"props":13945,"children":13947},{"className":13946},[],[13948],{"type":26,"value":13949},"cacheResponse",{"type":26,"value":7274},{"type":21,"tag":63,"props":13952,"children":13954},{"className":13953},[],[13955],{"type":26,"value":13956},"provideResponse",{"type":26,"value":13958}," functions, as they're the juicy bits.",{"type":21,"tag":200,"props":13960,"children":13962},{"className":9044,"code":13961,"language":9046,"meta":8,"style":8},"   /**\n    * Cache the response into our storage object.\n    * We clone the response so that we can drain the stream without making it\n    * unavailable to future handlers.\n    *\n    * @param {string} cacheKey Key under which to cache the data string. Bound in\n    * fetch override.\n    * @param {Storage} storage Object implementing Storage interface to store cached data\n    * (text or json exclusively) in. Bound in fetch override.\n    * @param {Number} hourstl Number of hours this value shoud remain in the cache.\n    * Bound in fetch override.\n    * @param {Response} response\n    */\nfunction cacheResponse(cacheKey, storage, hourstl, response) {\n    var cres = response.clone(),\n        dataType = (response.headers.get('Content-Type') || 'text/plain').toLowerCase();\n\n    cres.text().then((text) => {\n        try {\n            storage.setItem(cacheKey, text);\n            storage.setItem(cacheKey + 'cachettl', +new Date() + 1000 * 60 * 60 * hourstl);\n            storage.setItem(cacheKey + 'dataType', dataType);\n        } catch (e) {\n            // Remove any incomplete data that may have been saved before the exception was caught\n            removeFromStorage(storage, cacheKey);\n            console.log('Cache Error: ' + e, cacheKey, text);\n        }\n    });\n\n    return response;\n}\n\n",[13963],{"type":21,"tag":63,"props":13964,"children":13965},{"__ignoreMap":8},[13966,13974,13982,13990,13998,14006,14032,14040,14066,14074,14100,14108,14129,14137,14188,14218,14274,14281,14321,14332,14350,14430,14459,14474,14482,14495,14524,14531,14538,14545,14557],{"type":21,"tag":209,"props":13967,"children":13968},{"class":211,"line":212},[13969],{"type":21,"tag":209,"props":13970,"children":13971},{"style":448},[13972],{"type":26,"value":13973},"   /**\n",{"type":21,"tag":209,"props":13975,"children":13976},{"class":211,"line":244},[13977],{"type":21,"tag":209,"props":13978,"children":13979},{"style":448},[13980],{"type":26,"value":13981},"    * Cache the response into our storage object.\n",{"type":21,"tag":209,"props":13983,"children":13984},{"class":211,"line":254},[13985],{"type":21,"tag":209,"props":13986,"children":13987},{"style":448},[13988],{"type":26,"value":13989},"    * We clone the response so that we can drain the stream without making it\n",{"type":21,"tag":209,"props":13991,"children":13992},{"class":211,"line":279},[13993],{"type":21,"tag":209,"props":13994,"children":13995},{"style":448},[13996],{"type":26,"value":13997},"    * unavailable to future handlers.\n",{"type":21,"tag":209,"props":13999,"children":14000},{"class":211,"line":288},[14001],{"type":21,"tag":209,"props":14002,"children":14003},{"style":448},[14004],{"type":26,"value":14005},"    *\n",{"type":21,"tag":209,"props":14007,"children":14008},{"class":211,"line":307},[14009,14014,14018,14022,14027],{"type":21,"tag":209,"props":14010,"children":14011},{"style":448},[14012],{"type":26,"value":14013},"    * ",{"type":21,"tag":209,"props":14015,"children":14016},{"style":216},[14017],{"type":26,"value":4718},{"type":21,"tag":209,"props":14019,"children":14020},{"style":360},[14021],{"type":26,"value":4723},{"type":21,"tag":209,"props":14023,"children":14024},{"style":222},[14025],{"type":26,"value":14026}," cacheKey",{"type":21,"tag":209,"props":14028,"children":14029},{"style":448},[14030],{"type":26,"value":14031}," Key under which to cache the data string. Bound in\n",{"type":21,"tag":209,"props":14033,"children":14034},{"class":211,"line":325},[14035],{"type":21,"tag":209,"props":14036,"children":14037},{"style":448},[14038],{"type":26,"value":14039},"    * fetch override.\n",{"type":21,"tag":209,"props":14041,"children":14042},{"class":211,"line":334},[14043,14047,14051,14056,14061],{"type":21,"tag":209,"props":14044,"children":14045},{"style":448},[14046],{"type":26,"value":14013},{"type":21,"tag":209,"props":14048,"children":14049},{"style":216},[14050],{"type":26,"value":4718},{"type":21,"tag":209,"props":14052,"children":14053},{"style":360},[14054],{"type":26,"value":14055}," {Storage}",{"type":21,"tag":209,"props":14057,"children":14058},{"style":222},[14059],{"type":26,"value":14060}," storage",{"type":21,"tag":209,"props":14062,"children":14063},{"style":448},[14064],{"type":26,"value":14065}," Object implementing Storage interface to store cached data\n",{"type":21,"tag":209,"props":14067,"children":14068},{"class":211,"line":343},[14069],{"type":21,"tag":209,"props":14070,"children":14071},{"style":448},[14072],{"type":26,"value":14073},"    * (text or json exclusively) in. Bound in fetch override.\n",{"type":21,"tag":209,"props":14075,"children":14076},{"class":211,"line":351},[14077,14081,14085,14090,14095],{"type":21,"tag":209,"props":14078,"children":14079},{"style":448},[14080],{"type":26,"value":14013},{"type":21,"tag":209,"props":14082,"children":14083},{"style":216},[14084],{"type":26,"value":4718},{"type":21,"tag":209,"props":14086,"children":14087},{"style":360},[14088],{"type":26,"value":14089}," {Number}",{"type":21,"tag":209,"props":14091,"children":14092},{"style":222},[14093],{"type":26,"value":14094}," hourstl",{"type":21,"tag":209,"props":14096,"children":14097},{"style":448},[14098],{"type":26,"value":14099}," Number of hours this value shoud remain in the cache.\n",{"type":21,"tag":209,"props":14101,"children":14102},{"class":211,"line":444},[14103],{"type":21,"tag":209,"props":14104,"children":14105},{"style":448},[14106],{"type":26,"value":14107},"    * Bound in fetch override.\n",{"type":21,"tag":209,"props":14109,"children":14110},{"class":211,"line":454},[14111,14115,14119,14124],{"type":21,"tag":209,"props":14112,"children":14113},{"style":448},[14114],{"type":26,"value":14013},{"type":21,"tag":209,"props":14116,"children":14117},{"style":216},[14118],{"type":26,"value":4718},{"type":21,"tag":209,"props":14120,"children":14121},{"style":360},[14122],{"type":26,"value":14123}," {Response}",{"type":21,"tag":209,"props":14125,"children":14126},{"style":222},[14127],{"type":26,"value":14128}," response\n",{"type":21,"tag":209,"props":14130,"children":14131},{"class":211,"line":463},[14132],{"type":21,"tag":209,"props":14133,"children":14134},{"style":448},[14135],{"type":26,"value":14136},"    */\n",{"type":21,"tag":209,"props":14138,"children":14139},{"class":211,"line":472},[14140,14144,14149,14153,14158,14162,14167,14171,14176,14180,14184],{"type":21,"tag":209,"props":14141,"children":14142},{"style":216},[14143],{"type":26,"value":5370},{"type":21,"tag":209,"props":14145,"children":14146},{"style":360},[14147],{"type":26,"value":14148}," cacheResponse",{"type":21,"tag":209,"props":14150,"children":14151},{"style":222},[14152],{"type":26,"value":368},{"type":21,"tag":209,"props":14154,"children":14155},{"style":400},[14156],{"type":26,"value":14157},"cacheKey",{"type":21,"tag":209,"props":14159,"children":14160},{"style":222},[14161],{"type":26,"value":408},{"type":21,"tag":209,"props":14163,"children":14164},{"style":400},[14165],{"type":26,"value":14166},"storage",{"type":21,"tag":209,"props":14168,"children":14169},{"style":222},[14170],{"type":26,"value":408},{"type":21,"tag":209,"props":14172,"children":14173},{"style":400},[14174],{"type":26,"value":14175},"hourstl",{"type":21,"tag":209,"props":14177,"children":14178},{"style":222},[14179],{"type":26,"value":408},{"type":21,"tag":209,"props":14181,"children":14182},{"style":400},[14183],{"type":26,"value":12498},{"type":21,"tag":209,"props":14185,"children":14186},{"style":222},[14187],{"type":26,"value":4786},{"type":21,"tag":209,"props":14189,"children":14190},{"class":211,"line":480},[14191,14195,14200,14204,14209,14214],{"type":21,"tag":209,"props":14192,"children":14193},{"style":216},[14194],{"type":26,"value":10405},{"type":21,"tag":209,"props":14196,"children":14197},{"style":222},[14198],{"type":26,"value":14199}," cres ",{"type":21,"tag":209,"props":14201,"children":14202},{"style":216},[14203],{"type":26,"value":1432},{"type":21,"tag":209,"props":14205,"children":14206},{"style":222},[14207],{"type":26,"value":14208}," response.",{"type":21,"tag":209,"props":14210,"children":14211},{"style":360},[14212],{"type":26,"value":14213},"clone",{"type":21,"tag":209,"props":14215,"children":14216},{"style":222},[14217],{"type":26,"value":5405},{"type":21,"tag":209,"props":14219,"children":14220},{"class":211,"line":489},[14221,14226,14230,14235,14239,14243,14248,14252,14256,14261,14265,14270],{"type":21,"tag":209,"props":14222,"children":14223},{"style":222},[14224],{"type":26,"value":14225},"        dataType ",{"type":21,"tag":209,"props":14227,"children":14228},{"style":216},[14229],{"type":26,"value":1432},{"type":21,"tag":209,"props":14231,"children":14232},{"style":222},[14233],{"type":26,"value":14234}," (response.headers.",{"type":21,"tag":209,"props":14236,"children":14237},{"style":360},[14238],{"type":26,"value":6663},{"type":21,"tag":209,"props":14240,"children":14241},{"style":222},[14242],{"type":26,"value":368},{"type":21,"tag":209,"props":14244,"children":14245},{"style":233},[14246],{"type":26,"value":14247},"'Content-Type'",{"type":21,"tag":209,"props":14249,"children":14250},{"style":222},[14251],{"type":26,"value":432},{"type":21,"tag":209,"props":14253,"children":14254},{"style":216},[14255],{"type":26,"value":4677},{"type":21,"tag":209,"props":14257,"children":14258},{"style":233},[14259],{"type":26,"value":14260}," 'text/plain'",{"type":21,"tag":209,"props":14262,"children":14263},{"style":222},[14264],{"type":26,"value":2699},{"type":21,"tag":209,"props":14266,"children":14267},{"style":360},[14268],{"type":26,"value":14269},"toLowerCase",{"type":21,"tag":209,"props":14271,"children":14272},{"style":222},[14273],{"type":26,"value":4842},{"type":21,"tag":209,"props":14275,"children":14276},{"class":211,"line":847},[14277],{"type":21,"tag":209,"props":14278,"children":14279},{"emptyLinePlaceholder":248},[14280],{"type":26,"value":251},{"type":21,"tag":209,"props":14282,"children":14283},{"class":211,"line":860},[14284,14289,14293,14297,14301,14305,14309,14313,14317],{"type":21,"tag":209,"props":14285,"children":14286},{"style":222},[14287],{"type":26,"value":14288},"    cres.",{"type":21,"tag":209,"props":14290,"children":14291},{"style":360},[14292],{"type":26,"value":26},{"type":21,"tag":209,"props":14294,"children":14295},{"style":222},[14296],{"type":26,"value":11910},{"type":21,"tag":209,"props":14298,"children":14299},{"style":360},[14300],{"type":26,"value":2704},{"type":21,"tag":209,"props":14302,"children":14303},{"style":222},[14304],{"type":26,"value":2709},{"type":21,"tag":209,"props":14306,"children":14307},{"style":400},[14308],{"type":26,"value":26},{"type":21,"tag":209,"props":14310,"children":14311},{"style":222},[14312],{"type":26,"value":432},{"type":21,"tag":209,"props":14314,"children":14315},{"style":216},[14316],{"type":26,"value":437},{"type":21,"tag":209,"props":14318,"children":14319},{"style":222},[14320],{"type":26,"value":276},{"type":21,"tag":209,"props":14322,"children":14323},{"class":211,"line":877},[14324,14328],{"type":21,"tag":209,"props":14325,"children":14326},{"style":216},[14327],{"type":26,"value":6775},{"type":21,"tag":209,"props":14329,"children":14330},{"style":222},[14331],{"type":26,"value":276},{"type":21,"tag":209,"props":14333,"children":14334},{"class":211,"line":889},[14335,14340,14345],{"type":21,"tag":209,"props":14336,"children":14337},{"style":222},[14338],{"type":26,"value":14339},"            storage.",{"type":21,"tag":209,"props":14341,"children":14342},{"style":360},[14343],{"type":26,"value":14344},"setItem",{"type":21,"tag":209,"props":14346,"children":14347},{"style":222},[14348],{"type":26,"value":14349},"(cacheKey, text);\n",{"type":21,"tag":209,"props":14351,"children":14352},{"class":211,"line":902},[14353,14357,14361,14366,14370,14375,14379,14384,14389,14394,14398,14403,14408,14413,14417,14421,14425],{"type":21,"tag":209,"props":14354,"children":14355},{"style":222},[14356],{"type":26,"value":14339},{"type":21,"tag":209,"props":14358,"children":14359},{"style":360},[14360],{"type":26,"value":14344},{"type":21,"tag":209,"props":14362,"children":14363},{"style":222},[14364],{"type":26,"value":14365},"(cacheKey ",{"type":21,"tag":209,"props":14367,"children":14368},{"style":216},[14369],{"type":26,"value":10237},{"type":21,"tag":209,"props":14371,"children":14372},{"style":233},[14373],{"type":26,"value":14374}," 'cachettl'",{"type":21,"tag":209,"props":14376,"children":14377},{"style":222},[14378],{"type":26,"value":408},{"type":21,"tag":209,"props":14380,"children":14381},{"style":216},[14382],{"type":26,"value":14383},"+new",{"type":21,"tag":209,"props":14385,"children":14386},{"style":360},[14387],{"type":26,"value":14388}," Date",{"type":21,"tag":209,"props":14390,"children":14391},{"style":222},[14392],{"type":26,"value":14393},"() ",{"type":21,"tag":209,"props":14395,"children":14396},{"style":216},[14397],{"type":26,"value":10237},{"type":21,"tag":209,"props":14399,"children":14400},{"style":263},[14401],{"type":26,"value":14402}," 1000",{"type":21,"tag":209,"props":14404,"children":14405},{"style":216},[14406],{"type":26,"value":14407}," *",{"type":21,"tag":209,"props":14409,"children":14410},{"style":263},[14411],{"type":26,"value":14412}," 60",{"type":21,"tag":209,"props":14414,"children":14415},{"style":216},[14416],{"type":26,"value":14407},{"type":21,"tag":209,"props":14418,"children":14419},{"style":263},[14420],{"type":26,"value":14412},{"type":21,"tag":209,"props":14422,"children":14423},{"style":216},[14424],{"type":26,"value":14407},{"type":21,"tag":209,"props":14426,"children":14427},{"style":222},[14428],{"type":26,"value":14429}," hourstl);\n",{"type":21,"tag":209,"props":14431,"children":14432},{"class":211,"line":914},[14433,14437,14441,14445,14449,14454],{"type":21,"tag":209,"props":14434,"children":14435},{"style":222},[14436],{"type":26,"value":14339},{"type":21,"tag":209,"props":14438,"children":14439},{"style":360},[14440],{"type":26,"value":14344},{"type":21,"tag":209,"props":14442,"children":14443},{"style":222},[14444],{"type":26,"value":14365},{"type":21,"tag":209,"props":14446,"children":14447},{"style":216},[14448],{"type":26,"value":10237},{"type":21,"tag":209,"props":14450,"children":14451},{"style":233},[14452],{"type":26,"value":14453}," 'dataType'",{"type":21,"tag":209,"props":14455,"children":14456},{"style":222},[14457],{"type":26,"value":14458},", dataType);\n",{"type":21,"tag":209,"props":14460,"children":14461},{"class":211,"line":922},[14462,14466,14470],{"type":21,"tag":209,"props":14463,"children":14464},{"style":222},[14465],{"type":26,"value":6818},{"type":21,"tag":209,"props":14467,"children":14468},{"style":216},[14469],{"type":26,"value":6823},{"type":21,"tag":209,"props":14471,"children":14472},{"style":222},[14473],{"type":26,"value":6828},{"type":21,"tag":209,"props":14475,"children":14476},{"class":211,"line":2312},[14477],{"type":21,"tag":209,"props":14478,"children":14479},{"style":448},[14480],{"type":26,"value":14481},"            // Remove any incomplete data that may have been saved before the exception was caught\n",{"type":21,"tag":209,"props":14483,"children":14484},{"class":211,"line":2321},[14485,14490],{"type":21,"tag":209,"props":14486,"children":14487},{"style":360},[14488],{"type":26,"value":14489},"            removeFromStorage",{"type":21,"tag":209,"props":14491,"children":14492},{"style":222},[14493],{"type":26,"value":14494},"(storage, cacheKey);\n",{"type":21,"tag":209,"props":14496,"children":14497},{"class":211,"line":2372},[14498,14502,14506,14510,14515,14519],{"type":21,"tag":209,"props":14499,"children":14500},{"style":222},[14501],{"type":26,"value":2495},{"type":21,"tag":209,"props":14503,"children":14504},{"style":360},[14505],{"type":26,"value":1059},{"type":21,"tag":209,"props":14507,"children":14508},{"style":222},[14509],{"type":26,"value":368},{"type":21,"tag":209,"props":14511,"children":14512},{"style":233},[14513],{"type":26,"value":14514},"'Cache Error: '",{"type":21,"tag":209,"props":14516,"children":14517},{"style":216},[14518],{"type":26,"value":10659},{"type":21,"tag":209,"props":14520,"children":14521},{"style":222},[14522],{"type":26,"value":14523}," e, cacheKey, text);\n",{"type":21,"tag":209,"props":14525,"children":14526},{"class":211,"line":2381},[14527],{"type":21,"tag":209,"props":14528,"children":14529},{"style":222},[14530],{"type":26,"value":2235},{"type":21,"tag":209,"props":14532,"children":14533},{"class":211,"line":2389},[14534],{"type":21,"tag":209,"props":14535,"children":14536},{"style":222},[14537],{"type":26,"value":3391},{"type":21,"tag":209,"props":14539,"children":14540},{"class":211,"line":2397},[14541],{"type":21,"tag":209,"props":14542,"children":14543},{"emptyLinePlaceholder":248},[14544],{"type":26,"value":251},{"type":21,"tag":209,"props":14546,"children":14547},{"class":211,"line":2406},[14548,14552],{"type":21,"tag":209,"props":14549,"children":14550},{"style":216},[14551],{"type":26,"value":1298},{"type":21,"tag":209,"props":14553,"children":14554},{"style":222},[14555],{"type":26,"value":14556}," response;\n",{"type":21,"tag":209,"props":14558,"children":14559},{"class":211,"line":2415},[14560],{"type":21,"tag":209,"props":14561,"children":14562},{"style":222},[14563],{"type":26,"value":7798},{"type":21,"tag":22,"props":14565,"children":14566},{},[14567,14569,14574,14576,14581],{"type":26,"value":14568},"The interesting bit here is you'll see we clone the response. This is so we can 'drain' it with the ",{"type":21,"tag":63,"props":14570,"children":14572},{"className":14571},[],[14573],{"type":26,"value":26},{"type":26,"value":14575}," reader and store the results, without making the response unavailable to future promise handler blocks. By cloning the response, we get a buffered clone of the response value that we can do with as we wish, and we can pass the original response on to be handled however the future ",{"type":21,"tag":63,"props":14577,"children":14579},{"className":14578},[],[14580],{"type":26,"value":2704},{"type":26,"value":14582}," blocks wish to.",{"type":21,"tag":200,"props":14584,"children":14586},{"className":9044,"code":14585,"language":9046,"meta":8,"style":8},"   /**\n    * Create a new response containing the cached value, and return a promise\n    * that resolves with this response.\n    *\n    * @param value\n    * @param dataType\n    * @returns {Promise}\n    */\nfunction provideResponse(value, dataType) {\n    var response = new Response(\n        value,\n        {\n            status: 200,\n            statusText: 'success',\n            headers: {\n                'Content-Type': dataType\n            }\n        }\n    );\n\n    return new Promise(function (resolve, reject) {\n        resolve(response);\n    });\n}\n",[14587],{"type":21,"tag":63,"props":14588,"children":14589},{"__ignoreMap":8},[14590,14597,14605,14613,14620,14636,14652,14668,14675,14709,14737,14745,14752,14769,14786,14794,14807,14814,14821,14828,14835,14878,14891,14898],{"type":21,"tag":209,"props":14591,"children":14592},{"class":211,"line":212},[14593],{"type":21,"tag":209,"props":14594,"children":14595},{"style":448},[14596],{"type":26,"value":13973},{"type":21,"tag":209,"props":14598,"children":14599},{"class":211,"line":244},[14600],{"type":21,"tag":209,"props":14601,"children":14602},{"style":448},[14603],{"type":26,"value":14604},"    * Create a new response containing the cached value, and return a promise\n",{"type":21,"tag":209,"props":14606,"children":14607},{"class":211,"line":254},[14608],{"type":21,"tag":209,"props":14609,"children":14610},{"style":448},[14611],{"type":26,"value":14612},"    * that resolves with this response.\n",{"type":21,"tag":209,"props":14614,"children":14615},{"class":211,"line":279},[14616],{"type":21,"tag":209,"props":14617,"children":14618},{"style":448},[14619],{"type":26,"value":14005},{"type":21,"tag":209,"props":14621,"children":14622},{"class":211,"line":288},[14623,14627,14631],{"type":21,"tag":209,"props":14624,"children":14625},{"style":448},[14626],{"type":26,"value":14013},{"type":21,"tag":209,"props":14628,"children":14629},{"style":216},[14630],{"type":26,"value":4718},{"type":21,"tag":209,"props":14632,"children":14633},{"style":222},[14634],{"type":26,"value":14635}," value\n",{"type":21,"tag":209,"props":14637,"children":14638},{"class":211,"line":307},[14639,14643,14647],{"type":21,"tag":209,"props":14640,"children":14641},{"style":448},[14642],{"type":26,"value":14013},{"type":21,"tag":209,"props":14644,"children":14645},{"style":216},[14646],{"type":26,"value":4718},{"type":21,"tag":209,"props":14648,"children":14649},{"style":222},[14650],{"type":26,"value":14651}," dataType\n",{"type":21,"tag":209,"props":14653,"children":14654},{"class":211,"line":325},[14655,14659,14663],{"type":21,"tag":209,"props":14656,"children":14657},{"style":448},[14658],{"type":26,"value":14013},{"type":21,"tag":209,"props":14660,"children":14661},{"style":216},[14662],{"type":26,"value":4740},{"type":21,"tag":209,"props":14664,"children":14665},{"style":360},[14666],{"type":26,"value":14667}," {Promise}\n",{"type":21,"tag":209,"props":14669,"children":14670},{"class":211,"line":334},[14671],{"type":21,"tag":209,"props":14672,"children":14673},{"style":448},[14674],{"type":26,"value":14136},{"type":21,"tag":209,"props":14676,"children":14677},{"class":211,"line":343},[14678,14682,14687,14691,14696,14700,14705],{"type":21,"tag":209,"props":14679,"children":14680},{"style":216},[14681],{"type":26,"value":5370},{"type":21,"tag":209,"props":14683,"children":14684},{"style":360},[14685],{"type":26,"value":14686}," provideResponse",{"type":21,"tag":209,"props":14688,"children":14689},{"style":222},[14690],{"type":26,"value":368},{"type":21,"tag":209,"props":14692,"children":14693},{"style":400},[14694],{"type":26,"value":14695},"value",{"type":21,"tag":209,"props":14697,"children":14698},{"style":222},[14699],{"type":26,"value":408},{"type":21,"tag":209,"props":14701,"children":14702},{"style":400},[14703],{"type":26,"value":14704},"dataType",{"type":21,"tag":209,"props":14706,"children":14707},{"style":222},[14708],{"type":26,"value":4786},{"type":21,"tag":209,"props":14710,"children":14711},{"class":211,"line":351},[14712,14716,14720,14724,14728,14733],{"type":21,"tag":209,"props":14713,"children":14714},{"style":216},[14715],{"type":26,"value":10405},{"type":21,"tag":209,"props":14717,"children":14718},{"style":222},[14719],{"type":26,"value":12514},{"type":21,"tag":209,"props":14721,"children":14722},{"style":216},[14723],{"type":26,"value":1432},{"type":21,"tag":209,"props":14725,"children":14726},{"style":216},[14727],{"type":26,"value":4667},{"type":21,"tag":209,"props":14729,"children":14730},{"style":360},[14731],{"type":26,"value":14732}," Response",{"type":21,"tag":209,"props":14734,"children":14735},{"style":222},[14736],{"type":26,"value":11597},{"type":21,"tag":209,"props":14738,"children":14739},{"class":211,"line":444},[14740],{"type":21,"tag":209,"props":14741,"children":14742},{"style":222},[14743],{"type":26,"value":14744},"        value,\n",{"type":21,"tag":209,"props":14746,"children":14747},{"class":211,"line":454},[14748],{"type":21,"tag":209,"props":14749,"children":14750},{"style":222},[14751],{"type":26,"value":7561},{"type":21,"tag":209,"props":14753,"children":14754},{"class":211,"line":463},[14755,14760,14765],{"type":21,"tag":209,"props":14756,"children":14757},{"style":222},[14758],{"type":26,"value":14759},"            status: ",{"type":21,"tag":209,"props":14761,"children":14762},{"style":263},[14763],{"type":26,"value":14764},"200",{"type":21,"tag":209,"props":14766,"children":14767},{"style":222},[14768],{"type":26,"value":304},{"type":21,"tag":209,"props":14770,"children":14771},{"class":211,"line":472},[14772,14777,14782],{"type":21,"tag":209,"props":14773,"children":14774},{"style":222},[14775],{"type":26,"value":14776},"            statusText: ",{"type":21,"tag":209,"props":14778,"children":14779},{"style":233},[14780],{"type":26,"value":14781},"'success'",{"type":21,"tag":209,"props":14783,"children":14784},{"style":222},[14785],{"type":26,"value":304},{"type":21,"tag":209,"props":14787,"children":14788},{"class":211,"line":480},[14789],{"type":21,"tag":209,"props":14790,"children":14791},{"style":222},[14792],{"type":26,"value":14793},"            headers: {\n",{"type":21,"tag":209,"props":14795,"children":14796},{"class":211,"line":489},[14797,14802],{"type":21,"tag":209,"props":14798,"children":14799},{"style":233},[14800],{"type":26,"value":14801},"                'Content-Type'",{"type":21,"tag":209,"props":14803,"children":14804},{"style":222},[14805],{"type":26,"value":14806},": dataType\n",{"type":21,"tag":209,"props":14808,"children":14809},{"class":211,"line":847},[14810],{"type":21,"tag":209,"props":14811,"children":14812},{"style":222},[14813],{"type":26,"value":6136},{"type":21,"tag":209,"props":14815,"children":14816},{"class":211,"line":860},[14817],{"type":21,"tag":209,"props":14818,"children":14819},{"style":222},[14820],{"type":26,"value":2235},{"type":21,"tag":209,"props":14822,"children":14823},{"class":211,"line":877},[14824],{"type":21,"tag":209,"props":14825,"children":14826},{"style":222},[14827],{"type":26,"value":11739},{"type":21,"tag":209,"props":14829,"children":14830},{"class":211,"line":889},[14831],{"type":21,"tag":209,"props":14832,"children":14833},{"emptyLinePlaceholder":248},[14834],{"type":26,"value":251},{"type":21,"tag":209,"props":14836,"children":14837},{"class":211,"line":902},[14838,14842,14846,14850,14854,14858,14862,14866,14870,14874],{"type":21,"tag":209,"props":14839,"children":14840},{"style":216},[14841],{"type":26,"value":1298},{"type":21,"tag":209,"props":14843,"children":14844},{"style":216},[14845],{"type":26,"value":4667},{"type":21,"tag":209,"props":14847,"children":14848},{"style":263},[14849],{"type":26,"value":5581},{"type":21,"tag":209,"props":14851,"children":14852},{"style":222},[14853],{"type":26,"value":368},{"type":21,"tag":209,"props":14855,"children":14856},{"style":216},[14857],{"type":26,"value":5370},{"type":21,"tag":209,"props":14859,"children":14860},{"style":222},[14861],{"type":26,"value":4776},{"type":21,"tag":209,"props":14863,"children":14864},{"style":400},[14865],{"type":26,"value":5590},{"type":21,"tag":209,"props":14867,"children":14868},{"style":222},[14869],{"type":26,"value":408},{"type":21,"tag":209,"props":14871,"children":14872},{"style":400},[14873],{"type":26,"value":5599},{"type":21,"tag":209,"props":14875,"children":14876},{"style":222},[14877],{"type":26,"value":4786},{"type":21,"tag":209,"props":14879,"children":14880},{"class":211,"line":914},[14881,14886],{"type":21,"tag":209,"props":14882,"children":14883},{"style":360},[14884],{"type":26,"value":14885},"        resolve",{"type":21,"tag":209,"props":14887,"children":14888},{"style":222},[14889],{"type":26,"value":14890},"(response);\n",{"type":21,"tag":209,"props":14892,"children":14893},{"class":211,"line":922},[14894],{"type":21,"tag":209,"props":14895,"children":14896},{"style":222},[14897],{"type":26,"value":3391},{"type":21,"tag":209,"props":14899,"children":14900},{"class":211,"line":2312},[14901],{"type":21,"tag":209,"props":14902,"children":14903},{"style":222},[14904],{"type":26,"value":7798},{"type":21,"tag":22,"props":14906,"children":14907},{},[14908,14910,14916],{"type":26,"value":14909},"Here's the last really interesting bit, and it demonstrates the advantage of having access to the ",{"type":21,"tag":63,"props":14911,"children":14913},{"className":14912},[],[14914],{"type":26,"value":14915},"Response",{"type":26,"value":14917}," primitive - we can create our own streamable response by simply feeding in the value to the Response constructor, and return a new Promise as the fetch API expects immediately resolving with our response.",{"type":21,"tag":51,"props":14919,"children":14921},{"id":14920},"all-together-now",[14922],{"type":26,"value":14923},"All Together Now",{"type":21,"tag":22,"props":14925,"children":14926},{},[14927,14929,14935],{"type":26,"value":14928},"Here's the full code as of the time of this writing, and I recommend taking a look at the ",{"type":21,"tag":29,"props":14930,"children":14932},{"href":13830,"rel":14931},[93],[14933],{"type":26,"value":14934},"github repo",{"type":26,"value":14936}," for the up-to-date version. As always, let me know if you have any questions in the comments.",{"type":21,"tag":200,"props":14938,"children":14940},{"className":9044,"code":14939,"language":9046,"meta":8,"style":8},"/**\n * Copyright (c) Christopher Keefer, 2016.\n * https://github.com/SaneMethod/fetchCache\n *\n * Override fetch in the global context to allow us to cache the response to fetch in a Storage interface\n * implementing object (such as localStorage).\n */\n(function (fetch) {\n    /* If the context doesn't support fetch, we won't attempt to patch in our\n     caching using fetch, for obvious reasons. */\n    if (!fetch) return;\n\n    /**\n     * Generate the cache key under which to store the local data - either the cache key supplied,\n     * or one generated from the url, the Content-type header (if specified) and the body (if specified).\n     *\n     * @returns {string}\n     */\n    function genCacheKey(url, settings) {\n        var {headers:{'Content-type': type}} = ('headers' in settings) ? settings : {headers: {}},\n            {body} = settings;\n\n        return settings.cacheKey || url + (type || '') + (body || '');\n    }\n\n    /**\n     * Determine whether we're using localStorage or, if the user has specified something other than a boolean\n     * value for options.localCache, whether the value appears to satisfy the plugin's requirements.\n     * Otherwise, throw a new TypeError indicating what type of value we expect.\n     *\n     * @param {boolean|object} storage\n     * @returns {boolean|object}\n     */\n    function getStorage(storage) {\n        if (!storage) return false;\n        if (storage === true) return self.localStorage;\n        if (typeof storage === \"object\" && 'getItem' in storage &&\n            'removeItem' in storage && 'setItem' in storage) {\n            return storage;\n        }\n        throw new TypeError(\"localCache must either be a boolean value, \" +\n            \"or an object which implements the Storage interface.\");\n    }\n\n    /**\n     * Remove the item specified by cacheKey and its attendant meta items from storage.\n     *\n     * @param {Storage|object} storage\n     * @param {string} cacheKey\n     */\n    function removeFromStorage(storage, cacheKey) {\n        storage.removeItem(cacheKey);\n        storage.removeItem(cacheKey + 'cachettl');\n        storage.removeItem(cacheKey + 'dataType');\n    }\n\n    /**\n     * Cache the response into our storage object.\n     * We clone the response so that we can drain the stream without making it\n     * unavailable to future handlers.\n     *\n     * @param {string} cacheKey Key under which to cache the data string. Bound in\n     * fetch override.\n     * @param {Storage} storage Object implementing Storage interface to store cached data\n     * (text or json exclusively) in. Bound in fetch override.\n     * @param {Number} hourstl Number of hours this value shoud remain in the cache.\n     * Bound in fetch override.\n     * @param {Response} response\n     */\n    function cacheResponse(cacheKey, storage, hourstl, response) {\n        var cres = response.clone(),\n            dataType = (response.headers.get('Content-Type') || 'text/plain').toLowerCase();\n\n        cres.text().then((text) => {\n            try {\n                storage.setItem(cacheKey, text);\n                storage.setItem(cacheKey + 'cachettl', +new Date() + 1000 * 60 * 60 * hourstl);\n                storage.setItem(cacheKey + 'dataType', dataType);\n            } catch (e) {\n                // Remove any incomplete data that may have been saved before the exception was caught\n                removeFromStorage(storage, cacheKey);\n                console.log('Cache Error: ' + e, cacheKey, text);\n            }\n        });\n\n        return response;\n    }\n\n    /**\n     * Create a new response containing the cached value, and return a promise\n     * that resolves with this response.\n     *\n     * @param value\n     * @param dataType\n     * @returns {Promise}\n     */\n    function provideResponse(value, dataType) {\n        var response = new Response(\n            value,\n            {\n                status: 200,\n                statusText: 'success',\n                headers: {\n                    'Content-Type': dataType\n                }\n            }\n        );\n\n        return new Promise(function (resolve, reject) {\n            resolve(response);\n        });\n    }\n\n    /**\n     * Override fetch on the global context, so that we can intercept\n     * fetch calls and respond with locally cached content, if available.\n     * New parameters available on the call to fetch:\n     * localCache   : true // required - either a boolean (if true, localStorage is used,\n     * if false request is not cached or returned from cache), or an object implementing the\n     * Storage interface, in which case that object is used instead.\n     * cacheTTL     : 5, // optional, cache time in hours, default is 5. Use float numbers for\n     * values less than a full hour (e.g. 0.5 for 1/2 hour).\n     * cacheKey     : 'post', // optional - key under which cached string will be stored.\n     * isCacheValid : function  // optional - return true for valid, false for invalid.\n     */\n    self.fetch = function (url, settings) {\n        var storage = getStorage(settings.localCache),\n            hourstl = settings.cacheTTL || 5,\n            cacheKey = genCacheKey(url, settings),\n            cacheValid = settings.isCacheValid,\n            ttl,\n            value,\n            dataType;\n\n        if (!storage) return fetch(url, settings);\n\n        ttl = storage.getItem(cacheKey + 'cachettl');\n\n        if (cacheValid && typeof cacheValid === 'function' && !cacheValid()) {\n            removeFromStorage(storage, cacheKey);\n            ttl = 0;\n        }\n\n        if (ttl && ttl \u003C +new Date()) {\n            removeFromStorage(storage, cacheKey);\n        }\n\n        value = storage.getItem(cacheKey);\n\n        if (!value) {\n            /* If not cached, we'll make the request and add a then block to the resulting promise,\n             in which we'll cache the result. */\n            return fetch(url, settings).then(cacheResponse.bind(null, cacheKey, storage, hourstl));\n        }\n\n        /* Value is cached, so we'll simply create and respond with a promise of our own,\n         and provide a response object. */\n        dataType = storage.getItem(cacheKey + 'dataType') || 'text/plain';\n        return provideResponse(value, dataType);\n    };\n})(self.fetch);\n",[14941],{"type":21,"tag":63,"props":14942,"children":14943},{"__ignoreMap":8},[14944,14951,14959,14967,14975,14983,14991,14998,15021,15029,15037,15066,15073,15080,15088,15096,15104,15120,15127,15161,15233,15250,15257,15321,15328,15335,15342,15350,15358,15366,15373,15394,15410,15417,15441,15473,15506,15558,15593,15605,15612,15643,15655,15662,15669,15676,15684,15691,15711,15731,15738,15770,15788,15815,15842,15849,15856,15863,15871,15879,15887,15894,15917,15925,15948,15956,15979,15987,16006,16013,16060,16087,16139,16146,16186,16198,16214,16285,16312,16328,16336,16348,16375,16382,16389,16396,16407,16414,16421,16428,16436,16444,16451,16466,16481,16496,16503,16534,16561,16569,16577,16593,16609,16617,16629,16637,16644,16652,16659,16702,16714,16721,16728,16735,16742,16750,16758,16766,16779,16787,16796,16810,16819,16833,16847,16855,16896,16921,16952,16974,16992,17001,17009,17018,17026,17059,17067,17106,17114,17168,17180,17202,17210,17218,17257,17269,17277,17285,17310,17318,17339,17348,17357,17402,17410,17418,17427,17436,17484,17501,17509],{"type":21,"tag":209,"props":14945,"children":14946},{"class":211,"line":212},[14947],{"type":21,"tag":209,"props":14948,"children":14949},{"style":448},[14950],{"type":26,"value":731},{"type":21,"tag":209,"props":14952,"children":14953},{"class":211,"line":244},[14954],{"type":21,"tag":209,"props":14955,"children":14956},{"style":448},[14957],{"type":26,"value":14958}," * Copyright (c) Christopher Keefer, 2016.\n",{"type":21,"tag":209,"props":14960,"children":14961},{"class":211,"line":254},[14962],{"type":21,"tag":209,"props":14963,"children":14964},{"style":448},[14965],{"type":26,"value":14966}," * https://github.com/SaneMethod/fetchCache\n",{"type":21,"tag":209,"props":14968,"children":14969},{"class":211,"line":279},[14970],{"type":21,"tag":209,"props":14971,"children":14972},{"style":448},[14973],{"type":26,"value":14974}," *\n",{"type":21,"tag":209,"props":14976,"children":14977},{"class":211,"line":288},[14978],{"type":21,"tag":209,"props":14979,"children":14980},{"style":448},[14981],{"type":26,"value":14982}," * Override fetch in the global context to allow us to cache the response to fetch in a Storage interface\n",{"type":21,"tag":209,"props":14984,"children":14985},{"class":211,"line":307},[14986],{"type":21,"tag":209,"props":14987,"children":14988},{"style":448},[14989],{"type":26,"value":14990}," * implementing object (such as localStorage).\n",{"type":21,"tag":209,"props":14992,"children":14993},{"class":211,"line":325},[14994],{"type":21,"tag":209,"props":14995,"children":14996},{"style":448},[14997],{"type":26,"value":755},{"type":21,"tag":209,"props":14999,"children":15000},{"class":211,"line":334},[15001,15005,15009,15013,15017],{"type":21,"tag":209,"props":15002,"children":15003},{"style":222},[15004],{"type":26,"value":368},{"type":21,"tag":209,"props":15006,"children":15007},{"style":216},[15008],{"type":26,"value":5370},{"type":21,"tag":209,"props":15010,"children":15011},{"style":222},[15012],{"type":26,"value":4776},{"type":21,"tag":209,"props":15014,"children":15015},{"style":400},[15016],{"type":26,"value":12634},{"type":21,"tag":209,"props":15018,"children":15019},{"style":222},[15020],{"type":26,"value":4786},{"type":21,"tag":209,"props":15022,"children":15023},{"class":211,"line":343},[15024],{"type":21,"tag":209,"props":15025,"children":15026},{"style":448},[15027],{"type":26,"value":15028},"    /* If the context doesn't support fetch, we won't attempt to patch in our\n",{"type":21,"tag":209,"props":15030,"children":15031},{"class":211,"line":351},[15032],{"type":21,"tag":209,"props":15033,"children":15034},{"style":448},[15035],{"type":26,"value":15036},"     caching using fetch, for obvious reasons. */\n",{"type":21,"tag":209,"props":15038,"children":15039},{"class":211,"line":444},[15040,15044,15048,15053,15058,15062],{"type":21,"tag":209,"props":15041,"children":15042},{"style":216},[15043],{"type":26,"value":10853},{"type":21,"tag":209,"props":15045,"children":15046},{"style":222},[15047],{"type":26,"value":4776},{"type":21,"tag":209,"props":15049,"children":15050},{"style":216},[15051],{"type":26,"value":15052},"!",{"type":21,"tag":209,"props":15054,"children":15055},{"style":222},[15056],{"type":26,"value":15057},"fetch) ",{"type":21,"tag":209,"props":15059,"children":15060},{"style":216},[15061],{"type":26,"value":5813},{"type":21,"tag":209,"props":15063,"children":15064},{"style":222},[15065],{"type":26,"value":241},{"type":21,"tag":209,"props":15067,"children":15068},{"class":211,"line":454},[15069],{"type":21,"tag":209,"props":15070,"children":15071},{"emptyLinePlaceholder":248},[15072],{"type":26,"value":251},{"type":21,"tag":209,"props":15074,"children":15075},{"class":211,"line":463},[15076],{"type":21,"tag":209,"props":15077,"children":15078},{"style":448},[15079],{"type":26,"value":4697},{"type":21,"tag":209,"props":15081,"children":15082},{"class":211,"line":472},[15083],{"type":21,"tag":209,"props":15084,"children":15085},{"style":448},[15086],{"type":26,"value":15087},"     * Generate the cache key under which to store the local data - either the cache key supplied,\n",{"type":21,"tag":209,"props":15089,"children":15090},{"class":211,"line":480},[15091],{"type":21,"tag":209,"props":15092,"children":15093},{"style":448},[15094],{"type":26,"value":15095},"     * or one generated from the url, the Content-type header (if specified) and the body (if specified).\n",{"type":21,"tag":209,"props":15097,"children":15098},{"class":211,"line":489},[15099],{"type":21,"tag":209,"props":15100,"children":15101},{"style":448},[15102],{"type":26,"value":15103},"     *\n",{"type":21,"tag":209,"props":15105,"children":15106},{"class":211,"line":847},[15107,15111,15115],{"type":21,"tag":209,"props":15108,"children":15109},{"style":448},[15110],{"type":26,"value":4713},{"type":21,"tag":209,"props":15112,"children":15113},{"style":216},[15114],{"type":26,"value":4740},{"type":21,"tag":209,"props":15116,"children":15117},{"style":360},[15118],{"type":26,"value":15119}," {string}\n",{"type":21,"tag":209,"props":15121,"children":15122},{"class":211,"line":860},[15123],{"type":21,"tag":209,"props":15124,"children":15125},{"style":448},[15126],{"type":26,"value":4753},{"type":21,"tag":209,"props":15128,"children":15129},{"class":211,"line":877},[15130,15134,15139,15143,15148,15152,15157],{"type":21,"tag":209,"props":15131,"children":15132},{"style":216},[15133],{"type":26,"value":2981},{"type":21,"tag":209,"props":15135,"children":15136},{"style":360},[15137],{"type":26,"value":15138}," genCacheKey",{"type":21,"tag":209,"props":15140,"children":15141},{"style":222},[15142],{"type":26,"value":368},{"type":21,"tag":209,"props":15144,"children":15145},{"style":400},[15146],{"type":26,"value":15147},"url",{"type":21,"tag":209,"props":15149,"children":15150},{"style":222},[15151],{"type":26,"value":408},{"type":21,"tag":209,"props":15153,"children":15154},{"style":400},[15155],{"type":26,"value":15156},"settings",{"type":21,"tag":209,"props":15158,"children":15159},{"style":222},[15160],{"type":26,"value":4786},{"type":21,"tag":209,"props":15162,"children":15163},{"class":211,"line":889},[15164,15168,15172,15177,15182,15187,15192,15196,15200,15205,15209,15214,15219,15224,15228],{"type":21,"tag":209,"props":15165,"children":15166},{"style":216},[15167],{"type":26,"value":5925},{"type":21,"tag":209,"props":15169,"children":15170},{"style":222},[15171],{"type":26,"value":1282},{"type":21,"tag":209,"props":15173,"children":15174},{"style":400},[15175],{"type":26,"value":15176},"headers",{"type":21,"tag":209,"props":15178,"children":15179},{"style":222},[15180],{"type":26,"value":15181},":{",{"type":21,"tag":209,"props":15183,"children":15184},{"style":233},[15185],{"type":26,"value":15186},"'Content-type'",{"type":21,"tag":209,"props":15188,"children":15189},{"style":222},[15190],{"type":26,"value":15191},": type}} ",{"type":21,"tag":209,"props":15193,"children":15194},{"style":216},[15195],{"type":26,"value":1432},{"type":21,"tag":209,"props":15197,"children":15198},{"style":222},[15199],{"type":26,"value":4776},{"type":21,"tag":209,"props":15201,"children":15202},{"style":233},[15203],{"type":26,"value":15204},"'headers'",{"type":21,"tag":209,"props":15206,"children":15207},{"style":216},[15208],{"type":26,"value":10867},{"type":21,"tag":209,"props":15210,"children":15211},{"style":222},[15212],{"type":26,"value":15213}," settings) ",{"type":21,"tag":209,"props":15215,"children":15216},{"style":216},[15217],{"type":26,"value":15218},"?",{"type":21,"tag":209,"props":15220,"children":15221},{"style":222},[15222],{"type":26,"value":15223}," settings ",{"type":21,"tag":209,"props":15225,"children":15226},{"style":216},[15227],{"type":26,"value":191},{"type":21,"tag":209,"props":15229,"children":15230},{"style":222},[15231],{"type":26,"value":15232}," {headers: {}},\n",{"type":21,"tag":209,"props":15234,"children":15235},{"class":211,"line":902},[15236,15241,15245],{"type":21,"tag":209,"props":15237,"children":15238},{"style":222},[15239],{"type":26,"value":15240},"            {body} ",{"type":21,"tag":209,"props":15242,"children":15243},{"style":216},[15244],{"type":26,"value":1432},{"type":21,"tag":209,"props":15246,"children":15247},{"style":222},[15248],{"type":26,"value":15249}," settings;\n",{"type":21,"tag":209,"props":15251,"children":15252},{"class":211,"line":914},[15253],{"type":21,"tag":209,"props":15254,"children":15255},{"emptyLinePlaceholder":248},[15256],{"type":26,"value":251},{"type":21,"tag":209,"props":15258,"children":15259},{"class":211,"line":922},[15260,15264,15269,15273,15278,15282,15287,15291,15296,15300,15304,15309,15313,15317],{"type":21,"tag":209,"props":15261,"children":15262},{"style":216},[15263],{"type":26,"value":3069},{"type":21,"tag":209,"props":15265,"children":15266},{"style":222},[15267],{"type":26,"value":15268}," settings.cacheKey ",{"type":21,"tag":209,"props":15270,"children":15271},{"style":216},[15272],{"type":26,"value":4677},{"type":21,"tag":209,"props":15274,"children":15275},{"style":222},[15276],{"type":26,"value":15277}," url ",{"type":21,"tag":209,"props":15279,"children":15280},{"style":216},[15281],{"type":26,"value":10237},{"type":21,"tag":209,"props":15283,"children":15284},{"style":222},[15285],{"type":26,"value":15286}," (type ",{"type":21,"tag":209,"props":15288,"children":15289},{"style":216},[15290],{"type":26,"value":4677},{"type":21,"tag":209,"props":15292,"children":15293},{"style":233},[15294],{"type":26,"value":15295}," ''",{"type":21,"tag":209,"props":15297,"children":15298},{"style":222},[15299],{"type":26,"value":432},{"type":21,"tag":209,"props":15301,"children":15302},{"style":216},[15303],{"type":26,"value":10237},{"type":21,"tag":209,"props":15305,"children":15306},{"style":222},[15307],{"type":26,"value":15308}," (body ",{"type":21,"tag":209,"props":15310,"children":15311},{"style":216},[15312],{"type":26,"value":4677},{"type":21,"tag":209,"props":15314,"children":15315},{"style":233},[15316],{"type":26,"value":15295},{"type":21,"tag":209,"props":15318,"children":15319},{"style":222},[15320],{"type":26,"value":2608},{"type":21,"tag":209,"props":15322,"children":15323},{"class":211,"line":2312},[15324],{"type":21,"tag":209,"props":15325,"children":15326},{"style":222},[15327],{"type":26,"value":331},{"type":21,"tag":209,"props":15329,"children":15330},{"class":211,"line":2321},[15331],{"type":21,"tag":209,"props":15332,"children":15333},{"emptyLinePlaceholder":248},[15334],{"type":26,"value":251},{"type":21,"tag":209,"props":15336,"children":15337},{"class":211,"line":2372},[15338],{"type":21,"tag":209,"props":15339,"children":15340},{"style":448},[15341],{"type":26,"value":4697},{"type":21,"tag":209,"props":15343,"children":15344},{"class":211,"line":2381},[15345],{"type":21,"tag":209,"props":15346,"children":15347},{"style":448},[15348],{"type":26,"value":15349},"     * Determine whether we're using localStorage or, if the user has specified something other than a boolean\n",{"type":21,"tag":209,"props":15351,"children":15352},{"class":211,"line":2389},[15353],{"type":21,"tag":209,"props":15354,"children":15355},{"style":448},[15356],{"type":26,"value":15357},"     * value for options.localCache, whether the value appears to satisfy the plugin's requirements.\n",{"type":21,"tag":209,"props":15359,"children":15360},{"class":211,"line":2397},[15361],{"type":21,"tag":209,"props":15362,"children":15363},{"style":448},[15364],{"type":26,"value":15365},"     * Otherwise, throw a new TypeError indicating what type of value we expect.\n",{"type":21,"tag":209,"props":15367,"children":15368},{"class":211,"line":2406},[15369],{"type":21,"tag":209,"props":15370,"children":15371},{"style":448},[15372],{"type":26,"value":15103},{"type":21,"tag":209,"props":15374,"children":15375},{"class":211,"line":2415},[15376,15380,15384,15389],{"type":21,"tag":209,"props":15377,"children":15378},{"style":448},[15379],{"type":26,"value":4713},{"type":21,"tag":209,"props":15381,"children":15382},{"style":216},[15383],{"type":26,"value":4718},{"type":21,"tag":209,"props":15385,"children":15386},{"style":360},[15387],{"type":26,"value":15388}," {boolean|object}",{"type":21,"tag":209,"props":15390,"children":15391},{"style":222},[15392],{"type":26,"value":15393}," storage\n",{"type":21,"tag":209,"props":15395,"children":15396},{"class":211,"line":2424},[15397,15401,15405],{"type":21,"tag":209,"props":15398,"children":15399},{"style":448},[15400],{"type":26,"value":4713},{"type":21,"tag":209,"props":15402,"children":15403},{"style":216},[15404],{"type":26,"value":4740},{"type":21,"tag":209,"props":15406,"children":15407},{"style":360},[15408],{"type":26,"value":15409}," {boolean|object}\n",{"type":21,"tag":209,"props":15411,"children":15412},{"class":211,"line":2433},[15413],{"type":21,"tag":209,"props":15414,"children":15415},{"style":448},[15416],{"type":26,"value":4753},{"type":21,"tag":209,"props":15418,"children":15419},{"class":211,"line":2442},[15420,15424,15429,15433,15437],{"type":21,"tag":209,"props":15421,"children":15422},{"style":216},[15423],{"type":26,"value":2981},{"type":21,"tag":209,"props":15425,"children":15426},{"style":360},[15427],{"type":26,"value":15428}," getStorage",{"type":21,"tag":209,"props":15430,"children":15431},{"style":222},[15432],{"type":26,"value":368},{"type":21,"tag":209,"props":15434,"children":15435},{"style":400},[15436],{"type":26,"value":14166},{"type":21,"tag":209,"props":15438,"children":15439},{"style":222},[15440],{"type":26,"value":4786},{"type":21,"tag":209,"props":15442,"children":15443},{"class":211,"line":2471},[15444,15448,15452,15456,15461,15465,15469],{"type":21,"tag":209,"props":15445,"children":15446},{"style":216},[15447],{"type":26,"value":5803},{"type":21,"tag":209,"props":15449,"children":15450},{"style":222},[15451],{"type":26,"value":4776},{"type":21,"tag":209,"props":15453,"children":15454},{"style":216},[15455],{"type":26,"value":15052},{"type":21,"tag":209,"props":15457,"children":15458},{"style":222},[15459],{"type":26,"value":15460},"storage) ",{"type":21,"tag":209,"props":15462,"children":15463},{"style":216},[15464],{"type":26,"value":5813},{"type":21,"tag":209,"props":15466,"children":15467},{"style":263},[15468],{"type":26,"value":5455},{"type":21,"tag":209,"props":15470,"children":15471},{"style":222},[15472],{"type":26,"value":241},{"type":21,"tag":209,"props":15474,"children":15475},{"class":211,"line":2480},[15476,15480,15485,15489,15493,15497,15501],{"type":21,"tag":209,"props":15477,"children":15478},{"style":216},[15479],{"type":26,"value":5803},{"type":21,"tag":209,"props":15481,"children":15482},{"style":222},[15483],{"type":26,"value":15484}," (storage ",{"type":21,"tag":209,"props":15486,"children":15487},{"style":216},[15488],{"type":26,"value":6102},{"type":21,"tag":209,"props":15490,"children":15491},{"style":263},[15492],{"type":26,"value":6243},{"type":21,"tag":209,"props":15494,"children":15495},{"style":222},[15496],{"type":26,"value":432},{"type":21,"tag":209,"props":15498,"children":15499},{"style":216},[15500],{"type":26,"value":5813},{"type":21,"tag":209,"props":15502,"children":15503},{"style":222},[15504],{"type":26,"value":15505}," self.localStorage;\n",{"type":21,"tag":209,"props":15507,"children":15508},{"class":211,"line":2489},[15509,15513,15517,15521,15526,15530,15535,15540,15545,15549,15553],{"type":21,"tag":209,"props":15510,"children":15511},{"style":216},[15512],{"type":26,"value":5803},{"type":21,"tag":209,"props":15514,"children":15515},{"style":222},[15516],{"type":26,"value":4776},{"type":21,"tag":209,"props":15518,"children":15519},{"style":216},[15520],{"type":26,"value":6092},{"type":21,"tag":209,"props":15522,"children":15523},{"style":222},[15524],{"type":26,"value":15525}," storage ",{"type":21,"tag":209,"props":15527,"children":15528},{"style":216},[15529],{"type":26,"value":6102},{"type":21,"tag":209,"props":15531,"children":15532},{"style":233},[15533],{"type":26,"value":15534}," \"object\"",{"type":21,"tag":209,"props":15536,"children":15537},{"style":216},[15538],{"type":26,"value":15539}," &&",{"type":21,"tag":209,"props":15541,"children":15542},{"style":233},[15543],{"type":26,"value":15544}," 'getItem'",{"type":21,"tag":209,"props":15546,"children":15547},{"style":216},[15548],{"type":26,"value":10867},{"type":21,"tag":209,"props":15550,"children":15551},{"style":222},[15552],{"type":26,"value":15525},{"type":21,"tag":209,"props":15554,"children":15555},{"style":216},[15556],{"type":26,"value":15557},"&&\n",{"type":21,"tag":209,"props":15559,"children":15560},{"class":211,"line":2516},[15561,15566,15570,15574,15579,15584,15588],{"type":21,"tag":209,"props":15562,"children":15563},{"style":233},[15564],{"type":26,"value":15565},"            'removeItem'",{"type":21,"tag":209,"props":15567,"children":15568},{"style":216},[15569],{"type":26,"value":10867},{"type":21,"tag":209,"props":15571,"children":15572},{"style":222},[15573],{"type":26,"value":15525},{"type":21,"tag":209,"props":15575,"children":15576},{"style":216},[15577],{"type":26,"value":15578},"&&",{"type":21,"tag":209,"props":15580,"children":15581},{"style":233},[15582],{"type":26,"value":15583}," 'setItem'",{"type":21,"tag":209,"props":15585,"children":15586},{"style":216},[15587],{"type":26,"value":10867},{"type":21,"tag":209,"props":15589,"children":15590},{"style":222},[15591],{"type":26,"value":15592}," storage) {\n",{"type":21,"tag":209,"props":15594,"children":15595},{"class":211,"line":2525},[15596,15600],{"type":21,"tag":209,"props":15597,"children":15598},{"style":216},[15599],{"type":26,"value":5101},{"type":21,"tag":209,"props":15601,"children":15602},{"style":222},[15603],{"type":26,"value":15604}," storage;\n",{"type":21,"tag":209,"props":15606,"children":15607},{"class":211,"line":2533},[15608],{"type":21,"tag":209,"props":15609,"children":15610},{"style":222},[15611],{"type":26,"value":2235},{"type":21,"tag":209,"props":15613,"children":15614},{"class":211,"line":2542},[15615,15620,15624,15629,15633,15638],{"type":21,"tag":209,"props":15616,"children":15617},{"style":216},[15618],{"type":26,"value":15619},"        throw",{"type":21,"tag":209,"props":15621,"children":15622},{"style":216},[15623],{"type":26,"value":4667},{"type":21,"tag":209,"props":15625,"children":15626},{"style":360},[15627],{"type":26,"value":15628}," TypeError",{"type":21,"tag":209,"props":15630,"children":15631},{"style":222},[15632],{"type":26,"value":368},{"type":21,"tag":209,"props":15634,"children":15635},{"style":233},[15636],{"type":26,"value":15637},"\"localCache must either be a boolean value, \"",{"type":21,"tag":209,"props":15639,"children":15640},{"style":216},[15641],{"type":26,"value":15642}," +\n",{"type":21,"tag":209,"props":15644,"children":15645},{"class":211,"line":2550},[15646,15651],{"type":21,"tag":209,"props":15647,"children":15648},{"style":233},[15649],{"type":26,"value":15650},"            \"or an object which implements the Storage interface.\"",{"type":21,"tag":209,"props":15652,"children":15653},{"style":222},[15654],{"type":26,"value":2608},{"type":21,"tag":209,"props":15656,"children":15657},{"class":211,"line":2564},[15658],{"type":21,"tag":209,"props":15659,"children":15660},{"style":222},[15661],{"type":26,"value":331},{"type":21,"tag":209,"props":15663,"children":15664},{"class":211,"line":2611},[15665],{"type":21,"tag":209,"props":15666,"children":15667},{"emptyLinePlaceholder":248},[15668],{"type":26,"value":251},{"type":21,"tag":209,"props":15670,"children":15671},{"class":211,"line":2619},[15672],{"type":21,"tag":209,"props":15673,"children":15674},{"style":448},[15675],{"type":26,"value":4697},{"type":21,"tag":209,"props":15677,"children":15678},{"class":211,"line":2627},[15679],{"type":21,"tag":209,"props":15680,"children":15681},{"style":448},[15682],{"type":26,"value":15683},"     * Remove the item specified by cacheKey and its attendant meta items from storage.\n",{"type":21,"tag":209,"props":15685,"children":15686},{"class":211,"line":2636},[15687],{"type":21,"tag":209,"props":15688,"children":15689},{"style":448},[15690],{"type":26,"value":15103},{"type":21,"tag":209,"props":15692,"children":15693},{"class":211,"line":2644},[15694,15698,15702,15707],{"type":21,"tag":209,"props":15695,"children":15696},{"style":448},[15697],{"type":26,"value":4713},{"type":21,"tag":209,"props":15699,"children":15700},{"style":216},[15701],{"type":26,"value":4718},{"type":21,"tag":209,"props":15703,"children":15704},{"style":360},[15705],{"type":26,"value":15706}," {Storage|object}",{"type":21,"tag":209,"props":15708,"children":15709},{"style":222},[15710],{"type":26,"value":15393},{"type":21,"tag":209,"props":15712,"children":15713},{"class":211,"line":2657},[15714,15718,15722,15726],{"type":21,"tag":209,"props":15715,"children":15716},{"style":448},[15717],{"type":26,"value":4713},{"type":21,"tag":209,"props":15719,"children":15720},{"style":216},[15721],{"type":26,"value":4718},{"type":21,"tag":209,"props":15723,"children":15724},{"style":360},[15725],{"type":26,"value":4723},{"type":21,"tag":209,"props":15727,"children":15728},{"style":222},[15729],{"type":26,"value":15730}," cacheKey\n",{"type":21,"tag":209,"props":15732,"children":15733},{"class":211,"line":2728},[15734],{"type":21,"tag":209,"props":15735,"children":15736},{"style":448},[15737],{"type":26,"value":4753},{"type":21,"tag":209,"props":15739,"children":15740},{"class":211,"line":2758},[15741,15745,15750,15754,15758,15762,15766],{"type":21,"tag":209,"props":15742,"children":15743},{"style":216},[15744],{"type":26,"value":2981},{"type":21,"tag":209,"props":15746,"children":15747},{"style":360},[15748],{"type":26,"value":15749}," removeFromStorage",{"type":21,"tag":209,"props":15751,"children":15752},{"style":222},[15753],{"type":26,"value":368},{"type":21,"tag":209,"props":15755,"children":15756},{"style":400},[15757],{"type":26,"value":14166},{"type":21,"tag":209,"props":15759,"children":15760},{"style":222},[15761],{"type":26,"value":408},{"type":21,"tag":209,"props":15763,"children":15764},{"style":400},[15765],{"type":26,"value":14157},{"type":21,"tag":209,"props":15767,"children":15768},{"style":222},[15769],{"type":26,"value":4786},{"type":21,"tag":209,"props":15771,"children":15772},{"class":211,"line":2776},[15773,15778,15783],{"type":21,"tag":209,"props":15774,"children":15775},{"style":222},[15776],{"type":26,"value":15777},"        storage.",{"type":21,"tag":209,"props":15779,"children":15780},{"style":360},[15781],{"type":26,"value":15782},"removeItem",{"type":21,"tag":209,"props":15784,"children":15785},{"style":222},[15786],{"type":26,"value":15787},"(cacheKey);\n",{"type":21,"tag":209,"props":15789,"children":15790},{"class":211,"line":2785},[15791,15795,15799,15803,15807,15811],{"type":21,"tag":209,"props":15792,"children":15793},{"style":222},[15794],{"type":26,"value":15777},{"type":21,"tag":209,"props":15796,"children":15797},{"style":360},[15798],{"type":26,"value":15782},{"type":21,"tag":209,"props":15800,"children":15801},{"style":222},[15802],{"type":26,"value":14365},{"type":21,"tag":209,"props":15804,"children":15805},{"style":216},[15806],{"type":26,"value":10237},{"type":21,"tag":209,"props":15808,"children":15809},{"style":233},[15810],{"type":26,"value":14374},{"type":21,"tag":209,"props":15812,"children":15813},{"style":222},[15814],{"type":26,"value":2608},{"type":21,"tag":209,"props":15816,"children":15817},{"class":211,"line":2793},[15818,15822,15826,15830,15834,15838],{"type":21,"tag":209,"props":15819,"children":15820},{"style":222},[15821],{"type":26,"value":15777},{"type":21,"tag":209,"props":15823,"children":15824},{"style":360},[15825],{"type":26,"value":15782},{"type":21,"tag":209,"props":15827,"children":15828},{"style":222},[15829],{"type":26,"value":14365},{"type":21,"tag":209,"props":15831,"children":15832},{"style":216},[15833],{"type":26,"value":10237},{"type":21,"tag":209,"props":15835,"children":15836},{"style":233},[15837],{"type":26,"value":14453},{"type":21,"tag":209,"props":15839,"children":15840},{"style":222},[15841],{"type":26,"value":2608},{"type":21,"tag":209,"props":15843,"children":15844},{"class":211,"line":2801},[15845],{"type":21,"tag":209,"props":15846,"children":15847},{"style":222},[15848],{"type":26,"value":331},{"type":21,"tag":209,"props":15850,"children":15851},{"class":211,"line":2809},[15852],{"type":21,"tag":209,"props":15853,"children":15854},{"emptyLinePlaceholder":248},[15855],{"type":26,"value":251},{"type":21,"tag":209,"props":15857,"children":15858},{"class":211,"line":6219},[15859],{"type":21,"tag":209,"props":15860,"children":15861},{"style":448},[15862],{"type":26,"value":4697},{"type":21,"tag":209,"props":15864,"children":15865},{"class":211,"line":6228},[15866],{"type":21,"tag":209,"props":15867,"children":15868},{"style":448},[15869],{"type":26,"value":15870},"     * Cache the response into our storage object.\n",{"type":21,"tag":209,"props":15872,"children":15873},{"class":211,"line":6250},[15874],{"type":21,"tag":209,"props":15875,"children":15876},{"style":448},[15877],{"type":26,"value":15878},"     * We clone the response so that we can drain the stream without making it\n",{"type":21,"tag":209,"props":15880,"children":15881},{"class":211,"line":6258},[15882],{"type":21,"tag":209,"props":15883,"children":15884},{"style":448},[15885],{"type":26,"value":15886},"     * unavailable to future handlers.\n",{"type":21,"tag":209,"props":15888,"children":15889},{"class":211,"line":6267},[15890],{"type":21,"tag":209,"props":15891,"children":15892},{"style":448},[15893],{"type":26,"value":15103},{"type":21,"tag":209,"props":15895,"children":15896},{"class":211,"line":6303},[15897,15901,15905,15909,15913],{"type":21,"tag":209,"props":15898,"children":15899},{"style":448},[15900],{"type":26,"value":4713},{"type":21,"tag":209,"props":15902,"children":15903},{"style":216},[15904],{"type":26,"value":4718},{"type":21,"tag":209,"props":15906,"children":15907},{"style":360},[15908],{"type":26,"value":4723},{"type":21,"tag":209,"props":15910,"children":15911},{"style":222},[15912],{"type":26,"value":14026},{"type":21,"tag":209,"props":15914,"children":15915},{"style":448},[15916],{"type":26,"value":14031},{"type":21,"tag":209,"props":15918,"children":15919},{"class":211,"line":6336},[15920],{"type":21,"tag":209,"props":15921,"children":15922},{"style":448},[15923],{"type":26,"value":15924},"     * fetch override.\n",{"type":21,"tag":209,"props":15926,"children":15927},{"class":211,"line":6369},[15928,15932,15936,15940,15944],{"type":21,"tag":209,"props":15929,"children":15930},{"style":448},[15931],{"type":26,"value":4713},{"type":21,"tag":209,"props":15933,"children":15934},{"style":216},[15935],{"type":26,"value":4718},{"type":21,"tag":209,"props":15937,"children":15938},{"style":360},[15939],{"type":26,"value":14055},{"type":21,"tag":209,"props":15941,"children":15942},{"style":222},[15943],{"type":26,"value":14060},{"type":21,"tag":209,"props":15945,"children":15946},{"style":448},[15947],{"type":26,"value":14065},{"type":21,"tag":209,"props":15949,"children":15950},{"class":211,"line":6378},[15951],{"type":21,"tag":209,"props":15952,"children":15953},{"style":448},[15954],{"type":26,"value":15955},"     * (text or json exclusively) in. Bound in fetch override.\n",{"type":21,"tag":209,"props":15957,"children":15958},{"class":211,"line":6387},[15959,15963,15967,15971,15975],{"type":21,"tag":209,"props":15960,"children":15961},{"style":448},[15962],{"type":26,"value":4713},{"type":21,"tag":209,"props":15964,"children":15965},{"style":216},[15966],{"type":26,"value":4718},{"type":21,"tag":209,"props":15968,"children":15969},{"style":360},[15970],{"type":26,"value":14089},{"type":21,"tag":209,"props":15972,"children":15973},{"style":222},[15974],{"type":26,"value":14094},{"type":21,"tag":209,"props":15976,"children":15977},{"style":448},[15978],{"type":26,"value":14099},{"type":21,"tag":209,"props":15980,"children":15981},{"class":211,"line":6395},[15982],{"type":21,"tag":209,"props":15983,"children":15984},{"style":448},[15985],{"type":26,"value":15986},"     * Bound in fetch override.\n",{"type":21,"tag":209,"props":15988,"children":15989},{"class":211,"line":6404},[15990,15994,15998,16002],{"type":21,"tag":209,"props":15991,"children":15992},{"style":448},[15993],{"type":26,"value":4713},{"type":21,"tag":209,"props":15995,"children":15996},{"style":216},[15997],{"type":26,"value":4718},{"type":21,"tag":209,"props":15999,"children":16000},{"style":360},[16001],{"type":26,"value":14123},{"type":21,"tag":209,"props":16003,"children":16004},{"style":222},[16005],{"type":26,"value":14128},{"type":21,"tag":209,"props":16007,"children":16008},{"class":211,"line":6413},[16009],{"type":21,"tag":209,"props":16010,"children":16011},{"style":448},[16012],{"type":26,"value":4753},{"type":21,"tag":209,"props":16014,"children":16015},{"class":211,"line":6447},[16016,16020,16024,16028,16032,16036,16040,16044,16048,16052,16056],{"type":21,"tag":209,"props":16017,"children":16018},{"style":216},[16019],{"type":26,"value":2981},{"type":21,"tag":209,"props":16021,"children":16022},{"style":360},[16023],{"type":26,"value":14148},{"type":21,"tag":209,"props":16025,"children":16026},{"style":222},[16027],{"type":26,"value":368},{"type":21,"tag":209,"props":16029,"children":16030},{"style":400},[16031],{"type":26,"value":14157},{"type":21,"tag":209,"props":16033,"children":16034},{"style":222},[16035],{"type":26,"value":408},{"type":21,"tag":209,"props":16037,"children":16038},{"style":400},[16039],{"type":26,"value":14166},{"type":21,"tag":209,"props":16041,"children":16042},{"style":222},[16043],{"type":26,"value":408},{"type":21,"tag":209,"props":16045,"children":16046},{"style":400},[16047],{"type":26,"value":14175},{"type":21,"tag":209,"props":16049,"children":16050},{"style":222},[16051],{"type":26,"value":408},{"type":21,"tag":209,"props":16053,"children":16054},{"style":400},[16055],{"type":26,"value":12498},{"type":21,"tag":209,"props":16057,"children":16058},{"style":222},[16059],{"type":26,"value":4786},{"type":21,"tag":209,"props":16061,"children":16062},{"class":211,"line":6479},[16063,16067,16071,16075,16079,16083],{"type":21,"tag":209,"props":16064,"children":16065},{"style":216},[16066],{"type":26,"value":5925},{"type":21,"tag":209,"props":16068,"children":16069},{"style":222},[16070],{"type":26,"value":14199},{"type":21,"tag":209,"props":16072,"children":16073},{"style":216},[16074],{"type":26,"value":1432},{"type":21,"tag":209,"props":16076,"children":16077},{"style":222},[16078],{"type":26,"value":14208},{"type":21,"tag":209,"props":16080,"children":16081},{"style":360},[16082],{"type":26,"value":14213},{"type":21,"tag":209,"props":16084,"children":16085},{"style":222},[16086],{"type":26,"value":5405},{"type":21,"tag":209,"props":16088,"children":16089},{"class":211,"line":6511},[16090,16095,16099,16103,16107,16111,16115,16119,16123,16127,16131,16135],{"type":21,"tag":209,"props":16091,"children":16092},{"style":222},[16093],{"type":26,"value":16094},"            dataType ",{"type":21,"tag":209,"props":16096,"children":16097},{"style":216},[16098],{"type":26,"value":1432},{"type":21,"tag":209,"props":16100,"children":16101},{"style":222},[16102],{"type":26,"value":14234},{"type":21,"tag":209,"props":16104,"children":16105},{"style":360},[16106],{"type":26,"value":6663},{"type":21,"tag":209,"props":16108,"children":16109},{"style":222},[16110],{"type":26,"value":368},{"type":21,"tag":209,"props":16112,"children":16113},{"style":233},[16114],{"type":26,"value":14247},{"type":21,"tag":209,"props":16116,"children":16117},{"style":222},[16118],{"type":26,"value":432},{"type":21,"tag":209,"props":16120,"children":16121},{"style":216},[16122],{"type":26,"value":4677},{"type":21,"tag":209,"props":16124,"children":16125},{"style":233},[16126],{"type":26,"value":14260},{"type":21,"tag":209,"props":16128,"children":16129},{"style":222},[16130],{"type":26,"value":2699},{"type":21,"tag":209,"props":16132,"children":16133},{"style":360},[16134],{"type":26,"value":14269},{"type":21,"tag":209,"props":16136,"children":16137},{"style":222},[16138],{"type":26,"value":4842},{"type":21,"tag":209,"props":16140,"children":16141},{"class":211,"line":6519},[16142],{"type":21,"tag":209,"props":16143,"children":16144},{"emptyLinePlaceholder":248},[16145],{"type":26,"value":251},{"type":21,"tag":209,"props":16147,"children":16148},{"class":211,"line":6527},[16149,16154,16158,16162,16166,16170,16174,16178,16182],{"type":21,"tag":209,"props":16150,"children":16151},{"style":222},[16152],{"type":26,"value":16153},"        cres.",{"type":21,"tag":209,"props":16155,"children":16156},{"style":360},[16157],{"type":26,"value":26},{"type":21,"tag":209,"props":16159,"children":16160},{"style":222},[16161],{"type":26,"value":11910},{"type":21,"tag":209,"props":16163,"children":16164},{"style":360},[16165],{"type":26,"value":2704},{"type":21,"tag":209,"props":16167,"children":16168},{"style":222},[16169],{"type":26,"value":2709},{"type":21,"tag":209,"props":16171,"children":16172},{"style":400},[16173],{"type":26,"value":26},{"type":21,"tag":209,"props":16175,"children":16176},{"style":222},[16177],{"type":26,"value":432},{"type":21,"tag":209,"props":16179,"children":16180},{"style":216},[16181],{"type":26,"value":437},{"type":21,"tag":209,"props":16183,"children":16184},{"style":222},[16185],{"type":26,"value":276},{"type":21,"tag":209,"props":16187,"children":16188},{"class":211,"line":6535},[16189,16194],{"type":21,"tag":209,"props":16190,"children":16191},{"style":216},[16192],{"type":26,"value":16193},"            try",{"type":21,"tag":209,"props":16195,"children":16196},{"style":222},[16197],{"type":26,"value":276},{"type":21,"tag":209,"props":16199,"children":16200},{"class":211,"line":6543},[16201,16206,16210],{"type":21,"tag":209,"props":16202,"children":16203},{"style":222},[16204],{"type":26,"value":16205},"                storage.",{"type":21,"tag":209,"props":16207,"children":16208},{"style":360},[16209],{"type":26,"value":14344},{"type":21,"tag":209,"props":16211,"children":16212},{"style":222},[16213],{"type":26,"value":14349},{"type":21,"tag":209,"props":16215,"children":16216},{"class":211,"line":6552},[16217,16221,16225,16229,16233,16237,16241,16245,16249,16253,16257,16261,16265,16269,16273,16277,16281],{"type":21,"tag":209,"props":16218,"children":16219},{"style":222},[16220],{"type":26,"value":16205},{"type":21,"tag":209,"props":16222,"children":16223},{"style":360},[16224],{"type":26,"value":14344},{"type":21,"tag":209,"props":16226,"children":16227},{"style":222},[16228],{"type":26,"value":14365},{"type":21,"tag":209,"props":16230,"children":16231},{"style":216},[16232],{"type":26,"value":10237},{"type":21,"tag":209,"props":16234,"children":16235},{"style":233},[16236],{"type":26,"value":14374},{"type":21,"tag":209,"props":16238,"children":16239},{"style":222},[16240],{"type":26,"value":408},{"type":21,"tag":209,"props":16242,"children":16243},{"style":216},[16244],{"type":26,"value":14383},{"type":21,"tag":209,"props":16246,"children":16247},{"style":360},[16248],{"type":26,"value":14388},{"type":21,"tag":209,"props":16250,"children":16251},{"style":222},[16252],{"type":26,"value":14393},{"type":21,"tag":209,"props":16254,"children":16255},{"style":216},[16256],{"type":26,"value":10237},{"type":21,"tag":209,"props":16258,"children":16259},{"style":263},[16260],{"type":26,"value":14402},{"type":21,"tag":209,"props":16262,"children":16263},{"style":216},[16264],{"type":26,"value":14407},{"type":21,"tag":209,"props":16266,"children":16267},{"style":263},[16268],{"type":26,"value":14412},{"type":21,"tag":209,"props":16270,"children":16271},{"style":216},[16272],{"type":26,"value":14407},{"type":21,"tag":209,"props":16274,"children":16275},{"style":263},[16276],{"type":26,"value":14412},{"type":21,"tag":209,"props":16278,"children":16279},{"style":216},[16280],{"type":26,"value":14407},{"type":21,"tag":209,"props":16282,"children":16283},{"style":222},[16284],{"type":26,"value":14429},{"type":21,"tag":209,"props":16286,"children":16287},{"class":211,"line":6572},[16288,16292,16296,16300,16304,16308],{"type":21,"tag":209,"props":16289,"children":16290},{"style":222},[16291],{"type":26,"value":16205},{"type":21,"tag":209,"props":16293,"children":16294},{"style":360},[16295],{"type":26,"value":14344},{"type":21,"tag":209,"props":16297,"children":16298},{"style":222},[16299],{"type":26,"value":14365},{"type":21,"tag":209,"props":16301,"children":16302},{"style":216},[16303],{"type":26,"value":10237},{"type":21,"tag":209,"props":16305,"children":16306},{"style":233},[16307],{"type":26,"value":14453},{"type":21,"tag":209,"props":16309,"children":16310},{"style":222},[16311],{"type":26,"value":14458},{"type":21,"tag":209,"props":16313,"children":16314},{"class":211,"line":6589},[16315,16320,16324],{"type":21,"tag":209,"props":16316,"children":16317},{"style":222},[16318],{"type":26,"value":16319},"            } ",{"type":21,"tag":209,"props":16321,"children":16322},{"style":216},[16323],{"type":26,"value":6823},{"type":21,"tag":209,"props":16325,"children":16326},{"style":222},[16327],{"type":26,"value":6828},{"type":21,"tag":209,"props":16329,"children":16330},{"class":211,"line":6597},[16331],{"type":21,"tag":209,"props":16332,"children":16333},{"style":448},[16334],{"type":26,"value":16335},"                // Remove any incomplete data that may have been saved before the exception was caught\n",{"type":21,"tag":209,"props":16337,"children":16338},{"class":211,"line":6625},[16339,16344],{"type":21,"tag":209,"props":16340,"children":16341},{"style":360},[16342],{"type":26,"value":16343},"                removeFromStorage",{"type":21,"tag":209,"props":16345,"children":16346},{"style":222},[16347],{"type":26,"value":14494},{"type":21,"tag":209,"props":16349,"children":16350},{"class":211,"line":6648},[16351,16355,16359,16363,16367,16371],{"type":21,"tag":209,"props":16352,"children":16353},{"style":222},[16354],{"type":26,"value":2764},{"type":21,"tag":209,"props":16356,"children":16357},{"style":360},[16358],{"type":26,"value":1059},{"type":21,"tag":209,"props":16360,"children":16361},{"style":222},[16362],{"type":26,"value":368},{"type":21,"tag":209,"props":16364,"children":16365},{"style":233},[16366],{"type":26,"value":14514},{"type":21,"tag":209,"props":16368,"children":16369},{"style":216},[16370],{"type":26,"value":10659},{"type":21,"tag":209,"props":16372,"children":16373},{"style":222},[16374],{"type":26,"value":14523},{"type":21,"tag":209,"props":16376,"children":16377},{"class":211,"line":6670},[16378],{"type":21,"tag":209,"props":16379,"children":16380},{"style":222},[16381],{"type":26,"value":6136},{"type":21,"tag":209,"props":16383,"children":16384},{"class":211,"line":6678},[16385],{"type":21,"tag":209,"props":16386,"children":16387},{"style":222},[16388],{"type":26,"value":5114},{"type":21,"tag":209,"props":16390,"children":16391},{"class":211,"line":6686},[16392],{"type":21,"tag":209,"props":16393,"children":16394},{"emptyLinePlaceholder":248},[16395],{"type":26,"value":251},{"type":21,"tag":209,"props":16397,"children":16398},{"class":211,"line":6714},[16399,16403],{"type":21,"tag":209,"props":16400,"children":16401},{"style":216},[16402],{"type":26,"value":3069},{"type":21,"tag":209,"props":16404,"children":16405},{"style":222},[16406],{"type":26,"value":14556},{"type":21,"tag":209,"props":16408,"children":16409},{"class":211,"line":6747},[16410],{"type":21,"tag":209,"props":16411,"children":16412},{"style":222},[16413],{"type":26,"value":331},{"type":21,"tag":209,"props":16415,"children":16416},{"class":211,"line":6761},[16417],{"type":21,"tag":209,"props":16418,"children":16419},{"emptyLinePlaceholder":248},[16420],{"type":26,"value":251},{"type":21,"tag":209,"props":16422,"children":16423},{"class":211,"line":6769},[16424],{"type":21,"tag":209,"props":16425,"children":16426},{"style":448},[16427],{"type":26,"value":4697},{"type":21,"tag":209,"props":16429,"children":16430},{"class":211,"line":6782},[16431],{"type":21,"tag":209,"props":16432,"children":16433},{"style":448},[16434],{"type":26,"value":16435},"     * Create a new response containing the cached value, and return a promise\n",{"type":21,"tag":209,"props":16437,"children":16438},{"class":211,"line":6812},[16439],{"type":21,"tag":209,"props":16440,"children":16441},{"style":448},[16442],{"type":26,"value":16443},"     * that resolves with this response.\n",{"type":21,"tag":209,"props":16445,"children":16446},{"class":211,"line":6831},[16447],{"type":21,"tag":209,"props":16448,"children":16449},{"style":448},[16450],{"type":26,"value":15103},{"type":21,"tag":209,"props":16452,"children":16453},{"class":211,"line":6840},[16454,16458,16462],{"type":21,"tag":209,"props":16455,"children":16456},{"style":448},[16457],{"type":26,"value":4713},{"type":21,"tag":209,"props":16459,"children":16460},{"style":216},[16461],{"type":26,"value":4718},{"type":21,"tag":209,"props":16463,"children":16464},{"style":222},[16465],{"type":26,"value":14635},{"type":21,"tag":209,"props":16467,"children":16468},{"class":211,"line":6864},[16469,16473,16477],{"type":21,"tag":209,"props":16470,"children":16471},{"style":448},[16472],{"type":26,"value":4713},{"type":21,"tag":209,"props":16474,"children":16475},{"style":216},[16476],{"type":26,"value":4718},{"type":21,"tag":209,"props":16478,"children":16479},{"style":222},[16480],{"type":26,"value":14651},{"type":21,"tag":209,"props":16482,"children":16483},{"class":211,"line":6872},[16484,16488,16492],{"type":21,"tag":209,"props":16485,"children":16486},{"style":448},[16487],{"type":26,"value":4713},{"type":21,"tag":209,"props":16489,"children":16490},{"style":216},[16491],{"type":26,"value":4740},{"type":21,"tag":209,"props":16493,"children":16494},{"style":360},[16495],{"type":26,"value":14667},{"type":21,"tag":209,"props":16497,"children":16498},{"class":211,"line":6880},[16499],{"type":21,"tag":209,"props":16500,"children":16501},{"style":448},[16502],{"type":26,"value":4753},{"type":21,"tag":209,"props":16504,"children":16505},{"class":211,"line":6899},[16506,16510,16514,16518,16522,16526,16530],{"type":21,"tag":209,"props":16507,"children":16508},{"style":216},[16509],{"type":26,"value":2981},{"type":21,"tag":209,"props":16511,"children":16512},{"style":360},[16513],{"type":26,"value":14686},{"type":21,"tag":209,"props":16515,"children":16516},{"style":222},[16517],{"type":26,"value":368},{"type":21,"tag":209,"props":16519,"children":16520},{"style":400},[16521],{"type":26,"value":14695},{"type":21,"tag":209,"props":16523,"children":16524},{"style":222},[16525],{"type":26,"value":408},{"type":21,"tag":209,"props":16527,"children":16528},{"style":400},[16529],{"type":26,"value":14704},{"type":21,"tag":209,"props":16531,"children":16532},{"style":222},[16533],{"type":26,"value":4786},{"type":21,"tag":209,"props":16535,"children":16536},{"class":211,"line":6907},[16537,16541,16545,16549,16553,16557],{"type":21,"tag":209,"props":16538,"children":16539},{"style":216},[16540],{"type":26,"value":5925},{"type":21,"tag":209,"props":16542,"children":16543},{"style":222},[16544],{"type":26,"value":12514},{"type":21,"tag":209,"props":16546,"children":16547},{"style":216},[16548],{"type":26,"value":1432},{"type":21,"tag":209,"props":16550,"children":16551},{"style":216},[16552],{"type":26,"value":4667},{"type":21,"tag":209,"props":16554,"children":16555},{"style":360},[16556],{"type":26,"value":14732},{"type":21,"tag":209,"props":16558,"children":16559},{"style":222},[16560],{"type":26,"value":11597},{"type":21,"tag":209,"props":16562,"children":16563},{"class":211,"line":6919},[16564],{"type":21,"tag":209,"props":16565,"children":16566},{"style":222},[16567],{"type":26,"value":16568},"            value,\n",{"type":21,"tag":209,"props":16570,"children":16571},{"class":211,"line":6927},[16572],{"type":21,"tag":209,"props":16573,"children":16574},{"style":222},[16575],{"type":26,"value":16576},"            {\n",{"type":21,"tag":209,"props":16578,"children":16579},{"class":211,"line":6935},[16580,16585,16589],{"type":21,"tag":209,"props":16581,"children":16582},{"style":222},[16583],{"type":26,"value":16584},"                status: ",{"type":21,"tag":209,"props":16586,"children":16587},{"style":263},[16588],{"type":26,"value":14764},{"type":21,"tag":209,"props":16590,"children":16591},{"style":222},[16592],{"type":26,"value":304},{"type":21,"tag":209,"props":16594,"children":16595},{"class":211,"line":6943},[16596,16601,16605],{"type":21,"tag":209,"props":16597,"children":16598},{"style":222},[16599],{"type":26,"value":16600},"                statusText: ",{"type":21,"tag":209,"props":16602,"children":16603},{"style":233},[16604],{"type":26,"value":14781},{"type":21,"tag":209,"props":16606,"children":16607},{"style":222},[16608],{"type":26,"value":304},{"type":21,"tag":209,"props":16610,"children":16611},{"class":211,"line":6952},[16612],{"type":21,"tag":209,"props":16613,"children":16614},{"style":222},[16615],{"type":26,"value":16616},"                headers: {\n",{"type":21,"tag":209,"props":16618,"children":16619},{"class":211,"line":6961},[16620,16625],{"type":21,"tag":209,"props":16621,"children":16622},{"style":233},[16623],{"type":26,"value":16624},"                    'Content-Type'",{"type":21,"tag":209,"props":16626,"children":16627},{"style":222},[16628],{"type":26,"value":14806},{"type":21,"tag":209,"props":16630,"children":16631},{"class":211,"line":6977},[16632],{"type":21,"tag":209,"props":16633,"children":16634},{"style":222},[16635],{"type":26,"value":16636},"                }\n",{"type":21,"tag":209,"props":16638,"children":16639},{"class":211,"line":6993},[16640],{"type":21,"tag":209,"props":16641,"children":16642},{"style":222},[16643],{"type":26,"value":6136},{"type":21,"tag":209,"props":16645,"children":16646},{"class":211,"line":7001},[16647],{"type":21,"tag":209,"props":16648,"children":16649},{"style":222},[16650],{"type":26,"value":16651},"        );\n",{"type":21,"tag":209,"props":16653,"children":16654},{"class":211,"line":7025},[16655],{"type":21,"tag":209,"props":16656,"children":16657},{"emptyLinePlaceholder":248},[16658],{"type":26,"value":251},{"type":21,"tag":209,"props":16660,"children":16661},{"class":211,"line":7066},[16662,16666,16670,16674,16678,16682,16686,16690,16694,16698],{"type":21,"tag":209,"props":16663,"children":16664},{"style":216},[16665],{"type":26,"value":3069},{"type":21,"tag":209,"props":16667,"children":16668},{"style":216},[16669],{"type":26,"value":4667},{"type":21,"tag":209,"props":16671,"children":16672},{"style":263},[16673],{"type":26,"value":5581},{"type":21,"tag":209,"props":16675,"children":16676},{"style":222},[16677],{"type":26,"value":368},{"type":21,"tag":209,"props":16679,"children":16680},{"style":216},[16681],{"type":26,"value":5370},{"type":21,"tag":209,"props":16683,"children":16684},{"style":222},[16685],{"type":26,"value":4776},{"type":21,"tag":209,"props":16687,"children":16688},{"style":400},[16689],{"type":26,"value":5590},{"type":21,"tag":209,"props":16691,"children":16692},{"style":222},[16693],{"type":26,"value":408},{"type":21,"tag":209,"props":16695,"children":16696},{"style":400},[16697],{"type":26,"value":5599},{"type":21,"tag":209,"props":16699,"children":16700},{"style":222},[16701],{"type":26,"value":4786},{"type":21,"tag":209,"props":16703,"children":16704},{"class":211,"line":7094},[16705,16710],{"type":21,"tag":209,"props":16706,"children":16707},{"style":360},[16708],{"type":26,"value":16709},"            resolve",{"type":21,"tag":209,"props":16711,"children":16712},{"style":222},[16713],{"type":26,"value":14890},{"type":21,"tag":209,"props":16715,"children":16716},{"class":211,"line":7110},[16717],{"type":21,"tag":209,"props":16718,"children":16719},{"style":222},[16720],{"type":26,"value":5114},{"type":21,"tag":209,"props":16722,"children":16723},{"class":211,"line":7126},[16724],{"type":21,"tag":209,"props":16725,"children":16726},{"style":222},[16727],{"type":26,"value":331},{"type":21,"tag":209,"props":16729,"children":16730},{"class":211,"line":7142},[16731],{"type":21,"tag":209,"props":16732,"children":16733},{"emptyLinePlaceholder":248},[16734],{"type":26,"value":251},{"type":21,"tag":209,"props":16736,"children":16737},{"class":211,"line":7150},[16738],{"type":21,"tag":209,"props":16739,"children":16740},{"style":448},[16741],{"type":26,"value":4697},{"type":21,"tag":209,"props":16743,"children":16744},{"class":211,"line":7162},[16745],{"type":21,"tag":209,"props":16746,"children":16747},{"style":448},[16748],{"type":26,"value":16749},"     * Override fetch on the global context, so that we can intercept\n",{"type":21,"tag":209,"props":16751,"children":16752},{"class":211,"line":7170},[16753],{"type":21,"tag":209,"props":16754,"children":16755},{"style":448},[16756],{"type":26,"value":16757},"     * fetch calls and respond with locally cached content, if available.\n",{"type":21,"tag":209,"props":16759,"children":16760},{"class":211,"line":7178},[16761],{"type":21,"tag":209,"props":16762,"children":16763},{"style":448},[16764],{"type":26,"value":16765},"     * New parameters available on the call to fetch:\n",{"type":21,"tag":209,"props":16767,"children":16768},{"class":211,"line":7186},[16769,16774],{"type":21,"tag":209,"props":16770,"children":16771},{"style":448},[16772],{"type":26,"value":16773},"     * localCache   : true",{"type":21,"tag":209,"props":16775,"children":16776},{"style":448},[16777],{"type":26,"value":16778}," // required - either a boolean (if true, localStorage is used,\n",{"type":21,"tag":209,"props":16780,"children":16781},{"class":211,"line":7199},[16782],{"type":21,"tag":209,"props":16783,"children":16784},{"style":448},[16785],{"type":26,"value":16786},"     * if false request is not cached or returned from cache), or an object implementing the\n",{"type":21,"tag":209,"props":16788,"children":16790},{"class":211,"line":16789},120,[16791],{"type":21,"tag":209,"props":16792,"children":16793},{"style":448},[16794],{"type":26,"value":16795},"     * Storage interface, in which case that object is used instead.\n",{"type":21,"tag":209,"props":16797,"children":16799},{"class":211,"line":16798},121,[16800,16805],{"type":21,"tag":209,"props":16801,"children":16802},{"style":448},[16803],{"type":26,"value":16804},"     * cacheTTL     : 5,",{"type":21,"tag":209,"props":16806,"children":16807},{"style":448},[16808],{"type":26,"value":16809}," // optional, cache time in hours, default is 5. Use float numbers for\n",{"type":21,"tag":209,"props":16811,"children":16813},{"class":211,"line":16812},122,[16814],{"type":21,"tag":209,"props":16815,"children":16816},{"style":448},[16817],{"type":26,"value":16818},"     * values less than a full hour (e.g. 0.5 for 1/2 hour).\n",{"type":21,"tag":209,"props":16820,"children":16822},{"class":211,"line":16821},123,[16823,16828],{"type":21,"tag":209,"props":16824,"children":16825},{"style":448},[16826],{"type":26,"value":16827},"     * cacheKey     : 'post',",{"type":21,"tag":209,"props":16829,"children":16830},{"style":448},[16831],{"type":26,"value":16832}," // optional - key under which cached string will be stored.\n",{"type":21,"tag":209,"props":16834,"children":16836},{"class":211,"line":16835},124,[16837,16842],{"type":21,"tag":209,"props":16838,"children":16839},{"style":448},[16840],{"type":26,"value":16841},"     * isCacheValid : function",{"type":21,"tag":209,"props":16843,"children":16844},{"style":448},[16845],{"type":26,"value":16846},"  // optional - return true for valid, false for invalid.\n",{"type":21,"tag":209,"props":16848,"children":16850},{"class":211,"line":16849},125,[16851],{"type":21,"tag":209,"props":16852,"children":16853},{"style":448},[16854],{"type":26,"value":4753},{"type":21,"tag":209,"props":16856,"children":16858},{"class":211,"line":16857},126,[16859,16864,16868,16872,16876,16880,16884,16888,16892],{"type":21,"tag":209,"props":16860,"children":16861},{"style":222},[16862],{"type":26,"value":16863},"    self.",{"type":21,"tag":209,"props":16865,"children":16866},{"style":360},[16867],{"type":26,"value":12634},{"type":21,"tag":209,"props":16869,"children":16870},{"style":216},[16871],{"type":26,"value":271},{"type":21,"tag":209,"props":16873,"children":16874},{"style":216},[16875],{"type":26,"value":4766},{"type":21,"tag":209,"props":16877,"children":16878},{"style":222},[16879],{"type":26,"value":4776},{"type":21,"tag":209,"props":16881,"children":16882},{"style":400},[16883],{"type":26,"value":15147},{"type":21,"tag":209,"props":16885,"children":16886},{"style":222},[16887],{"type":26,"value":408},{"type":21,"tag":209,"props":16889,"children":16890},{"style":400},[16891],{"type":26,"value":15156},{"type":21,"tag":209,"props":16893,"children":16894},{"style":222},[16895],{"type":26,"value":4786},{"type":21,"tag":209,"props":16897,"children":16899},{"class":211,"line":16898},127,[16900,16904,16908,16912,16916],{"type":21,"tag":209,"props":16901,"children":16902},{"style":216},[16903],{"type":26,"value":5925},{"type":21,"tag":209,"props":16905,"children":16906},{"style":222},[16907],{"type":26,"value":15525},{"type":21,"tag":209,"props":16909,"children":16910},{"style":216},[16911],{"type":26,"value":1432},{"type":21,"tag":209,"props":16913,"children":16914},{"style":360},[16915],{"type":26,"value":15428},{"type":21,"tag":209,"props":16917,"children":16918},{"style":222},[16919],{"type":26,"value":16920},"(settings.localCache),\n",{"type":21,"tag":209,"props":16922,"children":16924},{"class":211,"line":16923},128,[16925,16930,16934,16939,16943,16948],{"type":21,"tag":209,"props":16926,"children":16927},{"style":222},[16928],{"type":26,"value":16929},"            hourstl ",{"type":21,"tag":209,"props":16931,"children":16932},{"style":216},[16933],{"type":26,"value":1432},{"type":21,"tag":209,"props":16935,"children":16936},{"style":222},[16937],{"type":26,"value":16938}," settings.cacheTTL ",{"type":21,"tag":209,"props":16940,"children":16941},{"style":216},[16942],{"type":26,"value":4677},{"type":21,"tag":209,"props":16944,"children":16945},{"style":263},[16946],{"type":26,"value":16947}," 5",{"type":21,"tag":209,"props":16949,"children":16950},{"style":222},[16951],{"type":26,"value":304},{"type":21,"tag":209,"props":16953,"children":16955},{"class":211,"line":16954},129,[16956,16961,16965,16969],{"type":21,"tag":209,"props":16957,"children":16958},{"style":222},[16959],{"type":26,"value":16960},"            cacheKey ",{"type":21,"tag":209,"props":16962,"children":16963},{"style":216},[16964],{"type":26,"value":1432},{"type":21,"tag":209,"props":16966,"children":16967},{"style":360},[16968],{"type":26,"value":15138},{"type":21,"tag":209,"props":16970,"children":16971},{"style":222},[16972],{"type":26,"value":16973},"(url, settings),\n",{"type":21,"tag":209,"props":16975,"children":16977},{"class":211,"line":16976},130,[16978,16983,16987],{"type":21,"tag":209,"props":16979,"children":16980},{"style":222},[16981],{"type":26,"value":16982},"            cacheValid ",{"type":21,"tag":209,"props":16984,"children":16985},{"style":216},[16986],{"type":26,"value":1432},{"type":21,"tag":209,"props":16988,"children":16989},{"style":222},[16990],{"type":26,"value":16991}," settings.isCacheValid,\n",{"type":21,"tag":209,"props":16993,"children":16995},{"class":211,"line":16994},131,[16996],{"type":21,"tag":209,"props":16997,"children":16998},{"style":222},[16999],{"type":26,"value":17000},"            ttl,\n",{"type":21,"tag":209,"props":17002,"children":17004},{"class":211,"line":17003},132,[17005],{"type":21,"tag":209,"props":17006,"children":17007},{"style":222},[17008],{"type":26,"value":16568},{"type":21,"tag":209,"props":17010,"children":17012},{"class":211,"line":17011},133,[17013],{"type":21,"tag":209,"props":17014,"children":17015},{"style":222},[17016],{"type":26,"value":17017},"            dataType;\n",{"type":21,"tag":209,"props":17019,"children":17021},{"class":211,"line":17020},134,[17022],{"type":21,"tag":209,"props":17023,"children":17024},{"emptyLinePlaceholder":248},[17025],{"type":26,"value":251},{"type":21,"tag":209,"props":17027,"children":17029},{"class":211,"line":17028},135,[17030,17034,17038,17042,17046,17050,17054],{"type":21,"tag":209,"props":17031,"children":17032},{"style":216},[17033],{"type":26,"value":5803},{"type":21,"tag":209,"props":17035,"children":17036},{"style":222},[17037],{"type":26,"value":4776},{"type":21,"tag":209,"props":17039,"children":17040},{"style":216},[17041],{"type":26,"value":15052},{"type":21,"tag":209,"props":17043,"children":17044},{"style":222},[17045],{"type":26,"value":15460},{"type":21,"tag":209,"props":17047,"children":17048},{"style":216},[17049],{"type":26,"value":5813},{"type":21,"tag":209,"props":17051,"children":17052},{"style":360},[17053],{"type":26,"value":4811},{"type":21,"tag":209,"props":17055,"children":17056},{"style":222},[17057],{"type":26,"value":17058},"(url, settings);\n",{"type":21,"tag":209,"props":17060,"children":17062},{"class":211,"line":17061},136,[17063],{"type":21,"tag":209,"props":17064,"children":17065},{"emptyLinePlaceholder":248},[17066],{"type":26,"value":251},{"type":21,"tag":209,"props":17068,"children":17070},{"class":211,"line":17069},137,[17071,17076,17080,17085,17090,17094,17098,17102],{"type":21,"tag":209,"props":17072,"children":17073},{"style":222},[17074],{"type":26,"value":17075},"        ttl ",{"type":21,"tag":209,"props":17077,"children":17078},{"style":216},[17079],{"type":26,"value":1432},{"type":21,"tag":209,"props":17081,"children":17082},{"style":222},[17083],{"type":26,"value":17084}," storage.",{"type":21,"tag":209,"props":17086,"children":17087},{"style":360},[17088],{"type":26,"value":17089},"getItem",{"type":21,"tag":209,"props":17091,"children":17092},{"style":222},[17093],{"type":26,"value":14365},{"type":21,"tag":209,"props":17095,"children":17096},{"style":216},[17097],{"type":26,"value":10237},{"type":21,"tag":209,"props":17099,"children":17100},{"style":233},[17101],{"type":26,"value":14374},{"type":21,"tag":209,"props":17103,"children":17104},{"style":222},[17105],{"type":26,"value":2608},{"type":21,"tag":209,"props":17107,"children":17109},{"class":211,"line":17108},138,[17110],{"type":21,"tag":209,"props":17111,"children":17112},{"emptyLinePlaceholder":248},[17113],{"type":26,"value":251},{"type":21,"tag":209,"props":17115,"children":17117},{"class":211,"line":17116},139,[17118,17122,17127,17131,17136,17141,17145,17149,17153,17158,17163],{"type":21,"tag":209,"props":17119,"children":17120},{"style":216},[17121],{"type":26,"value":5803},{"type":21,"tag":209,"props":17123,"children":17124},{"style":222},[17125],{"type":26,"value":17126}," (cacheValid ",{"type":21,"tag":209,"props":17128,"children":17129},{"style":216},[17130],{"type":26,"value":15578},{"type":21,"tag":209,"props":17132,"children":17133},{"style":216},[17134],{"type":26,"value":17135}," typeof",{"type":21,"tag":209,"props":17137,"children":17138},{"style":222},[17139],{"type":26,"value":17140}," cacheValid ",{"type":21,"tag":209,"props":17142,"children":17143},{"style":216},[17144],{"type":26,"value":6102},{"type":21,"tag":209,"props":17146,"children":17147},{"style":233},[17148],{"type":26,"value":6107},{"type":21,"tag":209,"props":17150,"children":17151},{"style":216},[17152],{"type":26,"value":15539},{"type":21,"tag":209,"props":17154,"children":17155},{"style":216},[17156],{"type":26,"value":17157}," !",{"type":21,"tag":209,"props":17159,"children":17160},{"style":360},[17161],{"type":26,"value":17162},"cacheValid",{"type":21,"tag":209,"props":17164,"children":17165},{"style":222},[17166],{"type":26,"value":17167},"()) {\n",{"type":21,"tag":209,"props":17169,"children":17171},{"class":211,"line":17170},140,[17172,17176],{"type":21,"tag":209,"props":17173,"children":17174},{"style":360},[17175],{"type":26,"value":14489},{"type":21,"tag":209,"props":17177,"children":17178},{"style":222},[17179],{"type":26,"value":14494},{"type":21,"tag":209,"props":17181,"children":17183},{"class":211,"line":17182},141,[17184,17189,17193,17198],{"type":21,"tag":209,"props":17185,"children":17186},{"style":222},[17187],{"type":26,"value":17188},"            ttl ",{"type":21,"tag":209,"props":17190,"children":17191},{"style":216},[17192],{"type":26,"value":1432},{"type":21,"tag":209,"props":17194,"children":17195},{"style":263},[17196],{"type":26,"value":17197}," 0",{"type":21,"tag":209,"props":17199,"children":17200},{"style":222},[17201],{"type":26,"value":241},{"type":21,"tag":209,"props":17203,"children":17205},{"class":211,"line":17204},142,[17206],{"type":21,"tag":209,"props":17207,"children":17208},{"style":222},[17209],{"type":26,"value":2235},{"type":21,"tag":209,"props":17211,"children":17213},{"class":211,"line":17212},143,[17214],{"type":21,"tag":209,"props":17215,"children":17216},{"emptyLinePlaceholder":248},[17217],{"type":26,"value":251},{"type":21,"tag":209,"props":17219,"children":17221},{"class":211,"line":17220},144,[17222,17226,17231,17235,17240,17244,17249,17253],{"type":21,"tag":209,"props":17223,"children":17224},{"style":216},[17225],{"type":26,"value":5803},{"type":21,"tag":209,"props":17227,"children":17228},{"style":222},[17229],{"type":26,"value":17230}," (ttl ",{"type":21,"tag":209,"props":17232,"children":17233},{"style":216},[17234],{"type":26,"value":15578},{"type":21,"tag":209,"props":17236,"children":17237},{"style":222},[17238],{"type":26,"value":17239}," ttl ",{"type":21,"tag":209,"props":17241,"children":17242},{"style":216},[17243],{"type":26,"value":1985},{"type":21,"tag":209,"props":17245,"children":17246},{"style":216},[17247],{"type":26,"value":17248}," +new",{"type":21,"tag":209,"props":17250,"children":17251},{"style":360},[17252],{"type":26,"value":14388},{"type":21,"tag":209,"props":17254,"children":17255},{"style":222},[17256],{"type":26,"value":17167},{"type":21,"tag":209,"props":17258,"children":17260},{"class":211,"line":17259},145,[17261,17265],{"type":21,"tag":209,"props":17262,"children":17263},{"style":360},[17264],{"type":26,"value":14489},{"type":21,"tag":209,"props":17266,"children":17267},{"style":222},[17268],{"type":26,"value":14494},{"type":21,"tag":209,"props":17270,"children":17272},{"class":211,"line":17271},146,[17273],{"type":21,"tag":209,"props":17274,"children":17275},{"style":222},[17276],{"type":26,"value":2235},{"type":21,"tag":209,"props":17278,"children":17280},{"class":211,"line":17279},147,[17281],{"type":21,"tag":209,"props":17282,"children":17283},{"emptyLinePlaceholder":248},[17284],{"type":26,"value":251},{"type":21,"tag":209,"props":17286,"children":17288},{"class":211,"line":17287},148,[17289,17294,17298,17302,17306],{"type":21,"tag":209,"props":17290,"children":17291},{"style":222},[17292],{"type":26,"value":17293},"        value ",{"type":21,"tag":209,"props":17295,"children":17296},{"style":216},[17297],{"type":26,"value":1432},{"type":21,"tag":209,"props":17299,"children":17300},{"style":222},[17301],{"type":26,"value":17084},{"type":21,"tag":209,"props":17303,"children":17304},{"style":360},[17305],{"type":26,"value":17089},{"type":21,"tag":209,"props":17307,"children":17308},{"style":222},[17309],{"type":26,"value":15787},{"type":21,"tag":209,"props":17311,"children":17313},{"class":211,"line":17312},149,[17314],{"type":21,"tag":209,"props":17315,"children":17316},{"emptyLinePlaceholder":248},[17317],{"type":26,"value":251},{"type":21,"tag":209,"props":17319,"children":17321},{"class":211,"line":17320},150,[17322,17326,17330,17334],{"type":21,"tag":209,"props":17323,"children":17324},{"style":216},[17325],{"type":26,"value":5803},{"type":21,"tag":209,"props":17327,"children":17328},{"style":222},[17329],{"type":26,"value":4776},{"type":21,"tag":209,"props":17331,"children":17332},{"style":216},[17333],{"type":26,"value":15052},{"type":21,"tag":209,"props":17335,"children":17336},{"style":222},[17337],{"type":26,"value":17338},"value) {\n",{"type":21,"tag":209,"props":17340,"children":17342},{"class":211,"line":17341},151,[17343],{"type":21,"tag":209,"props":17344,"children":17345},{"style":448},[17346],{"type":26,"value":17347},"            /* If not cached, we'll make the request and add a then block to the resulting promise,\n",{"type":21,"tag":209,"props":17349,"children":17351},{"class":211,"line":17350},152,[17352],{"type":21,"tag":209,"props":17353,"children":17354},{"style":448},[17355],{"type":26,"value":17356},"             in which we'll cache the result. */\n",{"type":21,"tag":209,"props":17358,"children":17360},{"class":211,"line":17359},153,[17361,17365,17369,17374,17378,17383,17388,17392,17397],{"type":21,"tag":209,"props":17362,"children":17363},{"style":216},[17364],{"type":26,"value":5101},{"type":21,"tag":209,"props":17366,"children":17367},{"style":360},[17368],{"type":26,"value":4811},{"type":21,"tag":209,"props":17370,"children":17371},{"style":222},[17372],{"type":26,"value":17373},"(url, settings).",{"type":21,"tag":209,"props":17375,"children":17376},{"style":360},[17377],{"type":26,"value":2704},{"type":21,"tag":209,"props":17379,"children":17380},{"style":222},[17381],{"type":26,"value":17382},"(cacheResponse.",{"type":21,"tag":209,"props":17384,"children":17385},{"style":360},[17386],{"type":26,"value":17387},"bind",{"type":21,"tag":209,"props":17389,"children":17390},{"style":222},[17391],{"type":26,"value":368},{"type":21,"tag":209,"props":17393,"children":17394},{"style":263},[17395],{"type":26,"value":17396},"null",{"type":21,"tag":209,"props":17398,"children":17399},{"style":222},[17400],{"type":26,"value":17401},", cacheKey, storage, hourstl));\n",{"type":21,"tag":209,"props":17403,"children":17405},{"class":211,"line":17404},154,[17406],{"type":21,"tag":209,"props":17407,"children":17408},{"style":222},[17409],{"type":26,"value":2235},{"type":21,"tag":209,"props":17411,"children":17413},{"class":211,"line":17412},155,[17414],{"type":21,"tag":209,"props":17415,"children":17416},{"emptyLinePlaceholder":248},[17417],{"type":26,"value":251},{"type":21,"tag":209,"props":17419,"children":17421},{"class":211,"line":17420},156,[17422],{"type":21,"tag":209,"props":17423,"children":17424},{"style":448},[17425],{"type":26,"value":17426},"        /* Value is cached, so we'll simply create and respond with a promise of our own,\n",{"type":21,"tag":209,"props":17428,"children":17430},{"class":211,"line":17429},157,[17431],{"type":21,"tag":209,"props":17432,"children":17433},{"style":448},[17434],{"type":26,"value":17435},"         and provide a response object. */\n",{"type":21,"tag":209,"props":17437,"children":17439},{"class":211,"line":17438},158,[17440,17444,17448,17452,17456,17460,17464,17468,17472,17476,17480],{"type":21,"tag":209,"props":17441,"children":17442},{"style":222},[17443],{"type":26,"value":14225},{"type":21,"tag":209,"props":17445,"children":17446},{"style":216},[17447],{"type":26,"value":1432},{"type":21,"tag":209,"props":17449,"children":17450},{"style":222},[17451],{"type":26,"value":17084},{"type":21,"tag":209,"props":17453,"children":17454},{"style":360},[17455],{"type":26,"value":17089},{"type":21,"tag":209,"props":17457,"children":17458},{"style":222},[17459],{"type":26,"value":14365},{"type":21,"tag":209,"props":17461,"children":17462},{"style":216},[17463],{"type":26,"value":10237},{"type":21,"tag":209,"props":17465,"children":17466},{"style":233},[17467],{"type":26,"value":14453},{"type":21,"tag":209,"props":17469,"children":17470},{"style":222},[17471],{"type":26,"value":432},{"type":21,"tag":209,"props":17473,"children":17474},{"style":216},[17475],{"type":26,"value":4677},{"type":21,"tag":209,"props":17477,"children":17478},{"style":233},[17479],{"type":26,"value":14260},{"type":21,"tag":209,"props":17481,"children":17482},{"style":222},[17483],{"type":26,"value":241},{"type":21,"tag":209,"props":17485,"children":17487},{"class":211,"line":17486},159,[17488,17492,17496],{"type":21,"tag":209,"props":17489,"children":17490},{"style":216},[17491],{"type":26,"value":3069},{"type":21,"tag":209,"props":17493,"children":17494},{"style":360},[17495],{"type":26,"value":14686},{"type":21,"tag":209,"props":17497,"children":17498},{"style":222},[17499],{"type":26,"value":17500},"(value, dataType);\n",{"type":21,"tag":209,"props":17502,"children":17504},{"class":211,"line":17503},160,[17505],{"type":21,"tag":209,"props":17506,"children":17507},{"style":222},[17508],{"type":26,"value":4850},{"type":21,"tag":209,"props":17510,"children":17512},{"class":211,"line":17511},161,[17513],{"type":21,"tag":209,"props":17514,"children":17515},{"style":222},[17516],{"type":26,"value":17517},"})(self.fetch);\n",{"type":21,"tag":3490,"props":17519,"children":17520},{},[17521],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":17523},[17524,17525,17526,17527,17528],{"id":13819,"depth":254,"text":13822},{"id":13838,"depth":254,"text":13841},{"id":13901,"depth":254,"text":13904},{"id":13921,"depth":254,"text":13924},{"id":14920,"depth":254,"text":14923},"content:ckeefer:2016-7:goFetch2.md","ckeefer/2016-7/goFetch2.md","ckeefer/2016-7/goFetch2",{"user":3518,"name":3519},{"_path":17534,"_dir":17535,"_draft":7,"_partial":7,"_locale":8,"title":17536,"description":17537,"publishDate":17538,"tags":17539,"excerpt":17537,"body":17540,"_type":3511,"_id":18905,"_source":3513,"_file":18906,"_stem":18907,"_extension":3516,"author":18908},"/ckeefer/2016-6/gofetch1","2016-6","Go Fetch! (JavaScript Fetch API)","Long ago, we briefly brushed upon the topic of what has made jQuery such a valuable part of the web developer's toolset for such a long time - namely, a cleaner interface for interacting with the DOM, and the $.ajax abstraction over XMLHttpRequest.","2016-10-03",[12,13804,7335],{"type":18,"children":17541,"toc":18897},[17542,17553,17580,17585,17591,17596,17603,17922,17954,17959,18144,18156,18160,18358,18380,18385,18391,18444,18449,18455,18489,18495,18500,18811,18824,18837,18842,18847,18853,18858,18862,18893],{"type":21,"tag":22,"props":17543,"children":17544},{},[17545,17551],{"type":21,"tag":29,"props":17546,"children":17548},{"href":17547},"/search/jquery/ajax/blobs/user:ckeefer",[17549],{"type":26,"value":17550},"Long ago",{"type":26,"value":17552},", we briefly brushed upon the topic of what has made jQuery such a valuable part of the web developer's toolset for such a long time - namely, a cleaner interface for interacting with the DOM, and the $.ajax abstraction over XMLHttpRequest.",{"type":21,"tag":22,"props":17554,"children":17555},{},[17556,17558,17564,17565,17571,17573,17579],{"type":26,"value":17557},"These days, I would go a step farther and discuss how it has positively influenced browser APIs. jQuery offered a way to find elements using their css selectors, and this eventually gave us ",{"type":21,"tag":63,"props":17559,"children":17561},{"className":17560},[],[17562],{"type":26,"value":17563},"document.querySelector",{"type":26,"value":7274},{"type":21,"tag":63,"props":17566,"children":17568},{"className":17567},[],[17569],{"type":26,"value":17570},"document.querySelectorAll",{"type":26,"value":17572},". More recently, browser developers have taken another page from jQuery's playbook and introduced a new, Promise-based API for making asynchronous requests, and so much more - ",{"type":21,"tag":29,"props":17574,"children":17577},{"href":17575,"rel":17576},"https://developer.mozilla.org/en/docs/Web/API/Fetch_API",[93],[17578],{"type":26,"value":12637},{"type":26,"value":378},{"type":21,"tag":22,"props":17581,"children":17582},{},[17583],{"type":26,"value":17584},"Why go Fetch? Let's take a look.",{"type":21,"tag":51,"props":17586,"children":17588},{"id":17587},"a-comparison",[17589],{"type":26,"value":17590},"A Comparison",{"type":21,"tag":22,"props":17592,"children":17593},{},[17594],{"type":26,"value":17595},"First, let's take a look at what a simple request using three different APIs might look like - first, our old friend XMLHttpRequest, then jQuery's ajax, and then Fetch.",{"type":21,"tag":17597,"props":17598,"children":17600},"h5",{"id":17599},"xmlhttprequest",[17601],{"type":26,"value":17602},"XMLHttpRequest",{"type":21,"tag":200,"props":17604,"children":17606},{"className":9044,"code":17605,"language":9046,"meta":8,"style":8},"var xhr = new XMLHttpRequest();\n\nxhr.addEventListener('load', function(){\n    var json = this.response || JSON.parse(this.responseText);\n    console.log(json);\n});\n\nxhr.addEventListener('error', function(err){\n    console.log(\"Oh dear, something went wrong: \", err);\n});\n\nxhr.responseType = 'json';\nxhr.open('get', '//jsonplaceholder.typicode.com/users', true);\nxhr.send();\n",[17607],{"type":21,"tag":63,"props":17608,"children":17609},{"__ignoreMap":8},[17610,17639,17646,17678,17735,17751,17758,17765,17805,17830,17837,17844,17865,17906],{"type":21,"tag":209,"props":17611,"children":17612},{"class":211,"line":212},[17613,17617,17622,17626,17630,17635],{"type":21,"tag":209,"props":17614,"children":17615},{"style":216},[17616],{"type":26,"value":8996},{"type":21,"tag":209,"props":17618,"children":17619},{"style":222},[17620],{"type":26,"value":17621}," xhr ",{"type":21,"tag":209,"props":17623,"children":17624},{"style":216},[17625],{"type":26,"value":1432},{"type":21,"tag":209,"props":17627,"children":17628},{"style":216},[17629],{"type":26,"value":4667},{"type":21,"tag":209,"props":17631,"children":17632},{"style":360},[17633],{"type":26,"value":17634}," XMLHttpRequest",{"type":21,"tag":209,"props":17636,"children":17637},{"style":222},[17638],{"type":26,"value":4842},{"type":21,"tag":209,"props":17640,"children":17641},{"class":211,"line":244},[17642],{"type":21,"tag":209,"props":17643,"children":17644},{"emptyLinePlaceholder":248},[17645],{"type":26,"value":251},{"type":21,"tag":209,"props":17647,"children":17648},{"class":211,"line":254},[17649,17654,17658,17662,17666,17670,17674],{"type":21,"tag":209,"props":17650,"children":17651},{"style":222},[17652],{"type":26,"value":17653},"xhr.",{"type":21,"tag":209,"props":17655,"children":17656},{"style":360},[17657],{"type":26,"value":6424},{"type":21,"tag":209,"props":17659,"children":17660},{"style":222},[17661],{"type":26,"value":368},{"type":21,"tag":209,"props":17663,"children":17664},{"style":233},[17665],{"type":26,"value":11055},{"type":21,"tag":209,"props":17667,"children":17668},{"style":222},[17669],{"type":26,"value":408},{"type":21,"tag":209,"props":17671,"children":17672},{"style":216},[17673],{"type":26,"value":5370},{"type":21,"tag":209,"props":17675,"children":17676},{"style":222},[17677],{"type":26,"value":2561},{"type":21,"tag":209,"props":17679,"children":17680},{"class":211,"line":279},[17681,17685,17690,17694,17699,17704,17708,17713,17717,17722,17726,17730],{"type":21,"tag":209,"props":17682,"children":17683},{"style":216},[17684],{"type":26,"value":10405},{"type":21,"tag":209,"props":17686,"children":17687},{"style":222},[17688],{"type":26,"value":17689}," json ",{"type":21,"tag":209,"props":17691,"children":17692},{"style":216},[17693],{"type":26,"value":1432},{"type":21,"tag":209,"props":17695,"children":17696},{"style":263},[17697],{"type":26,"value":17698}," this",{"type":21,"tag":209,"props":17700,"children":17701},{"style":222},[17702],{"type":26,"value":17703},".response ",{"type":21,"tag":209,"props":17705,"children":17706},{"style":216},[17707],{"type":26,"value":4677},{"type":21,"tag":209,"props":17709,"children":17710},{"style":263},[17711],{"type":26,"value":17712}," JSON",{"type":21,"tag":209,"props":17714,"children":17715},{"style":222},[17716],{"type":26,"value":378},{"type":21,"tag":209,"props":17718,"children":17719},{"style":360},[17720],{"type":26,"value":17721},"parse",{"type":21,"tag":209,"props":17723,"children":17724},{"style":222},[17725],{"type":26,"value":368},{"type":21,"tag":209,"props":17727,"children":17728},{"style":263},[17729],{"type":26,"value":2508},{"type":21,"tag":209,"props":17731,"children":17732},{"style":222},[17733],{"type":26,"value":17734},".responseText);\n",{"type":21,"tag":209,"props":17736,"children":17737},{"class":211,"line":288},[17738,17742,17746],{"type":21,"tag":209,"props":17739,"children":17740},{"style":222},[17741],{"type":26,"value":1054},{"type":21,"tag":209,"props":17743,"children":17744},{"style":360},[17745],{"type":26,"value":1059},{"type":21,"tag":209,"props":17747,"children":17748},{"style":222},[17749],{"type":26,"value":17750},"(json);\n",{"type":21,"tag":209,"props":17752,"children":17753},{"class":211,"line":307},[17754],{"type":21,"tag":209,"props":17755,"children":17756},{"style":222},[17757],{"type":26,"value":469},{"type":21,"tag":209,"props":17759,"children":17760},{"class":211,"line":325},[17761],{"type":21,"tag":209,"props":17762,"children":17763},{"emptyLinePlaceholder":248},[17764],{"type":26,"value":251},{"type":21,"tag":209,"props":17766,"children":17767},{"class":211,"line":334},[17768,17772,17776,17780,17785,17789,17793,17797,17801],{"type":21,"tag":209,"props":17769,"children":17770},{"style":222},[17771],{"type":26,"value":17653},{"type":21,"tag":209,"props":17773,"children":17774},{"style":360},[17775],{"type":26,"value":6424},{"type":21,"tag":209,"props":17777,"children":17778},{"style":222},[17779],{"type":26,"value":368},{"type":21,"tag":209,"props":17781,"children":17782},{"style":233},[17783],{"type":26,"value":17784},"'error'",{"type":21,"tag":209,"props":17786,"children":17787},{"style":222},[17788],{"type":26,"value":408},{"type":21,"tag":209,"props":17790,"children":17791},{"style":216},[17792],{"type":26,"value":5370},{"type":21,"tag":209,"props":17794,"children":17795},{"style":222},[17796],{"type":26,"value":368},{"type":21,"tag":209,"props":17798,"children":17799},{"style":400},[17800],{"type":26,"value":5676},{"type":21,"tag":209,"props":17802,"children":17803},{"style":222},[17804],{"type":26,"value":2369},{"type":21,"tag":209,"props":17806,"children":17807},{"class":211,"line":343},[17808,17812,17816,17820,17825],{"type":21,"tag":209,"props":17809,"children":17810},{"style":222},[17811],{"type":26,"value":1054},{"type":21,"tag":209,"props":17813,"children":17814},{"style":360},[17815],{"type":26,"value":1059},{"type":21,"tag":209,"props":17817,"children":17818},{"style":222},[17819],{"type":26,"value":368},{"type":21,"tag":209,"props":17821,"children":17822},{"style":233},[17823],{"type":26,"value":17824},"\"Oh dear, something went wrong: \"",{"type":21,"tag":209,"props":17826,"children":17827},{"style":222},[17828],{"type":26,"value":17829},", err);\n",{"type":21,"tag":209,"props":17831,"children":17832},{"class":211,"line":351},[17833],{"type":21,"tag":209,"props":17834,"children":17835},{"style":222},[17836],{"type":26,"value":469},{"type":21,"tag":209,"props":17838,"children":17839},{"class":211,"line":444},[17840],{"type":21,"tag":209,"props":17841,"children":17842},{"emptyLinePlaceholder":248},[17843],{"type":26,"value":251},{"type":21,"tag":209,"props":17845,"children":17846},{"class":211,"line":454},[17847,17852,17856,17861],{"type":21,"tag":209,"props":17848,"children":17849},{"style":222},[17850],{"type":26,"value":17851},"xhr.responseType ",{"type":21,"tag":209,"props":17853,"children":17854},{"style":216},[17855],{"type":26,"value":1432},{"type":21,"tag":209,"props":17857,"children":17858},{"style":233},[17859],{"type":26,"value":17860}," 'json'",{"type":21,"tag":209,"props":17862,"children":17863},{"style":222},[17864],{"type":26,"value":241},{"type":21,"tag":209,"props":17866,"children":17867},{"class":211,"line":463},[17868,17872,17876,17880,17885,17889,17894,17898,17902],{"type":21,"tag":209,"props":17869,"children":17870},{"style":222},[17871],{"type":26,"value":17653},{"type":21,"tag":209,"props":17873,"children":17874},{"style":360},[17875],{"type":26,"value":11610},{"type":21,"tag":209,"props":17877,"children":17878},{"style":222},[17879],{"type":26,"value":368},{"type":21,"tag":209,"props":17881,"children":17882},{"style":233},[17883],{"type":26,"value":17884},"'get'",{"type":21,"tag":209,"props":17886,"children":17887},{"style":222},[17888],{"type":26,"value":408},{"type":21,"tag":209,"props":17890,"children":17891},{"style":233},[17892],{"type":26,"value":17893},"'//jsonplaceholder.typicode.com/users'",{"type":21,"tag":209,"props":17895,"children":17896},{"style":222},[17897],{"type":26,"value":408},{"type":21,"tag":209,"props":17899,"children":17900},{"style":263},[17901],{"type":26,"value":2223},{"type":21,"tag":209,"props":17903,"children":17904},{"style":222},[17905],{"type":26,"value":2608},{"type":21,"tag":209,"props":17907,"children":17908},{"class":211,"line":472},[17909,17913,17918],{"type":21,"tag":209,"props":17910,"children":17911},{"style":222},[17912],{"type":26,"value":17653},{"type":21,"tag":209,"props":17914,"children":17915},{"style":360},[17916],{"type":26,"value":17917},"send",{"type":21,"tag":209,"props":17919,"children":17920},{"style":222},[17921],{"type":26,"value":4842},{"type":21,"tag":22,"props":17923,"children":17924},{},[17925,17927,17932,17934,17939,17940,17945,17947,17952],{"type":26,"value":17926},"Not terrible, of course, but a little more verbose than we might like, and we don't get the nice, logical progression of ",{"type":21,"tag":1084,"props":17928,"children":17929},{},[17930],{"type":26,"value":17931},"this-then-that",{"type":26,"value":17933}," in our code, since we have to assign our ",{"type":21,"tag":63,"props":17935,"children":17937},{"className":17936},[],[17938],{"type":26,"value":5190},{"type":26,"value":7274},{"type":21,"tag":63,"props":17941,"children":17943},{"className":17942},[],[17944],{"type":26,"value":10685},{"type":26,"value":17946}," event handlers before we make the ",{"type":21,"tag":63,"props":17948,"children":17950},{"className":17949},[],[17951],{"type":26,"value":17917},{"type":26,"value":17953}," call.",{"type":21,"tag":17597,"props":17955,"children":17956},{"id":13804},[17957],{"type":26,"value":17958},"jQuery",{"type":21,"tag":200,"props":17960,"children":17962},{"className":9044,"code":17961,"language":9046,"meta":8,"style":8},"$.ajax({\n    type:'GET',\n    url:'//jsonplaceholder.typicode.com/users',\n    dataType:'json'\n}).done(function(data){ \n    console.log(data); \n}).fail(function(jqXHR){\n    console.log(\"Oh dear, something went wrong: \", jqXHR.status, jqXHR.responseText);\n});\n",[17963],{"type":21,"tag":63,"props":17964,"children":17965},{"__ignoreMap":8},[17966,17984,18001,18017,18030,18064,18080,18113,18137],{"type":21,"tag":209,"props":17967,"children":17968},{"class":211,"line":212},[17969,17974,17979],{"type":21,"tag":209,"props":17970,"children":17971},{"style":222},[17972],{"type":26,"value":17973},"$.",{"type":21,"tag":209,"props":17975,"children":17976},{"style":360},[17977],{"type":26,"value":17978},"ajax",{"type":21,"tag":209,"props":17980,"children":17981},{"style":222},[17982],{"type":26,"value":17983},"({\n",{"type":21,"tag":209,"props":17985,"children":17986},{"class":211,"line":244},[17987,17992,17997],{"type":21,"tag":209,"props":17988,"children":17989},{"style":222},[17990],{"type":26,"value":17991},"    type:",{"type":21,"tag":209,"props":17993,"children":17994},{"style":233},[17995],{"type":26,"value":17996},"'GET'",{"type":21,"tag":209,"props":17998,"children":17999},{"style":222},[18000],{"type":26,"value":304},{"type":21,"tag":209,"props":18002,"children":18003},{"class":211,"line":254},[18004,18009,18013],{"type":21,"tag":209,"props":18005,"children":18006},{"style":222},[18007],{"type":26,"value":18008},"    url:",{"type":21,"tag":209,"props":18010,"children":18011},{"style":233},[18012],{"type":26,"value":17893},{"type":21,"tag":209,"props":18014,"children":18015},{"style":222},[18016],{"type":26,"value":304},{"type":21,"tag":209,"props":18018,"children":18019},{"class":211,"line":279},[18020,18025],{"type":21,"tag":209,"props":18021,"children":18022},{"style":222},[18023],{"type":26,"value":18024},"    dataType:",{"type":21,"tag":209,"props":18026,"children":18027},{"style":233},[18028],{"type":26,"value":18029},"'json'\n",{"type":21,"tag":209,"props":18031,"children":18032},{"class":211,"line":288},[18033,18038,18043,18047,18051,18055,18059],{"type":21,"tag":209,"props":18034,"children":18035},{"style":222},[18036],{"type":26,"value":18037},"}).",{"type":21,"tag":209,"props":18039,"children":18040},{"style":360},[18041],{"type":26,"value":18042},"done",{"type":21,"tag":209,"props":18044,"children":18045},{"style":222},[18046],{"type":26,"value":368},{"type":21,"tag":209,"props":18048,"children":18049},{"style":216},[18050],{"type":26,"value":5370},{"type":21,"tag":209,"props":18052,"children":18053},{"style":222},[18054],{"type":26,"value":368},{"type":21,"tag":209,"props":18056,"children":18057},{"style":400},[18058],{"type":26,"value":2863},{"type":21,"tag":209,"props":18060,"children":18061},{"style":222},[18062],{"type":26,"value":18063},"){ \n",{"type":21,"tag":209,"props":18065,"children":18066},{"class":211,"line":307},[18067,18071,18075],{"type":21,"tag":209,"props":18068,"children":18069},{"style":222},[18070],{"type":26,"value":1054},{"type":21,"tag":209,"props":18072,"children":18073},{"style":360},[18074],{"type":26,"value":1059},{"type":21,"tag":209,"props":18076,"children":18077},{"style":222},[18078],{"type":26,"value":18079},"(data); \n",{"type":21,"tag":209,"props":18081,"children":18082},{"class":211,"line":325},[18083,18087,18092,18096,18100,18104,18109],{"type":21,"tag":209,"props":18084,"children":18085},{"style":222},[18086],{"type":26,"value":18037},{"type":21,"tag":209,"props":18088,"children":18089},{"style":360},[18090],{"type":26,"value":18091},"fail",{"type":21,"tag":209,"props":18093,"children":18094},{"style":222},[18095],{"type":26,"value":368},{"type":21,"tag":209,"props":18097,"children":18098},{"style":216},[18099],{"type":26,"value":5370},{"type":21,"tag":209,"props":18101,"children":18102},{"style":222},[18103],{"type":26,"value":368},{"type":21,"tag":209,"props":18105,"children":18106},{"style":400},[18107],{"type":26,"value":18108},"jqXHR",{"type":21,"tag":209,"props":18110,"children":18111},{"style":222},[18112],{"type":26,"value":2369},{"type":21,"tag":209,"props":18114,"children":18115},{"class":211,"line":334},[18116,18120,18124,18128,18132],{"type":21,"tag":209,"props":18117,"children":18118},{"style":222},[18119],{"type":26,"value":1054},{"type":21,"tag":209,"props":18121,"children":18122},{"style":360},[18123],{"type":26,"value":1059},{"type":21,"tag":209,"props":18125,"children":18126},{"style":222},[18127],{"type":26,"value":368},{"type":21,"tag":209,"props":18129,"children":18130},{"style":233},[18131],{"type":26,"value":17824},{"type":21,"tag":209,"props":18133,"children":18134},{"style":222},[18135],{"type":26,"value":18136},", jqXHR.status, jqXHR.responseText);\n",{"type":21,"tag":209,"props":18138,"children":18139},{"class":211,"line":343},[18140],{"type":21,"tag":209,"props":18141,"children":18142},{"style":222},[18143],{"type":26,"value":469},{"type":21,"tag":22,"props":18145,"children":18146},{},[18147,18149,18154],{"type":26,"value":18148},"Ah, much nicer - we can specify all the parameters to the ajax call within a single settings object, and with Deferred support baked in since v1.4, we can dangle a ",{"type":21,"tag":63,"props":18150,"children":18152},{"className":18151},[],[18153],{"type":26,"value":18042},{"type":26,"value":18155}," block after our call, keeping the logic more compact and readable.",{"type":21,"tag":17597,"props":18157,"children":18158},{"id":12634},[18159],{"type":26,"value":12637},{"type":21,"tag":200,"props":18161,"children":18163},{"className":9044,"code":18162,"language":9046,"meta":8,"style":8},"fetch('//jsonplaceholder.typicode.com/users', {\n    method:'GET'\n}).then((response) => {\n    return response.json();\n}).then((json) => {\n    console.log(json);\n}).catch((err) => {\n    console.log(\"Oh dear, something went wrong: \", err);\n});;\n",[18164],{"type":21,"tag":63,"props":18165,"children":18166},{"__ignoreMap":8},[18167,18187,18200,18231,18250,18281,18296,18327,18350],{"type":21,"tag":209,"props":18168,"children":18169},{"class":211,"line":212},[18170,18174,18178,18182],{"type":21,"tag":209,"props":18171,"children":18172},{"style":360},[18173],{"type":26,"value":12634},{"type":21,"tag":209,"props":18175,"children":18176},{"style":222},[18177],{"type":26,"value":368},{"type":21,"tag":209,"props":18179,"children":18180},{"style":233},[18181],{"type":26,"value":17893},{"type":21,"tag":209,"props":18183,"children":18184},{"style":222},[18185],{"type":26,"value":18186},", {\n",{"type":21,"tag":209,"props":18188,"children":18189},{"class":211,"line":244},[18190,18195],{"type":21,"tag":209,"props":18191,"children":18192},{"style":222},[18193],{"type":26,"value":18194},"    method:",{"type":21,"tag":209,"props":18196,"children":18197},{"style":233},[18198],{"type":26,"value":18199},"'GET'\n",{"type":21,"tag":209,"props":18201,"children":18202},{"class":211,"line":254},[18203,18207,18211,18215,18219,18223,18227],{"type":21,"tag":209,"props":18204,"children":18205},{"style":222},[18206],{"type":26,"value":18037},{"type":21,"tag":209,"props":18208,"children":18209},{"style":360},[18210],{"type":26,"value":2704},{"type":21,"tag":209,"props":18212,"children":18213},{"style":222},[18214],{"type":26,"value":2709},{"type":21,"tag":209,"props":18216,"children":18217},{"style":400},[18218],{"type":26,"value":12498},{"type":21,"tag":209,"props":18220,"children":18221},{"style":222},[18222],{"type":26,"value":432},{"type":21,"tag":209,"props":18224,"children":18225},{"style":216},[18226],{"type":26,"value":437},{"type":21,"tag":209,"props":18228,"children":18229},{"style":222},[18230],{"type":26,"value":276},{"type":21,"tag":209,"props":18232,"children":18233},{"class":211,"line":279},[18234,18238,18242,18246],{"type":21,"tag":209,"props":18235,"children":18236},{"style":216},[18237],{"type":26,"value":1298},{"type":21,"tag":209,"props":18239,"children":18240},{"style":222},[18241],{"type":26,"value":14208},{"type":21,"tag":209,"props":18243,"children":18244},{"style":360},[18245],{"type":26,"value":7402},{"type":21,"tag":209,"props":18247,"children":18248},{"style":222},[18249],{"type":26,"value":4842},{"type":21,"tag":209,"props":18251,"children":18252},{"class":211,"line":288},[18253,18257,18261,18265,18269,18273,18277],{"type":21,"tag":209,"props":18254,"children":18255},{"style":222},[18256],{"type":26,"value":18037},{"type":21,"tag":209,"props":18258,"children":18259},{"style":360},[18260],{"type":26,"value":2704},{"type":21,"tag":209,"props":18262,"children":18263},{"style":222},[18264],{"type":26,"value":2709},{"type":21,"tag":209,"props":18266,"children":18267},{"style":400},[18268],{"type":26,"value":7402},{"type":21,"tag":209,"props":18270,"children":18271},{"style":222},[18272],{"type":26,"value":432},{"type":21,"tag":209,"props":18274,"children":18275},{"style":216},[18276],{"type":26,"value":437},{"type":21,"tag":209,"props":18278,"children":18279},{"style":222},[18280],{"type":26,"value":276},{"type":21,"tag":209,"props":18282,"children":18283},{"class":211,"line":307},[18284,18288,18292],{"type":21,"tag":209,"props":18285,"children":18286},{"style":222},[18287],{"type":26,"value":1054},{"type":21,"tag":209,"props":18289,"children":18290},{"style":360},[18291],{"type":26,"value":1059},{"type":21,"tag":209,"props":18293,"children":18294},{"style":222},[18295],{"type":26,"value":17750},{"type":21,"tag":209,"props":18297,"children":18298},{"class":211,"line":325},[18299,18303,18307,18311,18315,18319,18323],{"type":21,"tag":209,"props":18300,"children":18301},{"style":222},[18302],{"type":26,"value":18037},{"type":21,"tag":209,"props":18304,"children":18305},{"style":360},[18306],{"type":26,"value":6823},{"type":21,"tag":209,"props":18308,"children":18309},{"style":222},[18310],{"type":26,"value":2709},{"type":21,"tag":209,"props":18312,"children":18313},{"style":400},[18314],{"type":26,"value":5676},{"type":21,"tag":209,"props":18316,"children":18317},{"style":222},[18318],{"type":26,"value":432},{"type":21,"tag":209,"props":18320,"children":18321},{"style":216},[18322],{"type":26,"value":437},{"type":21,"tag":209,"props":18324,"children":18325},{"style":222},[18326],{"type":26,"value":276},{"type":21,"tag":209,"props":18328,"children":18329},{"class":211,"line":334},[18330,18334,18338,18342,18346],{"type":21,"tag":209,"props":18331,"children":18332},{"style":222},[18333],{"type":26,"value":1054},{"type":21,"tag":209,"props":18335,"children":18336},{"style":360},[18337],{"type":26,"value":1059},{"type":21,"tag":209,"props":18339,"children":18340},{"style":222},[18341],{"type":26,"value":368},{"type":21,"tag":209,"props":18343,"children":18344},{"style":233},[18345],{"type":26,"value":17824},{"type":21,"tag":209,"props":18347,"children":18348},{"style":222},[18349],{"type":26,"value":17829},{"type":21,"tag":209,"props":18351,"children":18352},{"class":211,"line":343},[18353],{"type":21,"tag":209,"props":18354,"children":18355},{"style":222},[18356],{"type":26,"value":18357},"});;\n",{"type":21,"tag":22,"props":18359,"children":18360},{},[18361,18363,18370,18371,18378],{"type":26,"value":18362},"You can see the similarities to the $.ajax example, but the fetch API manages to be both a tad more compact - in part thanks to ",{"type":21,"tag":29,"props":18364,"children":18367},{"href":18365,"rel":18366},"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise",[93],[18368],{"type":26,"value":18369},"Promises",{"type":26,"value":7274},{"type":21,"tag":29,"props":18372,"children":18375},{"href":18373,"rel":18374},"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions",[93],[18376],{"type":26,"value":18377},"Arrow Functions",{"type":26,"value":18379}," - and more powerful in a variety of ways.",{"type":21,"tag":22,"props":18381,"children":18382},{},[18383],{"type":26,"value":18384},"For instance, let's talk a little about the Response readers, and the Response and Request objects.",{"type":21,"tag":51,"props":18386,"children":18388},{"id":18387},"response-readers",[18389],{"type":26,"value":18390},"Response Readers",{"type":21,"tag":22,"props":18392,"children":18393},{},[18394,18396,18401,18403,18409,18411,18416,18417,18422,18423,18429,18430,18436,18437,18442],{"type":26,"value":18395},"You'll notice in the example above that our initial ",{"type":21,"tag":63,"props":18397,"children":18399},{"className":18398},[],[18400],{"type":26,"value":2704},{"type":26,"value":18402}," block returns a call to .json() on the response. What's happening here is that the response is presented to us as a stream. We could read this stream manually if we wanted to, via ",{"type":21,"tag":63,"props":18404,"children":18406},{"className":18405},[],[18407],{"type":26,"value":18408},"response.body.getReader()",{"type":26,"value":18410},", but for most purposes, we can rely on one of the built in readers: ",{"type":21,"tag":63,"props":18412,"children":18414},{"className":18413},[],[18415],{"type":26,"value":26},{"type":26,"value":408},{"type":21,"tag":63,"props":18418,"children":18420},{"className":18419},[],[18421],{"type":26,"value":7402},{"type":26,"value":408},{"type":21,"tag":63,"props":18424,"children":18426},{"className":18425},[],[18427],{"type":26,"value":18428},"formData",{"type":26,"value":408},{"type":21,"tag":63,"props":18431,"children":18433},{"className":18432},[],[18434],{"type":26,"value":18435},"blob",{"type":26,"value":7274},{"type":21,"tag":63,"props":18438,"children":18440},{"className":18439},[],[18441],{"type":26,"value":4837},{"type":26,"value":18443},". These readers drain the stream and return the value decoded as one might expect in the form of the specified reader - i.e. using the blob reader on the stream will return its value decoded as a blob object.",{"type":21,"tag":22,"props":18445,"children":18446},{},[18447],{"type":26,"value":18448},"This is neat, because it offers us the opportunity to consider how we want to decode any given return - no hacks on top of responseText here. One gotcha to be mindful of, though, is that the readers do 'drain the stream', as I noted above, so if you were to return the response to a future then block, and attempt to read again, that read would fail. We'll talk more about this point next time.",{"type":21,"tag":51,"props":18450,"children":18452},{"id":18451},"response-request",[18453],{"type":26,"value":18454},"Response & Request",{"type":21,"tag":22,"props":18456,"children":18457},{},[18458,18460,18465,18466,18472,18474,18480,18481,18487],{"type":26,"value":18459},"Another nicety of the Fetch api is that we finally gain access to the ",{"type":21,"tag":63,"props":18461,"children":18463},{"className":18462},[],[18464],{"type":26,"value":14915},{"type":26,"value":7274},{"type":21,"tag":63,"props":18467,"children":18469},{"className":18468},[],[18470],{"type":26,"value":18471},"Request",{"type":26,"value":18473}," primitives that underlie these requests, allowing us to form our own ",{"type":21,"tag":29,"props":18475,"children":18478},{"href":18476,"rel":18477},"https://developer.mozilla.org/en-US/docs/Web/API/Response",[93],[18479],{"type":26,"value":14915},{"type":26,"value":7274},{"type":21,"tag":29,"props":18482,"children":18485},{"href":18483,"rel":18484},"https://developer.mozilla.org/en-US/docs/Web/API/Request",[93],[18486],{"type":26,"value":18471},{"type":26,"value":18488}," objects. This isn't likely to come up very often (especially outside of the context of a web worker), but we'll also be taking a look at how we can use the Response object to produce our own streamable response from cached values next time.",{"type":21,"tag":51,"props":18490,"children":18492},{"id":18491},"gotchas",[18493],{"type":26,"value":18494},"Gotchas",{"type":21,"tag":22,"props":18496,"children":18497},{},[18498],{"type":26,"value":18499},"One of the differences between XMLHttpRequest (and thus $.ajax), and fetch is that network returns that indicate failure, like a 400 or 500 response, won't be considered errors by your fetch promise - if you want them to be errors that are handled in the catch block, you'll want to check for them and throw them yourself:",{"type":21,"tag":200,"props":18501,"children":18503},{"className":9044,"code":18502,"language":9046,"meta":8,"style":8},"fetch('//jsonplaceholder.typicode.com/users', {\n    method:'GET',\n    credentials:'omit',\n    headers:{\n        'Content-Type': 'application/json'\n    },\n    mode:'cors',\n    cache:'no-cache',\n    referrer:'no-referrer'\n}).then((response) => {\n    let status = response.status;\n\n    if (status \u003C 200 || status > 299) throw new Error(status);\n\n}).catch((error) => {\n    // Catch our network error here\n});\n",[18504],{"type":21,"tag":63,"props":18505,"children":18506},{"__ignoreMap":8},[18507,18526,18541,18558,18566,18583,18590,18607,18624,18637,18668,18689,18696,18758,18765,18796,18804],{"type":21,"tag":209,"props":18508,"children":18509},{"class":211,"line":212},[18510,18514,18518,18522],{"type":21,"tag":209,"props":18511,"children":18512},{"style":360},[18513],{"type":26,"value":12634},{"type":21,"tag":209,"props":18515,"children":18516},{"style":222},[18517],{"type":26,"value":368},{"type":21,"tag":209,"props":18519,"children":18520},{"style":233},[18521],{"type":26,"value":17893},{"type":21,"tag":209,"props":18523,"children":18524},{"style":222},[18525],{"type":26,"value":18186},{"type":21,"tag":209,"props":18527,"children":18528},{"class":211,"line":244},[18529,18533,18537],{"type":21,"tag":209,"props":18530,"children":18531},{"style":222},[18532],{"type":26,"value":18194},{"type":21,"tag":209,"props":18534,"children":18535},{"style":233},[18536],{"type":26,"value":17996},{"type":21,"tag":209,"props":18538,"children":18539},{"style":222},[18540],{"type":26,"value":304},{"type":21,"tag":209,"props":18542,"children":18543},{"class":211,"line":254},[18544,18549,18554],{"type":21,"tag":209,"props":18545,"children":18546},{"style":222},[18547],{"type":26,"value":18548},"    credentials:",{"type":21,"tag":209,"props":18550,"children":18551},{"style":233},[18552],{"type":26,"value":18553},"'omit'",{"type":21,"tag":209,"props":18555,"children":18556},{"style":222},[18557],{"type":26,"value":304},{"type":21,"tag":209,"props":18559,"children":18560},{"class":211,"line":279},[18561],{"type":21,"tag":209,"props":18562,"children":18563},{"style":222},[18564],{"type":26,"value":18565},"    headers:{\n",{"type":21,"tag":209,"props":18567,"children":18568},{"class":211,"line":288},[18569,18574,18578],{"type":21,"tag":209,"props":18570,"children":18571},{"style":233},[18572],{"type":26,"value":18573},"        'Content-Type'",{"type":21,"tag":209,"props":18575,"children":18576},{"style":222},[18577],{"type":26,"value":7427},{"type":21,"tag":209,"props":18579,"children":18580},{"style":233},[18581],{"type":26,"value":18582},"'application/json'\n",{"type":21,"tag":209,"props":18584,"children":18585},{"class":211,"line":307},[18586],{"type":21,"tag":209,"props":18587,"children":18588},{"style":222},[18589],{"type":26,"value":2251},{"type":21,"tag":209,"props":18591,"children":18592},{"class":211,"line":325},[18593,18598,18603],{"type":21,"tag":209,"props":18594,"children":18595},{"style":222},[18596],{"type":26,"value":18597},"    mode:",{"type":21,"tag":209,"props":18599,"children":18600},{"style":233},[18601],{"type":26,"value":18602},"'cors'",{"type":21,"tag":209,"props":18604,"children":18605},{"style":222},[18606],{"type":26,"value":304},{"type":21,"tag":209,"props":18608,"children":18609},{"class":211,"line":334},[18610,18615,18620],{"type":21,"tag":209,"props":18611,"children":18612},{"style":222},[18613],{"type":26,"value":18614},"    cache:",{"type":21,"tag":209,"props":18616,"children":18617},{"style":233},[18618],{"type":26,"value":18619},"'no-cache'",{"type":21,"tag":209,"props":18621,"children":18622},{"style":222},[18623],{"type":26,"value":304},{"type":21,"tag":209,"props":18625,"children":18626},{"class":211,"line":343},[18627,18632],{"type":21,"tag":209,"props":18628,"children":18629},{"style":222},[18630],{"type":26,"value":18631},"    referrer:",{"type":21,"tag":209,"props":18633,"children":18634},{"style":233},[18635],{"type":26,"value":18636},"'no-referrer'\n",{"type":21,"tag":209,"props":18638,"children":18639},{"class":211,"line":351},[18640,18644,18648,18652,18656,18660,18664],{"type":21,"tag":209,"props":18641,"children":18642},{"style":222},[18643],{"type":26,"value":18037},{"type":21,"tag":209,"props":18645,"children":18646},{"style":360},[18647],{"type":26,"value":2704},{"type":21,"tag":209,"props":18649,"children":18650},{"style":222},[18651],{"type":26,"value":2709},{"type":21,"tag":209,"props":18653,"children":18654},{"style":400},[18655],{"type":26,"value":12498},{"type":21,"tag":209,"props":18657,"children":18658},{"style":222},[18659],{"type":26,"value":432},{"type":21,"tag":209,"props":18661,"children":18662},{"style":216},[18663],{"type":26,"value":437},{"type":21,"tag":209,"props":18665,"children":18666},{"style":222},[18667],{"type":26,"value":276},{"type":21,"tag":209,"props":18669,"children":18670},{"class":211,"line":444},[18671,18675,18680,18684],{"type":21,"tag":209,"props":18672,"children":18673},{"style":216},[18674],{"type":26,"value":5441},{"type":21,"tag":209,"props":18676,"children":18677},{"style":222},[18678],{"type":26,"value":18679}," status ",{"type":21,"tag":209,"props":18681,"children":18682},{"style":216},[18683],{"type":26,"value":1432},{"type":21,"tag":209,"props":18685,"children":18686},{"style":222},[18687],{"type":26,"value":18688}," response.status;\n",{"type":21,"tag":209,"props":18690,"children":18691},{"class":211,"line":454},[18692],{"type":21,"tag":209,"props":18693,"children":18694},{"emptyLinePlaceholder":248},[18695],{"type":26,"value":251},{"type":21,"tag":209,"props":18697,"children":18698},{"class":211,"line":463},[18699,18703,18708,18712,18717,18722,18726,18730,18735,18739,18744,18748,18753],{"type":21,"tag":209,"props":18700,"children":18701},{"style":216},[18702],{"type":26,"value":10853},{"type":21,"tag":209,"props":18704,"children":18705},{"style":222},[18706],{"type":26,"value":18707}," (status ",{"type":21,"tag":209,"props":18709,"children":18710},{"style":216},[18711],{"type":26,"value":1985},{"type":21,"tag":209,"props":18713,"children":18714},{"style":263},[18715],{"type":26,"value":18716}," 200",{"type":21,"tag":209,"props":18718,"children":18719},{"style":216},[18720],{"type":26,"value":18721}," ||",{"type":21,"tag":209,"props":18723,"children":18724},{"style":222},[18725],{"type":26,"value":18679},{"type":21,"tag":209,"props":18727,"children":18728},{"style":216},[18729],{"type":26,"value":2014},{"type":21,"tag":209,"props":18731,"children":18732},{"style":263},[18733],{"type":26,"value":18734}," 299",{"type":21,"tag":209,"props":18736,"children":18737},{"style":222},[18738],{"type":26,"value":432},{"type":21,"tag":209,"props":18740,"children":18741},{"style":216},[18742],{"type":26,"value":18743},"throw",{"type":21,"tag":209,"props":18745,"children":18746},{"style":216},[18747],{"type":26,"value":4667},{"type":21,"tag":209,"props":18749,"children":18750},{"style":360},[18751],{"type":26,"value":18752}," Error",{"type":21,"tag":209,"props":18754,"children":18755},{"style":222},[18756],{"type":26,"value":18757},"(status);\n",{"type":21,"tag":209,"props":18759,"children":18760},{"class":211,"line":472},[18761],{"type":21,"tag":209,"props":18762,"children":18763},{"emptyLinePlaceholder":248},[18764],{"type":26,"value":251},{"type":21,"tag":209,"props":18766,"children":18767},{"class":211,"line":480},[18768,18772,18776,18780,18784,18788,18792],{"type":21,"tag":209,"props":18769,"children":18770},{"style":222},[18771],{"type":26,"value":18037},{"type":21,"tag":209,"props":18773,"children":18774},{"style":360},[18775],{"type":26,"value":6823},{"type":21,"tag":209,"props":18777,"children":18778},{"style":222},[18779],{"type":26,"value":2709},{"type":21,"tag":209,"props":18781,"children":18782},{"style":400},[18783],{"type":26,"value":10685},{"type":21,"tag":209,"props":18785,"children":18786},{"style":222},[18787],{"type":26,"value":432},{"type":21,"tag":209,"props":18789,"children":18790},{"style":216},[18791],{"type":26,"value":437},{"type":21,"tag":209,"props":18793,"children":18794},{"style":222},[18795],{"type":26,"value":276},{"type":21,"tag":209,"props":18797,"children":18798},{"class":211,"line":489},[18799],{"type":21,"tag":209,"props":18800,"children":18801},{"style":448},[18802],{"type":26,"value":18803},"    // Catch our network error here\n",{"type":21,"tag":209,"props":18805,"children":18806},{"class":211,"line":847},[18807],{"type":21,"tag":209,"props":18808,"children":18809},{"style":222},[18810],{"type":26,"value":469},{"type":21,"tag":22,"props":18812,"children":18813},{},[18814,18816,18822],{"type":26,"value":18815},"You'll notice I also included a more comprehensive settings object this time. For the details on all the possible settings, I suggest checking out the links in the further reading section, below. For now, the one we really need to talk about is the ",{"type":21,"tag":63,"props":18817,"children":18819},{"className":18818},[],[18820],{"type":26,"value":18821},"credentials",{"type":26,"value":18823}," property.",{"type":21,"tag":22,"props":18825,"children":18826},{},[18827,18829,18835],{"type":26,"value":18828},"By default, XMLHttpRequest will send credentials to requests on the same-origin. Not so for fetch - 'omit' is the default value for credentials, so if you need to send cookies up to your server to authenticate a request, for instance, you'll need to be sure to specify ",{"type":21,"tag":63,"props":18830,"children":18832},{"className":18831},[],[18833],{"type":26,"value":18834},"credentials:'include'",{"type":26,"value":18836}," instead.",{"type":21,"tag":22,"props":18838,"children":18839},{},[18840],{"type":26,"value":18841},"Finally, at the moment there's no way to cancel a fetch request (this is in the works, and will probably coincide with being able to cancel a Promise), there's no progress events as there are in the XHR2 spec (although you can build your own, should you be so inclined), and there's no option for synchronous requests (which is good, and sync requests are deprecated and going to disappear in XHR at some future point as well).",{"type":21,"tag":22,"props":18843,"children":18844},{},[18845],{"type":26,"value":18846},"These potential gotchas are the usual cost of being on the sharp edge of emerging tech, and many will likely be smoothed over by browser developers or libraries that wrap the fetch functionality.",{"type":21,"tag":51,"props":18848,"children":18850},{"id":18849},"next-time",[18851],{"type":26,"value":18852},"Next Time",{"type":21,"tag":22,"props":18854,"children":18855},{},[18856],{"type":26,"value":18857},"Speaking of libraries that wrap the Fetch functionality, as I've been hinting, next time we'll take a deeper look into actually using the Fetch API, and present and dissect a library that will allow us to cache responses we've retrieved with fetch for bandwidth savings and offline usage. Stay tuned.",{"type":21,"tag":51,"props":18859,"children":18860},{"id":13753},[18861],{"type":26,"value":13756},{"type":21,"tag":3677,"props":18863,"children":18864},{},[18865,18873,18883],{"type":21,"tag":3681,"props":18866,"children":18867},{},[18868],{"type":21,"tag":29,"props":18869,"children":18871},{"href":17575,"rel":18870},[93],[18872],{"type":26,"value":5199},{"type":21,"tag":3681,"props":18874,"children":18875},{},[18876],{"type":21,"tag":29,"props":18877,"children":18880},{"href":18878,"rel":18879},"https://developers.google.com/web/updates/2015/03/introduction-to-fetch?hl=en",[93],[18881],{"type":26,"value":18882},"Introduction to fetch",{"type":21,"tag":3681,"props":18884,"children":18885},{},[18886],{"type":21,"tag":29,"props":18887,"children":18890},{"href":18888,"rel":18889},"https://jakearchibald.com/2015/thats-so-fetch/",[93],[18891],{"type":26,"value":18892},"That's so fetch",{"type":21,"tag":3490,"props":18894,"children":18895},{},[18896],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":18898},[18899,18900,18901,18902,18903,18904],{"id":17587,"depth":254,"text":17590},{"id":18387,"depth":254,"text":18390},{"id":18451,"depth":254,"text":18454},{"id":18491,"depth":254,"text":18494},{"id":18849,"depth":254,"text":18852},{"id":13753,"depth":254,"text":13756},"content:ckeefer:2016-6:goFetch1.md","ckeefer/2016-6/goFetch1.md","ckeefer/2016-6/goFetch1",{"user":3518,"name":3519},{"_path":18910,"_dir":18911,"_draft":7,"_partial":7,"_locale":8,"title":18912,"description":18913,"publishDate":18914,"tags":18915,"excerpt":18913,"body":18918,"_type":3511,"_id":21538,"_source":3513,"_file":21539,"_stem":21540,"_extension":3516,"author":21541},"/ckeefer/2016-4/djangochannels2","2016-4","Django Channels: From the Ground Up - Part 2","Last time, we decided to embark on a brave new adventure and give our Django framework a big upgrade with the inclusion of Django Channels. We got just far enough to get the development server running, but while this may be an adequate start, it's better to develop against something like what we intend to deploy, right?","2016-06-15",[18916,9842,18917],"django","websockets",{"type":18,"children":18919,"toc":21529},[18920,18946,18951,18957,18962,18970,19171,19179,19341,19361,19367,19372,19377,19455,19460,19466,19477,19482,19487,19492,19633,19764,19777,19843,19848,19869,19875,19880,19901,19907,19920,19934,19955,20135,20140,20283,20288,20309,20314,20513,20533,20553,20566,20737,20758,20763,20860,20873,20893,20898,20904,20916,20921,20942,21448,21454,21459,21479,21484,21488,21500,21512,21525],{"type":21,"tag":22,"props":18921,"children":18922},{},[18923,18928,18930,18937,18939,18944],{"type":21,"tag":29,"props":18924,"children":18926},{"href":18925},"/search/user:ckeefer/django/channels/",[18927],{"type":26,"value":7347},{"type":26,"value":18929},", we decided to embark on a brave new adventure and give our Django framework a big upgrade with the inclusion of ",{"type":21,"tag":29,"props":18931,"children":18934},{"href":18932,"rel":18933},"https://channels.readthedocs.io/en/latest/index.html",[93],[18935],{"type":26,"value":18936},"Django Channels",{"type":26,"value":18938},". We got just far enough to get the development server running, but while this may be an ",{"type":21,"tag":1084,"props":18940,"children":18941},{},[18942],{"type":26,"value":18943},"adequate",{"type":26,"value":18945}," start, it's better to develop against something like what we intend to deploy, right?",{"type":21,"tag":22,"props":18947,"children":18948},{},[18949],{"type":26,"value":18950},"So, let's go the rest of the way and get ready to develop against something that at least resembles a standard production-ready environment with Django Channels.",{"type":21,"tag":51,"props":18952,"children":18954},{"id":18953},"post-receive-redux",[18955],{"type":26,"value":18956},"Post-Receive Redux",{"type":21,"tag":22,"props":18958,"children":18959},{},[18960],{"type":26,"value":18961},"Since we're transitioning away from the Django development server, we'll want to alter our post-receive scripts to tie into supervisorctl instead. So, let's edit our post-receive script like so:",{"type":21,"tag":22,"props":18963,"children":18964},{},[18965],{"type":21,"tag":5270,"props":18966,"children":18967},{},[18968],{"type":26,"value":18969},"Ubuntu (bash) example:",{"type":21,"tag":200,"props":18971,"children":18975},{"className":18972,"code":18973,"language":18974,"meta":8,"style":8},"language-bash shiki shiki-themes github-light github-dark","#!/bin/bash\n\nGIT_WORK_TREE=/home/web/www/ git checkout -f\n\nsource /home/web/venv/bin/activate\npushd /home/web/www/\n\n# Install python libs via pip and perform database migrations\npip install --upgrade -r requirements.txt\npython manage.py migrate\n\npopd\ndeactivate\nsupervisorctl restart server_workers\nsupervisorctl restart server_interface\n","bash",[18976],{"type":21,"tag":63,"props":18977,"children":18978},{"__ignoreMap":8},[18979,18987,18994,19026,19033,19046,19054,19061,19069,19097,19114,19121,19129,19137,19155],{"type":21,"tag":209,"props":18980,"children":18981},{"class":211,"line":212},[18982],{"type":21,"tag":209,"props":18983,"children":18984},{"style":448},[18985],{"type":26,"value":18986},"#!/bin/bash\n",{"type":21,"tag":209,"props":18988,"children":18989},{"class":211,"line":244},[18990],{"type":21,"tag":209,"props":18991,"children":18992},{"emptyLinePlaceholder":248},[18993],{"type":26,"value":251},{"type":21,"tag":209,"props":18995,"children":18996},{"class":211,"line":254},[18997,19002,19006,19011,19016,19021],{"type":21,"tag":209,"props":18998,"children":18999},{"style":222},[19000],{"type":26,"value":19001},"GIT_WORK_TREE",{"type":21,"tag":209,"props":19003,"children":19004},{"style":216},[19005],{"type":26,"value":1432},{"type":21,"tag":209,"props":19007,"children":19008},{"style":233},[19009],{"type":26,"value":19010},"/home/web/www/",{"type":21,"tag":209,"props":19012,"children":19013},{"style":360},[19014],{"type":26,"value":19015}," git",{"type":21,"tag":209,"props":19017,"children":19018},{"style":233},[19019],{"type":26,"value":19020}," checkout",{"type":21,"tag":209,"props":19022,"children":19023},{"style":263},[19024],{"type":26,"value":19025}," -f\n",{"type":21,"tag":209,"props":19027,"children":19028},{"class":211,"line":279},[19029],{"type":21,"tag":209,"props":19030,"children":19031},{"emptyLinePlaceholder":248},[19032],{"type":26,"value":251},{"type":21,"tag":209,"props":19034,"children":19035},{"class":211,"line":288},[19036,19041],{"type":21,"tag":209,"props":19037,"children":19038},{"style":263},[19039],{"type":26,"value":19040},"source",{"type":21,"tag":209,"props":19042,"children":19043},{"style":233},[19044],{"type":26,"value":19045}," /home/web/venv/bin/activate\n",{"type":21,"tag":209,"props":19047,"children":19048},{"class":211,"line":307},[19049],{"type":21,"tag":209,"props":19050,"children":19051},{"style":222},[19052],{"type":26,"value":19053},"pushd /home/web/www/\n",{"type":21,"tag":209,"props":19055,"children":19056},{"class":211,"line":325},[19057],{"type":21,"tag":209,"props":19058,"children":19059},{"emptyLinePlaceholder":248},[19060],{"type":26,"value":251},{"type":21,"tag":209,"props":19062,"children":19063},{"class":211,"line":334},[19064],{"type":21,"tag":209,"props":19065,"children":19066},{"style":448},[19067],{"type":26,"value":19068},"# Install python libs via pip and perform database migrations\n",{"type":21,"tag":209,"props":19070,"children":19071},{"class":211,"line":343},[19072,19077,19082,19087,19092],{"type":21,"tag":209,"props":19073,"children":19074},{"style":360},[19075],{"type":26,"value":19076},"pip",{"type":21,"tag":209,"props":19078,"children":19079},{"style":233},[19080],{"type":26,"value":19081}," install",{"type":21,"tag":209,"props":19083,"children":19084},{"style":263},[19085],{"type":26,"value":19086}," --upgrade",{"type":21,"tag":209,"props":19088,"children":19089},{"style":263},[19090],{"type":26,"value":19091}," -r",{"type":21,"tag":209,"props":19093,"children":19094},{"style":233},[19095],{"type":26,"value":19096}," requirements.txt\n",{"type":21,"tag":209,"props":19098,"children":19099},{"class":211,"line":351},[19100,19104,19109],{"type":21,"tag":209,"props":19101,"children":19102},{"style":360},[19103],{"type":26,"value":9842},{"type":21,"tag":209,"props":19105,"children":19106},{"style":233},[19107],{"type":26,"value":19108}," manage.py",{"type":21,"tag":209,"props":19110,"children":19111},{"style":233},[19112],{"type":26,"value":19113}," migrate\n",{"type":21,"tag":209,"props":19115,"children":19116},{"class":211,"line":444},[19117],{"type":21,"tag":209,"props":19118,"children":19119},{"emptyLinePlaceholder":248},[19120],{"type":26,"value":251},{"type":21,"tag":209,"props":19122,"children":19123},{"class":211,"line":454},[19124],{"type":21,"tag":209,"props":19125,"children":19126},{"style":222},[19127],{"type":26,"value":19128},"popd\n",{"type":21,"tag":209,"props":19130,"children":19131},{"class":211,"line":463},[19132],{"type":21,"tag":209,"props":19133,"children":19134},{"style":360},[19135],{"type":26,"value":19136},"deactivate\n",{"type":21,"tag":209,"props":19138,"children":19139},{"class":211,"line":472},[19140,19145,19150],{"type":21,"tag":209,"props":19141,"children":19142},{"style":360},[19143],{"type":26,"value":19144},"supervisorctl",{"type":21,"tag":209,"props":19146,"children":19147},{"style":233},[19148],{"type":26,"value":19149}," restart",{"type":21,"tag":209,"props":19151,"children":19152},{"style":233},[19153],{"type":26,"value":19154}," server_workers\n",{"type":21,"tag":209,"props":19156,"children":19157},{"class":211,"line":480},[19158,19162,19166],{"type":21,"tag":209,"props":19159,"children":19160},{"style":360},[19161],{"type":26,"value":19144},{"type":21,"tag":209,"props":19163,"children":19164},{"style":233},[19165],{"type":26,"value":19149},{"type":21,"tag":209,"props":19167,"children":19168},{"style":233},[19169],{"type":26,"value":19170}," server_interface\n",{"type":21,"tag":22,"props":19172,"children":19173},{},[19174],{"type":21,"tag":5270,"props":19175,"children":19176},{},[19177],{"type":26,"value":19178},"FreeBSD (csh) example:",{"type":21,"tag":200,"props":19180,"children":19182},{"className":18972,"code":19181,"language":18974,"meta":8,"style":8},"#!/bin/csh\n\nenv GIT_WORK_TREE=/home/web/www/ git checkout -f\nsource /home/web/venv/bin/activate.csh\npushd /home/web/www/\n\npip install --upgrade -r requirements.txt\npython manage.py migrate\n\npopd\ndeactivate\nsupervisorctl restart server_workers\nsupervisorctl restart server_interface\n",[19183],{"type":21,"tag":63,"props":19184,"children":19185},{"__ignoreMap":8},[19186,19194,19201,19226,19238,19245,19252,19275,19290,19297,19304,19311,19326],{"type":21,"tag":209,"props":19187,"children":19188},{"class":211,"line":212},[19189],{"type":21,"tag":209,"props":19190,"children":19191},{"style":448},[19192],{"type":26,"value":19193},"#!/bin/csh\n",{"type":21,"tag":209,"props":19195,"children":19196},{"class":211,"line":244},[19197],{"type":21,"tag":209,"props":19198,"children":19199},{"emptyLinePlaceholder":248},[19200],{"type":26,"value":251},{"type":21,"tag":209,"props":19202,"children":19203},{"class":211,"line":254},[19204,19209,19214,19218,19222],{"type":21,"tag":209,"props":19205,"children":19206},{"style":360},[19207],{"type":26,"value":19208},"env",{"type":21,"tag":209,"props":19210,"children":19211},{"style":233},[19212],{"type":26,"value":19213}," GIT_WORK_TREE=/home/web/www/",{"type":21,"tag":209,"props":19215,"children":19216},{"style":233},[19217],{"type":26,"value":19015},{"type":21,"tag":209,"props":19219,"children":19220},{"style":233},[19221],{"type":26,"value":19020},{"type":21,"tag":209,"props":19223,"children":19224},{"style":263},[19225],{"type":26,"value":19025},{"type":21,"tag":209,"props":19227,"children":19228},{"class":211,"line":279},[19229,19233],{"type":21,"tag":209,"props":19230,"children":19231},{"style":263},[19232],{"type":26,"value":19040},{"type":21,"tag":209,"props":19234,"children":19235},{"style":233},[19236],{"type":26,"value":19237}," /home/web/venv/bin/activate.csh\n",{"type":21,"tag":209,"props":19239,"children":19240},{"class":211,"line":288},[19241],{"type":21,"tag":209,"props":19242,"children":19243},{"style":222},[19244],{"type":26,"value":19053},{"type":21,"tag":209,"props":19246,"children":19247},{"class":211,"line":307},[19248],{"type":21,"tag":209,"props":19249,"children":19250},{"emptyLinePlaceholder":248},[19251],{"type":26,"value":251},{"type":21,"tag":209,"props":19253,"children":19254},{"class":211,"line":325},[19255,19259,19263,19267,19271],{"type":21,"tag":209,"props":19256,"children":19257},{"style":360},[19258],{"type":26,"value":19076},{"type":21,"tag":209,"props":19260,"children":19261},{"style":233},[19262],{"type":26,"value":19081},{"type":21,"tag":209,"props":19264,"children":19265},{"style":263},[19266],{"type":26,"value":19086},{"type":21,"tag":209,"props":19268,"children":19269},{"style":263},[19270],{"type":26,"value":19091},{"type":21,"tag":209,"props":19272,"children":19273},{"style":233},[19274],{"type":26,"value":19096},{"type":21,"tag":209,"props":19276,"children":19277},{"class":211,"line":334},[19278,19282,19286],{"type":21,"tag":209,"props":19279,"children":19280},{"style":360},[19281],{"type":26,"value":9842},{"type":21,"tag":209,"props":19283,"children":19284},{"style":233},[19285],{"type":26,"value":19108},{"type":21,"tag":209,"props":19287,"children":19288},{"style":233},[19289],{"type":26,"value":19113},{"type":21,"tag":209,"props":19291,"children":19292},{"class":211,"line":343},[19293],{"type":21,"tag":209,"props":19294,"children":19295},{"emptyLinePlaceholder":248},[19296],{"type":26,"value":251},{"type":21,"tag":209,"props":19298,"children":19299},{"class":211,"line":351},[19300],{"type":21,"tag":209,"props":19301,"children":19302},{"style":222},[19303],{"type":26,"value":19128},{"type":21,"tag":209,"props":19305,"children":19306},{"class":211,"line":444},[19307],{"type":21,"tag":209,"props":19308,"children":19309},{"style":360},[19310],{"type":26,"value":19136},{"type":21,"tag":209,"props":19312,"children":19313},{"class":211,"line":454},[19314,19318,19322],{"type":21,"tag":209,"props":19315,"children":19316},{"style":360},[19317],{"type":26,"value":19144},{"type":21,"tag":209,"props":19319,"children":19320},{"style":233},[19321],{"type":26,"value":19149},{"type":21,"tag":209,"props":19323,"children":19324},{"style":233},[19325],{"type":26,"value":19154},{"type":21,"tag":209,"props":19327,"children":19328},{"class":211,"line":463},[19329,19333,19337],{"type":21,"tag":209,"props":19330,"children":19331},{"style":360},[19332],{"type":26,"value":19144},{"type":21,"tag":209,"props":19334,"children":19335},{"style":233},[19336],{"type":26,"value":19149},{"type":21,"tag":209,"props":19338,"children":19339},{"style":233},[19340],{"type":26,"value":19170},{"type":21,"tag":22,"props":19342,"children":19343},{},[19344,19346,19352,19353,19359],{"type":26,"value":19345},"We can also work in things like running ",{"type":21,"tag":63,"props":19347,"children":19349},{"className":19348},[],[19350],{"type":26,"value":19351},"npm",{"type":26,"value":7274},{"type":21,"tag":63,"props":19354,"children":19356},{"className":19355},[],[19357],{"type":26,"value":19358},"grunt",{"type":26,"value":19360}," in there to build and minify files, or whatever other processes you need to do when pushing new code. This will likely be a little different for every project.",{"type":21,"tag":51,"props":19362,"children":19364},{"id":19363},"postgresql-setup",[19365],{"type":26,"value":19366},"Postgresql Setup",{"type":21,"tag":22,"props":19368,"children":19369},{},[19370],{"type":26,"value":19371},"Now, let's get our main database up and ready for our application. Up to this point, we've been relying on sqlite, which is a good starting place, but no match for a world-class hitter like PostgreSQL.",{"type":21,"tag":22,"props":19373,"children":19374},{},[19375],{"type":26,"value":19376},"We'll su in as the standard postgres user, and pass user and database creation commands to psql:",{"type":21,"tag":200,"props":19378,"children":19380},{"className":18972,"code":19379,"language":18974,"meta":8,"style":8},"vsudo su - postgres \u003C\u003CEOF\necho \"CREATE ROLE web LOGIN ENCRYPTED PASSWORD '';\" | psql\ncreatedb \"your_postgres_db\" --owner \"web\"\necho \"GRANT ALL PRIVILEGES ON DATABASE your_postgres_db TO web\" | psql\nservice postgresql reload\nEOF\n",[19381],{"type":21,"tag":63,"props":19382,"children":19383},{"__ignoreMap":8},[19384,19416,19424,19432,19440,19448],{"type":21,"tag":209,"props":19385,"children":19386},{"class":211,"line":212},[19387,19392,19397,19401,19406,19411],{"type":21,"tag":209,"props":19388,"children":19389},{"style":360},[19390],{"type":26,"value":19391},"vsudo",{"type":21,"tag":209,"props":19393,"children":19394},{"style":233},[19395],{"type":26,"value":19396}," su",{"type":21,"tag":209,"props":19398,"children":19399},{"style":233},[19400],{"type":26,"value":12414},{"type":21,"tag":209,"props":19402,"children":19403},{"style":233},[19404],{"type":26,"value":19405}," postgres",{"type":21,"tag":209,"props":19407,"children":19408},{"style":216},[19409],{"type":26,"value":19410}," \u003C\u003C",{"type":21,"tag":209,"props":19412,"children":19413},{"style":233},[19414],{"type":26,"value":19415},"EOF\n",{"type":21,"tag":209,"props":19417,"children":19418},{"class":211,"line":244},[19419],{"type":21,"tag":209,"props":19420,"children":19421},{"style":233},[19422],{"type":26,"value":19423},"echo \"CREATE ROLE web LOGIN ENCRYPTED PASSWORD '';\" | psql\n",{"type":21,"tag":209,"props":19425,"children":19426},{"class":211,"line":254},[19427],{"type":21,"tag":209,"props":19428,"children":19429},{"style":233},[19430],{"type":26,"value":19431},"createdb \"your_postgres_db\" --owner \"web\"\n",{"type":21,"tag":209,"props":19433,"children":19434},{"class":211,"line":279},[19435],{"type":21,"tag":209,"props":19436,"children":19437},{"style":233},[19438],{"type":26,"value":19439},"echo \"GRANT ALL PRIVILEGES ON DATABASE your_postgres_db TO web\" | psql\n",{"type":21,"tag":209,"props":19441,"children":19442},{"class":211,"line":288},[19443],{"type":21,"tag":209,"props":19444,"children":19445},{"style":233},[19446],{"type":26,"value":19447},"service postgresql reload\n",{"type":21,"tag":209,"props":19449,"children":19450},{"class":211,"line":307},[19451],{"type":21,"tag":209,"props":19452,"children":19453},{"style":233},[19454],{"type":26,"value":19415},{"type":21,"tag":22,"props":19456,"children":19457},{},[19458],{"type":26,"value":19459},"And we should be good to go.",{"type":21,"tag":51,"props":19461,"children":19463},{"id":19462},"setup-supervisord",[19464],{"type":26,"value":19465},"Setup Supervisord",{"type":21,"tag":22,"props":19467,"children":19468},{},[19469,19471,19476],{"type":26,"value":19470},"Okay, we're getting closer - now we're going to get supervisor to not only start our programs when it runs, but allow our regular web user to start and stop the programs we're setting up with",{"type":21,"tag":63,"props":19472,"children":19474},{"className":19473},[],[19475],{"type":26,"value":19144},{"type":26,"value":378},{"type":21,"tag":22,"props":19478,"children":19479},{},[19480],{"type":26,"value":19481},"Supervisord is an important part of the puzzle, as it will keep our server interface and workers up and running. If workers fail or die - which is certainly a possibility - our interface will simply sit and hang, waiting for workers to hand it something to do. Inversely, nothing going in or out of the workers is going to get back to your users without the interface, so it's important we have something monitoring both of them.",{"type":21,"tag":22,"props":19483,"children":19484},{},[19485],{"type":26,"value":19486},"We'll need to open up the supervisord.conf file, or add some new files which will be imported into said conf file - on Ubuntu, for example, we can locate our new conf files at /etc/supervisor/conf.d. On FreeBSD, we might just open up the conf file itself - be careful, the install instruction tell us about /etc/supervisord.conf, but their may also be another conf file at /usr/local/etc/ that overrides it.",{"type":21,"tag":22,"props":19488,"children":19489},{},[19490],{"type":26,"value":19491},"Either way, we're going to be adding two new program entries - one for the server workers (which handle the requests in the background) and one for the server interface (which consumes the requests and responses from clients and workers alike).",{"type":21,"tag":200,"props":19493,"children":19495},{"className":18972,"code":19494,"language":18974,"meta":8,"style":8},"[program:server_workers]\ncommand=/home/web/venv/bin/python /home/web/www/manage.py runworker\ndirectory=/home/web/www/\nuser=web\nautostart=true\nautorestart=true\nredirect_stderr=true\nstopasgroup=true\n",[19496],{"type":21,"tag":63,"props":19497,"children":19498},{"__ignoreMap":8},[19499,19507,19534,19551,19568,19585,19601,19617],{"type":21,"tag":209,"props":19500,"children":19501},{"class":211,"line":212},[19502],{"type":21,"tag":209,"props":19503,"children":19504},{"style":222},[19505],{"type":26,"value":19506},"[program:server_workers]\n",{"type":21,"tag":209,"props":19508,"children":19509},{"class":211,"line":244},[19510,19515,19519,19524,19529],{"type":21,"tag":209,"props":19511,"children":19512},{"style":222},[19513],{"type":26,"value":19514},"command",{"type":21,"tag":209,"props":19516,"children":19517},{"style":216},[19518],{"type":26,"value":1432},{"type":21,"tag":209,"props":19520,"children":19521},{"style":233},[19522],{"type":26,"value":19523},"/home/web/venv/bin/python",{"type":21,"tag":209,"props":19525,"children":19526},{"style":360},[19527],{"type":26,"value":19528}," /home/web/www/manage.py",{"type":21,"tag":209,"props":19530,"children":19531},{"style":233},[19532],{"type":26,"value":19533}," runworker\n",{"type":21,"tag":209,"props":19535,"children":19536},{"class":211,"line":254},[19537,19542,19546],{"type":21,"tag":209,"props":19538,"children":19539},{"style":222},[19540],{"type":26,"value":19541},"directory",{"type":21,"tag":209,"props":19543,"children":19544},{"style":216},[19545],{"type":26,"value":1432},{"type":21,"tag":209,"props":19547,"children":19548},{"style":233},[19549],{"type":26,"value":19550},"/home/web/www/\n",{"type":21,"tag":209,"props":19552,"children":19553},{"class":211,"line":279},[19554,19559,19563],{"type":21,"tag":209,"props":19555,"children":19556},{"style":222},[19557],{"type":26,"value":19558},"user",{"type":21,"tag":209,"props":19560,"children":19561},{"style":216},[19562],{"type":26,"value":1432},{"type":21,"tag":209,"props":19564,"children":19565},{"style":233},[19566],{"type":26,"value":19567},"web\n",{"type":21,"tag":209,"props":19569,"children":19570},{"class":211,"line":288},[19571,19576,19580],{"type":21,"tag":209,"props":19572,"children":19573},{"style":222},[19574],{"type":26,"value":19575},"autostart",{"type":21,"tag":209,"props":19577,"children":19578},{"style":216},[19579],{"type":26,"value":1432},{"type":21,"tag":209,"props":19581,"children":19582},{"style":233},[19583],{"type":26,"value":19584},"true\n",{"type":21,"tag":209,"props":19586,"children":19587},{"class":211,"line":307},[19588,19593,19597],{"type":21,"tag":209,"props":19589,"children":19590},{"style":222},[19591],{"type":26,"value":19592},"autorestart",{"type":21,"tag":209,"props":19594,"children":19595},{"style":216},[19596],{"type":26,"value":1432},{"type":21,"tag":209,"props":19598,"children":19599},{"style":233},[19600],{"type":26,"value":19584},{"type":21,"tag":209,"props":19602,"children":19603},{"class":211,"line":325},[19604,19609,19613],{"type":21,"tag":209,"props":19605,"children":19606},{"style":222},[19607],{"type":26,"value":19608},"redirect_stderr",{"type":21,"tag":209,"props":19610,"children":19611},{"style":216},[19612],{"type":26,"value":1432},{"type":21,"tag":209,"props":19614,"children":19615},{"style":233},[19616],{"type":26,"value":19584},{"type":21,"tag":209,"props":19618,"children":19619},{"class":211,"line":334},[19620,19625,19629],{"type":21,"tag":209,"props":19621,"children":19622},{"style":222},[19623],{"type":26,"value":19624},"stopasgroup",{"type":21,"tag":209,"props":19626,"children":19627},{"style":216},[19628],{"type":26,"value":1432},{"type":21,"tag":209,"props":19630,"children":19631},{"style":233},[19632],{"type":26,"value":19584},{"type":21,"tag":200,"props":19634,"children":19636},{"className":18972,"code":19635,"language":18974,"meta":8,"style":8},"[program:server_interface]\ncommand=/home/web/venv/bin/daphne -b 127.0.0.1 -p 8000 yourapp.asgi:channel_layer\ndirectory=/home/web/www/\nautostart=true\nautorestart=true\nstopasgroup=true\nuser=web\n",[19637],{"type":21,"tag":63,"props":19638,"children":19639},{"__ignoreMap":8},[19640,19648,19689,19704,19719,19734,19749],{"type":21,"tag":209,"props":19641,"children":19642},{"class":211,"line":212},[19643],{"type":21,"tag":209,"props":19644,"children":19645},{"style":222},[19646],{"type":26,"value":19647},"[program:server_interface]\n",{"type":21,"tag":209,"props":19649,"children":19650},{"class":211,"line":244},[19651,19655,19659,19664,19669,19674,19679,19684],{"type":21,"tag":209,"props":19652,"children":19653},{"style":222},[19654],{"type":26,"value":19514},{"type":21,"tag":209,"props":19656,"children":19657},{"style":216},[19658],{"type":26,"value":1432},{"type":21,"tag":209,"props":19660,"children":19661},{"style":233},[19662],{"type":26,"value":19663},"/home/web/venv/bin/daphne",{"type":21,"tag":209,"props":19665,"children":19666},{"style":360},[19667],{"type":26,"value":19668}," -b",{"type":21,"tag":209,"props":19670,"children":19671},{"style":263},[19672],{"type":26,"value":19673}," 127.0.0.1",{"type":21,"tag":209,"props":19675,"children":19676},{"style":263},[19677],{"type":26,"value":19678}," -p",{"type":21,"tag":209,"props":19680,"children":19681},{"style":263},[19682],{"type":26,"value":19683}," 8000",{"type":21,"tag":209,"props":19685,"children":19686},{"style":233},[19687],{"type":26,"value":19688}," yourapp.asgi:channel_layer\n",{"type":21,"tag":209,"props":19690,"children":19691},{"class":211,"line":254},[19692,19696,19700],{"type":21,"tag":209,"props":19693,"children":19694},{"style":222},[19695],{"type":26,"value":19541},{"type":21,"tag":209,"props":19697,"children":19698},{"style":216},[19699],{"type":26,"value":1432},{"type":21,"tag":209,"props":19701,"children":19702},{"style":233},[19703],{"type":26,"value":19550},{"type":21,"tag":209,"props":19705,"children":19706},{"class":211,"line":279},[19707,19711,19715],{"type":21,"tag":209,"props":19708,"children":19709},{"style":222},[19710],{"type":26,"value":19575},{"type":21,"tag":209,"props":19712,"children":19713},{"style":216},[19714],{"type":26,"value":1432},{"type":21,"tag":209,"props":19716,"children":19717},{"style":233},[19718],{"type":26,"value":19584},{"type":21,"tag":209,"props":19720,"children":19721},{"class":211,"line":288},[19722,19726,19730],{"type":21,"tag":209,"props":19723,"children":19724},{"style":222},[19725],{"type":26,"value":19592},{"type":21,"tag":209,"props":19727,"children":19728},{"style":216},[19729],{"type":26,"value":1432},{"type":21,"tag":209,"props":19731,"children":19732},{"style":233},[19733],{"type":26,"value":19584},{"type":21,"tag":209,"props":19735,"children":19736},{"class":211,"line":307},[19737,19741,19745],{"type":21,"tag":209,"props":19738,"children":19739},{"style":222},[19740],{"type":26,"value":19624},{"type":21,"tag":209,"props":19742,"children":19743},{"style":216},[19744],{"type":26,"value":1432},{"type":21,"tag":209,"props":19746,"children":19747},{"style":233},[19748],{"type":26,"value":19584},{"type":21,"tag":209,"props":19750,"children":19751},{"class":211,"line":325},[19752,19756,19760],{"type":21,"tag":209,"props":19753,"children":19754},{"style":222},[19755],{"type":26,"value":19558},{"type":21,"tag":209,"props":19757,"children":19758},{"style":216},[19759],{"type":26,"value":1432},{"type":21,"tag":209,"props":19761,"children":19762},{"style":233},[19763],{"type":26,"value":19567},{"type":21,"tag":22,"props":19765,"children":19766},{},[19767,19769,19775],{"type":26,"value":19768},"And finally, up near the top of the supervisord.conf file, beneath the ",{"type":21,"tag":63,"props":19770,"children":19772},{"className":19771},[],[19773],{"type":26,"value":19774},"[unix_http_server]",{"type":26,"value":19776}," heading, we need to make a few small changes to allow our web user to start and stop these processes.",{"type":21,"tag":200,"props":19778,"children":19780},{"className":18972,"code":19779,"language":18974,"meta":8,"style":8},"[unix_http_server]\nfile=/var/run/supervisor/supervisor.sock\nchmod=0770\nchown=nobody:web\n",[19781],{"type":21,"tag":63,"props":19782,"children":19783},{"__ignoreMap":8},[19784,19792,19809,19826],{"type":21,"tag":209,"props":19785,"children":19786},{"class":211,"line":212},[19787],{"type":21,"tag":209,"props":19788,"children":19789},{"style":222},[19790],{"type":26,"value":19791},"[unix_http_server]\n",{"type":21,"tag":209,"props":19793,"children":19794},{"class":211,"line":244},[19795,19800,19804],{"type":21,"tag":209,"props":19796,"children":19797},{"style":222},[19798],{"type":26,"value":19799},"file",{"type":21,"tag":209,"props":19801,"children":19802},{"style":216},[19803],{"type":26,"value":1432},{"type":21,"tag":209,"props":19805,"children":19806},{"style":233},[19807],{"type":26,"value":19808},"/var/run/supervisor/supervisor.sock\n",{"type":21,"tag":209,"props":19810,"children":19811},{"class":211,"line":254},[19812,19817,19821],{"type":21,"tag":209,"props":19813,"children":19814},{"style":222},[19815],{"type":26,"value":19816},"chmod",{"type":21,"tag":209,"props":19818,"children":19819},{"style":216},[19820],{"type":26,"value":1432},{"type":21,"tag":209,"props":19822,"children":19823},{"style":233},[19824],{"type":26,"value":19825},"0770\n",{"type":21,"tag":209,"props":19827,"children":19828},{"class":211,"line":279},[19829,19834,19838],{"type":21,"tag":209,"props":19830,"children":19831},{"style":222},[19832],{"type":26,"value":19833},"chown",{"type":21,"tag":209,"props":19835,"children":19836},{"style":216},[19837],{"type":26,"value":1432},{"type":21,"tag":209,"props":19839,"children":19840},{"style":233},[19841],{"type":26,"value":19842},"nobody:web\n",{"type":21,"tag":22,"props":19844,"children":19845},{},[19846],{"type":26,"value":19847},"and restart the supervisord process.",{"type":21,"tag":22,"props":19849,"children":19850},{},[19851,19853,19859,19861,19867],{"type":26,"value":19852},"You can also opt to add your web user to a group like ",{"type":21,"tag":63,"props":19854,"children":19856},{"className":19855},[],[19857],{"type":26,"value":19858},"wheel",{"type":26,"value":19860},", and then alter the chown line to something like ",{"type":21,"tag":63,"props":19862,"children":19864},{"className":19863},[],[19865],{"type":26,"value":19866},"chown=nobody:wheel",{"type":26,"value":19868},". The key here is simply to make the socket available to the appropriate user group so our web user can interact with it.",{"type":21,"tag":51,"props":19870,"children":19872},{"id":19871},"setup-redis",[19873],{"type":26,"value":19874},"Setup Redis",{"type":21,"tag":22,"props":19876,"children":19877},{},[19878],{"type":26,"value":19879},"Getting Redis up and ready is smooth and easy - in fact, at this point you're already done. See how easy that was?",{"type":21,"tag":22,"props":19881,"children":19882},{},[19883,19885,19891,19893,19899],{"type":26,"value":19884},"If you used the requirements.txt in part 1, you already have the needed ",{"type":21,"tag":63,"props":19886,"children":19888},{"className":19887},[],[19889],{"type":26,"value":19890},"asgi_redis",{"type":26,"value":19892}," package installed in your virtual environment, and the defaults that Redis installs with are fine for us. I do encourage you to take a look through the ",{"type":21,"tag":29,"props":19894,"children":19896},{"href":19895},"redis.io/documentation",[19897],{"type":26,"value":19898},"Redis docs",{"type":26,"value":19900},", however, and configure it as you need.",{"type":21,"tag":51,"props":19902,"children":19904},{"id":19903},"django-setup",[19905],{"type":26,"value":19906},"Django Setup",{"type":21,"tag":22,"props":19908,"children":19909},{},[19910,19912,19918],{"type":26,"value":19911},"If we were to check our supervisord status with ",{"type":21,"tag":63,"props":19913,"children":19915},{"className":19914},[],[19916],{"type":26,"value":19917},"supervisorctl status",{"type":26,"value":19919}," right now, we can expect it will be showing a FATAL error for our server_interface program entry. We need to add some new files to get daphne up and running, and while we're in there we'll make the changes necessary to get Django playing nicely with Postgres as our database and Redis as our channel backend.",{"type":21,"tag":22,"props":19921,"children":19922},{},[19923,19925,19932],{"type":26,"value":19924},"For reference, much of the below can also be found in the ",{"type":21,"tag":29,"props":19926,"children":19929},{"href":19927,"rel":19928},"https://channels.readthedocs.io/en/latest/deploying.html#setting-up-a-channel-backend",[93],[19930],{"type":26,"value":19931},"Channels docs",{"type":26,"value":19933},", with the addition of our postgres details.",{"type":21,"tag":22,"props":19935,"children":19936},{},[19937,19939,19945,19947,19953],{"type":26,"value":19938},"Let's start with PostgreSQL. Open up your ",{"type":21,"tag":63,"props":19940,"children":19942},{"className":19941},[],[19943],{"type":26,"value":19944},"settings.py",{"type":26,"value":19946}," file, and alter the ",{"type":21,"tag":63,"props":19948,"children":19950},{"className":19949},[],[19951],{"type":26,"value":19952},"DATABASES",{"type":26,"value":19954}," dict to the following:",{"type":21,"tag":200,"props":19956,"children":19958},{"className":9840,"code":19957,"language":9842,"meta":8,"style":8},"DATABASES = {\n'default': {\n'ENGINE': 'django.db.backends.postgresql_psycopg2',\n'NAME': 'your_postgres_db',\n'USER': 'web',\n'PASSWORD': 'your_postgres_pass',\n'HOST': 'localhost',\n'PORT': '', # Empty string == default (5432)\n}\n}\n",[19959],{"type":21,"tag":63,"props":19960,"children":19961},{"__ignoreMap":8},[19962,19977,19990,20011,20032,20053,20074,20095,20121,20128],{"type":21,"tag":209,"props":19963,"children":19964},{"class":211,"line":212},[19965,19969,19973],{"type":21,"tag":209,"props":19966,"children":19967},{"style":263},[19968],{"type":26,"value":19952},{"type":21,"tag":209,"props":19970,"children":19971},{"style":216},[19972],{"type":26,"value":271},{"type":21,"tag":209,"props":19974,"children":19975},{"style":222},[19976],{"type":26,"value":276},{"type":21,"tag":209,"props":19978,"children":19979},{"class":211,"line":244},[19980,19985],{"type":21,"tag":209,"props":19981,"children":19982},{"style":233},[19983],{"type":26,"value":19984},"'default'",{"type":21,"tag":209,"props":19986,"children":19987},{"style":222},[19988],{"type":26,"value":19989},": {\n",{"type":21,"tag":209,"props":19991,"children":19992},{"class":211,"line":254},[19993,19998,20002,20007],{"type":21,"tag":209,"props":19994,"children":19995},{"style":233},[19996],{"type":26,"value":19997},"'ENGINE'",{"type":21,"tag":209,"props":19999,"children":20000},{"style":222},[20001],{"type":26,"value":7427},{"type":21,"tag":209,"props":20003,"children":20004},{"style":233},[20005],{"type":26,"value":20006},"'django.db.backends.postgresql_psycopg2'",{"type":21,"tag":209,"props":20008,"children":20009},{"style":222},[20010],{"type":26,"value":304},{"type":21,"tag":209,"props":20012,"children":20013},{"class":211,"line":279},[20014,20019,20023,20028],{"type":21,"tag":209,"props":20015,"children":20016},{"style":233},[20017],{"type":26,"value":20018},"'NAME'",{"type":21,"tag":209,"props":20020,"children":20021},{"style":222},[20022],{"type":26,"value":7427},{"type":21,"tag":209,"props":20024,"children":20025},{"style":233},[20026],{"type":26,"value":20027},"'your_postgres_db'",{"type":21,"tag":209,"props":20029,"children":20030},{"style":222},[20031],{"type":26,"value":304},{"type":21,"tag":209,"props":20033,"children":20034},{"class":211,"line":288},[20035,20040,20044,20049],{"type":21,"tag":209,"props":20036,"children":20037},{"style":233},[20038],{"type":26,"value":20039},"'USER'",{"type":21,"tag":209,"props":20041,"children":20042},{"style":222},[20043],{"type":26,"value":7427},{"type":21,"tag":209,"props":20045,"children":20046},{"style":233},[20047],{"type":26,"value":20048},"'web'",{"type":21,"tag":209,"props":20050,"children":20051},{"style":222},[20052],{"type":26,"value":304},{"type":21,"tag":209,"props":20054,"children":20055},{"class":211,"line":307},[20056,20061,20065,20070],{"type":21,"tag":209,"props":20057,"children":20058},{"style":233},[20059],{"type":26,"value":20060},"'PASSWORD'",{"type":21,"tag":209,"props":20062,"children":20063},{"style":222},[20064],{"type":26,"value":7427},{"type":21,"tag":209,"props":20066,"children":20067},{"style":233},[20068],{"type":26,"value":20069},"'your_postgres_pass'",{"type":21,"tag":209,"props":20071,"children":20072},{"style":222},[20073],{"type":26,"value":304},{"type":21,"tag":209,"props":20075,"children":20076},{"class":211,"line":325},[20077,20082,20086,20091],{"type":21,"tag":209,"props":20078,"children":20079},{"style":233},[20080],{"type":26,"value":20081},"'HOST'",{"type":21,"tag":209,"props":20083,"children":20084},{"style":222},[20085],{"type":26,"value":7427},{"type":21,"tag":209,"props":20087,"children":20088},{"style":233},[20089],{"type":26,"value":20090},"'localhost'",{"type":21,"tag":209,"props":20092,"children":20093},{"style":222},[20094],{"type":26,"value":304},{"type":21,"tag":209,"props":20096,"children":20097},{"class":211,"line":334},[20098,20103,20107,20112,20116],{"type":21,"tag":209,"props":20099,"children":20100},{"style":233},[20101],{"type":26,"value":20102},"'PORT'",{"type":21,"tag":209,"props":20104,"children":20105},{"style":222},[20106],{"type":26,"value":7427},{"type":21,"tag":209,"props":20108,"children":20109},{"style":233},[20110],{"type":26,"value":20111},"''",{"type":21,"tag":209,"props":20113,"children":20114},{"style":222},[20115],{"type":26,"value":408},{"type":21,"tag":209,"props":20117,"children":20118},{"style":448},[20119],{"type":26,"value":20120},"# Empty string == default (5432)\n",{"type":21,"tag":209,"props":20122,"children":20123},{"class":211,"line":343},[20124],{"type":21,"tag":209,"props":20125,"children":20126},{"style":222},[20127],{"type":26,"value":7798},{"type":21,"tag":209,"props":20129,"children":20130},{"class":211,"line":351},[20131],{"type":21,"tag":209,"props":20132,"children":20133},{"style":222},[20134],{"type":26,"value":7798},{"type":21,"tag":22,"props":20136,"children":20137},{},[20138],{"type":26,"value":20139},"Now, add the following dict beneath that to setup our redis channel layer:",{"type":21,"tag":200,"props":20141,"children":20143},{"className":9840,"code":20142,"language":9842,"meta":8,"style":8},"CHANNEL_LAYERS = {\n\"default\": {\n\"BACKEND\": \"asgi_redis.RedisChannelLayer\",\n\"CONFIG\": {\n\"hosts\": [(\"localhost\", 6379)],\n},\n\"ROUTING\": \"yourapp.routing.channel_routing\",\n},\n}\n",[20144],{"type":21,"tag":63,"props":20145,"children":20146},{"__ignoreMap":8},[20147,20163,20175,20196,20208,20240,20248,20269,20276],{"type":21,"tag":209,"props":20148,"children":20149},{"class":211,"line":212},[20150,20155,20159],{"type":21,"tag":209,"props":20151,"children":20152},{"style":263},[20153],{"type":26,"value":20154},"CHANNEL_LAYERS",{"type":21,"tag":209,"props":20156,"children":20157},{"style":216},[20158],{"type":26,"value":271},{"type":21,"tag":209,"props":20160,"children":20161},{"style":222},[20162],{"type":26,"value":276},{"type":21,"tag":209,"props":20164,"children":20165},{"class":211,"line":244},[20166,20171],{"type":21,"tag":209,"props":20167,"children":20168},{"style":233},[20169],{"type":26,"value":20170},"\"default\"",{"type":21,"tag":209,"props":20172,"children":20173},{"style":222},[20174],{"type":26,"value":19989},{"type":21,"tag":209,"props":20176,"children":20177},{"class":211,"line":254},[20178,20183,20187,20192],{"type":21,"tag":209,"props":20179,"children":20180},{"style":233},[20181],{"type":26,"value":20182},"\"BACKEND\"",{"type":21,"tag":209,"props":20184,"children":20185},{"style":222},[20186],{"type":26,"value":7427},{"type":21,"tag":209,"props":20188,"children":20189},{"style":233},[20190],{"type":26,"value":20191},"\"asgi_redis.RedisChannelLayer\"",{"type":21,"tag":209,"props":20193,"children":20194},{"style":222},[20195],{"type":26,"value":304},{"type":21,"tag":209,"props":20197,"children":20198},{"class":211,"line":279},[20199,20204],{"type":21,"tag":209,"props":20200,"children":20201},{"style":233},[20202],{"type":26,"value":20203},"\"CONFIG\"",{"type":21,"tag":209,"props":20205,"children":20206},{"style":222},[20207],{"type":26,"value":19989},{"type":21,"tag":209,"props":20209,"children":20210},{"class":211,"line":288},[20211,20216,20221,20226,20230,20235],{"type":21,"tag":209,"props":20212,"children":20213},{"style":233},[20214],{"type":26,"value":20215},"\"hosts\"",{"type":21,"tag":209,"props":20217,"children":20218},{"style":222},[20219],{"type":26,"value":20220},": [(",{"type":21,"tag":209,"props":20222,"children":20223},{"style":233},[20224],{"type":26,"value":20225},"\"localhost\"",{"type":21,"tag":209,"props":20227,"children":20228},{"style":222},[20229],{"type":26,"value":408},{"type":21,"tag":209,"props":20231,"children":20232},{"style":263},[20233],{"type":26,"value":20234},"6379",{"type":21,"tag":209,"props":20236,"children":20237},{"style":222},[20238],{"type":26,"value":20239},")],\n",{"type":21,"tag":209,"props":20241,"children":20242},{"class":211,"line":307},[20243],{"type":21,"tag":209,"props":20244,"children":20245},{"style":222},[20246],{"type":26,"value":20247},"},\n",{"type":21,"tag":209,"props":20249,"children":20250},{"class":211,"line":325},[20251,20256,20260,20265],{"type":21,"tag":209,"props":20252,"children":20253},{"style":233},[20254],{"type":26,"value":20255},"\"ROUTING\"",{"type":21,"tag":209,"props":20257,"children":20258},{"style":222},[20259],{"type":26,"value":7427},{"type":21,"tag":209,"props":20261,"children":20262},{"style":233},[20263],{"type":26,"value":20264},"\"yourapp.routing.channel_routing\"",{"type":21,"tag":209,"props":20266,"children":20267},{"style":222},[20268],{"type":26,"value":304},{"type":21,"tag":209,"props":20270,"children":20271},{"class":211,"line":334},[20272],{"type":21,"tag":209,"props":20273,"children":20274},{"style":222},[20275],{"type":26,"value":20247},{"type":21,"tag":209,"props":20277,"children":20278},{"class":211,"line":343},[20279],{"type":21,"tag":209,"props":20280,"children":20281},{"style":222},[20282],{"type":26,"value":7798},{"type":21,"tag":22,"props":20284,"children":20285},{},[20286],{"type":26,"value":20287},"By default, channels uses process memory as it's communication channel, which is fine for simple development cases, but obviously can't be shared between processes and is unsuitable for production.",{"type":21,"tag":22,"props":20289,"children":20290},{},[20291,20293,20299,20301,20307],{"type":26,"value":20292},"Notice the \"ROUTING\" component of the above config? That's a reference to the ",{"type":21,"tag":63,"props":20294,"children":20296},{"className":20295},[],[20297],{"type":26,"value":20298},"routing.py",{"type":26,"value":20300}," file we're going to slap into the application directory - it should live next to your ",{"type":21,"tag":63,"props":20302,"children":20304},{"className":20303},[],[20305],{"type":26,"value":20306},"urls.py",{"type":26,"value":20308}," file.",{"type":21,"tag":22,"props":20310,"children":20311},{},[20312],{"type":26,"value":20313},"Here's an example:",{"type":21,"tag":200,"props":20315,"children":20317},{"className":9840,"code":20316,"language":9842,"meta":8,"style":8},"from channels.routing import route\nfrom channels.routing import include\n\nfrom yourapp import consumers\n\nhttp_routing = [\nroute('http.request', consumers.index)\n]\n\nstream_routing = [\n\n]\n\nchannel_routing = [\ninclude(stream_routing)\n]\n",[20318],{"type":21,"tag":63,"props":20319,"children":20320},{"__ignoreMap":8},[20321,20342,20362,20369,20390,20397,20413,20431,20438,20445,20461,20468,20475,20482,20498,20506],{"type":21,"tag":209,"props":20322,"children":20323},{"class":211,"line":212},[20324,20328,20333,20337],{"type":21,"tag":209,"props":20325,"children":20326},{"style":216},[20327],{"type":26,"value":230},{"type":21,"tag":209,"props":20329,"children":20330},{"style":222},[20331],{"type":26,"value":20332}," channels.routing ",{"type":21,"tag":209,"props":20334,"children":20335},{"style":216},[20336],{"type":26,"value":219},{"type":21,"tag":209,"props":20338,"children":20339},{"style":222},[20340],{"type":26,"value":20341}," route\n",{"type":21,"tag":209,"props":20343,"children":20344},{"class":211,"line":244},[20345,20349,20353,20357],{"type":21,"tag":209,"props":20346,"children":20347},{"style":216},[20348],{"type":26,"value":230},{"type":21,"tag":209,"props":20350,"children":20351},{"style":222},[20352],{"type":26,"value":20332},{"type":21,"tag":209,"props":20354,"children":20355},{"style":216},[20356],{"type":26,"value":219},{"type":21,"tag":209,"props":20358,"children":20359},{"style":222},[20360],{"type":26,"value":20361}," include\n",{"type":21,"tag":209,"props":20363,"children":20364},{"class":211,"line":254},[20365],{"type":21,"tag":209,"props":20366,"children":20367},{"emptyLinePlaceholder":248},[20368],{"type":26,"value":251},{"type":21,"tag":209,"props":20370,"children":20371},{"class":211,"line":279},[20372,20376,20381,20385],{"type":21,"tag":209,"props":20373,"children":20374},{"style":216},[20375],{"type":26,"value":230},{"type":21,"tag":209,"props":20377,"children":20378},{"style":222},[20379],{"type":26,"value":20380}," yourapp ",{"type":21,"tag":209,"props":20382,"children":20383},{"style":216},[20384],{"type":26,"value":219},{"type":21,"tag":209,"props":20386,"children":20387},{"style":222},[20388],{"type":26,"value":20389}," consumers\n",{"type":21,"tag":209,"props":20391,"children":20392},{"class":211,"line":288},[20393],{"type":21,"tag":209,"props":20394,"children":20395},{"emptyLinePlaceholder":248},[20396],{"type":26,"value":251},{"type":21,"tag":209,"props":20398,"children":20399},{"class":211,"line":307},[20400,20405,20409],{"type":21,"tag":209,"props":20401,"children":20402},{"style":222},[20403],{"type":26,"value":20404},"http_routing ",{"type":21,"tag":209,"props":20406,"children":20407},{"style":216},[20408],{"type":26,"value":1432},{"type":21,"tag":209,"props":20410,"children":20411},{"style":222},[20412],{"type":26,"value":10170},{"type":21,"tag":209,"props":20414,"children":20415},{"class":211,"line":325},[20416,20421,20426],{"type":21,"tag":209,"props":20417,"children":20418},{"style":222},[20419],{"type":26,"value":20420},"route(",{"type":21,"tag":209,"props":20422,"children":20423},{"style":233},[20424],{"type":26,"value":20425},"'http.request'",{"type":21,"tag":209,"props":20427,"children":20428},{"style":222},[20429],{"type":26,"value":20430},", consumers.index)\n",{"type":21,"tag":209,"props":20432,"children":20433},{"class":211,"line":334},[20434],{"type":21,"tag":209,"props":20435,"children":20436},{"style":222},[20437],{"type":26,"value":10292},{"type":21,"tag":209,"props":20439,"children":20440},{"class":211,"line":343},[20441],{"type":21,"tag":209,"props":20442,"children":20443},{"emptyLinePlaceholder":248},[20444],{"type":26,"value":251},{"type":21,"tag":209,"props":20446,"children":20447},{"class":211,"line":351},[20448,20453,20457],{"type":21,"tag":209,"props":20449,"children":20450},{"style":222},[20451],{"type":26,"value":20452},"stream_routing ",{"type":21,"tag":209,"props":20454,"children":20455},{"style":216},[20456],{"type":26,"value":1432},{"type":21,"tag":209,"props":20458,"children":20459},{"style":222},[20460],{"type":26,"value":10170},{"type":21,"tag":209,"props":20462,"children":20463},{"class":211,"line":444},[20464],{"type":21,"tag":209,"props":20465,"children":20466},{"emptyLinePlaceholder":248},[20467],{"type":26,"value":251},{"type":21,"tag":209,"props":20469,"children":20470},{"class":211,"line":454},[20471],{"type":21,"tag":209,"props":20472,"children":20473},{"style":222},[20474],{"type":26,"value":10292},{"type":21,"tag":209,"props":20476,"children":20477},{"class":211,"line":463},[20478],{"type":21,"tag":209,"props":20479,"children":20480},{"emptyLinePlaceholder":248},[20481],{"type":26,"value":251},{"type":21,"tag":209,"props":20483,"children":20484},{"class":211,"line":472},[20485,20490,20494],{"type":21,"tag":209,"props":20486,"children":20487},{"style":222},[20488],{"type":26,"value":20489},"channel_routing ",{"type":21,"tag":209,"props":20491,"children":20492},{"style":216},[20493],{"type":26,"value":1432},{"type":21,"tag":209,"props":20495,"children":20496},{"style":222},[20497],{"type":26,"value":10170},{"type":21,"tag":209,"props":20499,"children":20500},{"class":211,"line":480},[20501],{"type":21,"tag":209,"props":20502,"children":20503},{"style":222},[20504],{"type":26,"value":20505},"include(stream_routing)\n",{"type":21,"tag":209,"props":20507,"children":20508},{"class":211,"line":489},[20509],{"type":21,"tag":209,"props":20510,"children":20511},{"style":222},[20512],{"type":26,"value":10292},{"type":21,"tag":22,"props":20514,"children":20515},{},[20516,20518,20523,20525,20531],{"type":26,"value":20517},"We'll be fleshing this file out in Part 3, so stay tuned. In the meantime, you can also add urls as normal to ",{"type":21,"tag":63,"props":20519,"children":20521},{"className":20520},[],[20522],{"type":26,"value":20306},{"type":26,"value":20524},", referencing standard views, either in a ",{"type":21,"tag":63,"props":20526,"children":20528},{"className":20527},[],[20529],{"type":26,"value":20530},"views.py",{"type":26,"value":20532}," file, or in a directory - this is all exactly the same as it is in standard Django, without any need for changes to accommodate the new ASGI server.",{"type":21,"tag":22,"props":20534,"children":20535},{},[20536,20538,20543,20545,20551],{"type":26,"value":20537},"Next to the ",{"type":21,"tag":63,"props":20539,"children":20541},{"className":20540},[],[20542],{"type":26,"value":20530},{"type":26,"value":20544}," file in your application, add a new file named ",{"type":21,"tag":63,"props":20546,"children":20548},{"className":20547},[],[20549],{"type":26,"value":20550},"consumers.py",{"type":26,"value":20552},". These consumers will be the callables handling the routing we'll be setting up in routing.py - these are what will enable something like websocket requests and replies, rather than being tied into the standard Django view structure.",{"type":21,"tag":22,"props":20554,"children":20555},{},[20556,20558,20565],{"type":26,"value":20557},"For now, we'll put in a simple example of handling an http request, straight from the ",{"type":21,"tag":29,"props":20559,"children":20562},{"href":20560,"rel":20561},"https://channels.readthedocs.io/en/latest/getting-started.html#first-consumers",[93],[20563],{"type":26,"value":20564},"channels docs",{"type":26,"value":191},{"type":21,"tag":200,"props":20567,"children":20569},{"className":9840,"code":20568,"language":9842,"meta":8,"style":8},"from django.http import HttpResponse\nfrom channels.handler import AsgiHandler\n\ndef http_consumer(message):\n# Make standard HTTP response - access ASGI path attribute directly\nresponse = HttpResponse(\"Hello world! You asked for %s\" % message.content['path'])\n# Encode that response into message format (ASGI)\nfor chunk in AsgiHandler.encode_response(response):\nmessage.reply_channel.send(chunk)\n",[20570],{"type":21,"tag":63,"props":20571,"children":20572},{"__ignoreMap":8},[20573,20594,20615,20622,20639,20647,20698,20706,20729],{"type":21,"tag":209,"props":20574,"children":20575},{"class":211,"line":212},[20576,20580,20585,20589],{"type":21,"tag":209,"props":20577,"children":20578},{"style":216},[20579],{"type":26,"value":230},{"type":21,"tag":209,"props":20581,"children":20582},{"style":222},[20583],{"type":26,"value":20584}," django.http ",{"type":21,"tag":209,"props":20586,"children":20587},{"style":216},[20588],{"type":26,"value":219},{"type":21,"tag":209,"props":20590,"children":20591},{"style":222},[20592],{"type":26,"value":20593}," HttpResponse\n",{"type":21,"tag":209,"props":20595,"children":20596},{"class":211,"line":244},[20597,20601,20606,20610],{"type":21,"tag":209,"props":20598,"children":20599},{"style":216},[20600],{"type":26,"value":230},{"type":21,"tag":209,"props":20602,"children":20603},{"style":222},[20604],{"type":26,"value":20605}," channels.handler ",{"type":21,"tag":209,"props":20607,"children":20608},{"style":216},[20609],{"type":26,"value":219},{"type":21,"tag":209,"props":20611,"children":20612},{"style":222},[20613],{"type":26,"value":20614}," AsgiHandler\n",{"type":21,"tag":209,"props":20616,"children":20617},{"class":211,"line":254},[20618],{"type":21,"tag":209,"props":20619,"children":20620},{"emptyLinePlaceholder":248},[20621],{"type":26,"value":251},{"type":21,"tag":209,"props":20623,"children":20624},{"class":211,"line":279},[20625,20629,20634],{"type":21,"tag":209,"props":20626,"children":20627},{"style":216},[20628],{"type":26,"value":9882},{"type":21,"tag":209,"props":20630,"children":20631},{"style":360},[20632],{"type":26,"value":20633}," http_consumer",{"type":21,"tag":209,"props":20635,"children":20636},{"style":222},[20637],{"type":26,"value":20638},"(message):\n",{"type":21,"tag":209,"props":20640,"children":20641},{"class":211,"line":288},[20642],{"type":21,"tag":209,"props":20643,"children":20644},{"style":448},[20645],{"type":26,"value":20646},"# Make standard HTTP response - access ASGI path attribute directly\n",{"type":21,"tag":209,"props":20648,"children":20649},{"class":211,"line":307},[20650,20655,20659,20664,20669,20674,20678,20683,20688,20693],{"type":21,"tag":209,"props":20651,"children":20652},{"style":222},[20653],{"type":26,"value":20654},"response ",{"type":21,"tag":209,"props":20656,"children":20657},{"style":216},[20658],{"type":26,"value":1432},{"type":21,"tag":209,"props":20660,"children":20661},{"style":222},[20662],{"type":26,"value":20663}," HttpResponse(",{"type":21,"tag":209,"props":20665,"children":20666},{"style":233},[20667],{"type":26,"value":20668},"\"Hello world! You asked for ",{"type":21,"tag":209,"props":20670,"children":20671},{"style":263},[20672],{"type":26,"value":20673},"%s",{"type":21,"tag":209,"props":20675,"children":20676},{"style":233},[20677],{"type":26,"value":10018},{"type":21,"tag":209,"props":20679,"children":20680},{"style":216},[20681],{"type":26,"value":20682}," %",{"type":21,"tag":209,"props":20684,"children":20685},{"style":222},[20686],{"type":26,"value":20687}," message.content[",{"type":21,"tag":209,"props":20689,"children":20690},{"style":233},[20691],{"type":26,"value":20692},"'path'",{"type":21,"tag":209,"props":20694,"children":20695},{"style":222},[20696],{"type":26,"value":20697},"])\n",{"type":21,"tag":209,"props":20699,"children":20700},{"class":211,"line":325},[20701],{"type":21,"tag":209,"props":20702,"children":20703},{"style":448},[20704],{"type":26,"value":20705},"# Encode that response into message format (ASGI)\n",{"type":21,"tag":209,"props":20707,"children":20708},{"class":211,"line":334},[20709,20714,20719,20724],{"type":21,"tag":209,"props":20710,"children":20711},{"style":216},[20712],{"type":26,"value":20713},"for",{"type":21,"tag":209,"props":20715,"children":20716},{"style":222},[20717],{"type":26,"value":20718}," chunk ",{"type":21,"tag":209,"props":20720,"children":20721},{"style":216},[20722],{"type":26,"value":20723},"in",{"type":21,"tag":209,"props":20725,"children":20726},{"style":222},[20727],{"type":26,"value":20728}," AsgiHandler.encode_response(response):\n",{"type":21,"tag":209,"props":20730,"children":20731},{"class":211,"line":343},[20732],{"type":21,"tag":209,"props":20733,"children":20734},{"style":222},[20735],{"type":26,"value":20736},"message.reply_channel.send(chunk)\n",{"type":21,"tag":22,"props":20738,"children":20739},{},[20740,20742,20748,20750,20756],{"type":26,"value":20741},"Finally, we need to create an ",{"type":21,"tag":63,"props":20743,"children":20745},{"className":20744},[],[20746],{"type":26,"value":20747},"asgi.py",{"type":26,"value":20749}," file - this should sit right next to the ",{"type":21,"tag":63,"props":20751,"children":20753},{"className":20752},[],[20754],{"type":26,"value":20755},"wsgi.py",{"type":26,"value":20757}," file that was automatically created for you by Django.",{"type":21,"tag":22,"props":20759,"children":20760},{},[20761],{"type":26,"value":20762},"It's pretty simple:",{"type":21,"tag":200,"props":20764,"children":20766},{"className":9840,"code":20765,"language":9842,"meta":8,"style":8},"import os\nfrom channels.asgi import get_channel_layer\n\nos.environ.setdefault(\"DJANGO_SETTINGS_MODULE\", \"yourapp.settings\")\n\nchannel_layer = get_channel_layer()\n",[20767],{"type":21,"tag":63,"props":20768,"children":20769},{"__ignoreMap":8},[20770,20782,20803,20810,20836,20843],{"type":21,"tag":209,"props":20771,"children":20772},{"class":211,"line":212},[20773,20777],{"type":21,"tag":209,"props":20774,"children":20775},{"style":216},[20776],{"type":26,"value":219},{"type":21,"tag":209,"props":20778,"children":20779},{"style":222},[20780],{"type":26,"value":20781}," os\n",{"type":21,"tag":209,"props":20783,"children":20784},{"class":211,"line":244},[20785,20789,20794,20798],{"type":21,"tag":209,"props":20786,"children":20787},{"style":216},[20788],{"type":26,"value":230},{"type":21,"tag":209,"props":20790,"children":20791},{"style":222},[20792],{"type":26,"value":20793}," channels.asgi ",{"type":21,"tag":209,"props":20795,"children":20796},{"style":216},[20797],{"type":26,"value":219},{"type":21,"tag":209,"props":20799,"children":20800},{"style":222},[20801],{"type":26,"value":20802}," get_channel_layer\n",{"type":21,"tag":209,"props":20804,"children":20805},{"class":211,"line":254},[20806],{"type":21,"tag":209,"props":20807,"children":20808},{"emptyLinePlaceholder":248},[20809],{"type":26,"value":251},{"type":21,"tag":209,"props":20811,"children":20812},{"class":211,"line":279},[20813,20818,20823,20827,20832],{"type":21,"tag":209,"props":20814,"children":20815},{"style":222},[20816],{"type":26,"value":20817},"os.environ.setdefault(",{"type":21,"tag":209,"props":20819,"children":20820},{"style":233},[20821],{"type":26,"value":20822},"\"DJANGO_SETTINGS_MODULE\"",{"type":21,"tag":209,"props":20824,"children":20825},{"style":222},[20826],{"type":26,"value":408},{"type":21,"tag":209,"props":20828,"children":20829},{"style":233},[20830],{"type":26,"value":20831},"\"yourapp.settings\"",{"type":21,"tag":209,"props":20833,"children":20834},{"style":222},[20835],{"type":26,"value":10112},{"type":21,"tag":209,"props":20837,"children":20838},{"class":211,"line":288},[20839],{"type":21,"tag":209,"props":20840,"children":20841},{"emptyLinePlaceholder":248},[20842],{"type":26,"value":251},{"type":21,"tag":209,"props":20844,"children":20845},{"class":211,"line":307},[20846,20851,20855],{"type":21,"tag":209,"props":20847,"children":20848},{"style":222},[20849],{"type":26,"value":20850},"channel_layer ",{"type":21,"tag":209,"props":20852,"children":20853},{"style":216},[20854],{"type":26,"value":1432},{"type":21,"tag":209,"props":20856,"children":20857},{"style":222},[20858],{"type":26,"value":20859}," get_channel_layer()\n",{"type":21,"tag":22,"props":20861,"children":20862},{},[20863,20865,20871],{"type":26,"value":20864},"This is the file we're referencing in the supervisord config when we wrote ",{"type":21,"tag":63,"props":20866,"children":20868},{"className":20867},[],[20869],{"type":26,"value":20870},"command=/home/web/venv/bin/daphne -b 127.0.0.1 -p 8000 yourapp.asgi:channel_layer",{"type":26,"value":20872},", so now that it's in place, we have all the pieces in place.",{"type":21,"tag":22,"props":20874,"children":20875},{},[20876,20878,20884,20886,20891],{"type":26,"value":20877},"Restart the supervisord service (",{"type":21,"tag":63,"props":20879,"children":20881},{"className":20880},[],[20882],{"type":26,"value":20883},"service supervisord restart",{"type":26,"value":20885},"), and in a few seconds you should be able to check status (",{"type":21,"tag":63,"props":20887,"children":20889},{"className":20888},[],[20890],{"type":26,"value":19917},{"type":26,"value":20892},") and see both of our program entries up and running!",{"type":21,"tag":22,"props":20894,"children":20895},{},[20896],{"type":26,"value":20897},"Which is great! Give yourself a pat on the back. However, we have one step left. Right now, our interace server is bound to port 8000, which is fine for development, but we need to serve up requests on port 80 in production. Now, we could bind to port 80 instead, but that will require running Daphne with root permissions. Instead, let's borrow the common approach with WSGI servers, and setup a reverse proxy with Nginx.",{"type":21,"tag":51,"props":20899,"children":20901},{"id":20900},"last-step-nginx-setup",[20902],{"type":26,"value":20903},"Last Step - Nginx Setup",{"type":21,"tag":22,"props":20905,"children":20906},{},[20907,20909,20914],{"type":26,"value":20908},"Now, it doesn't ",{"type":21,"tag":1084,"props":20910,"children":20911},{},[20912],{"type":26,"value":20913},"have",{"type":26,"value":20915}," to be Nginx - Apache could handle this duty, as could a number of others.",{"type":21,"tag":22,"props":20917,"children":20918},{},[20919],{"type":26,"value":20920},"In the meantime, however, Nginx it is, so let's take a look at the nicely straightforward setup.",{"type":21,"tag":22,"props":20922,"children":20923},{},[20924,20926,20932,20934,20940],{"type":26,"value":20925},"Head to ",{"type":21,"tag":63,"props":20927,"children":20929},{"className":20928},[],[20930],{"type":26,"value":20931},"/etc/nginx/sites-available/",{"type":26,"value":20933}," and create a new, appropriately named file (e.g. ",{"type":21,"tag":63,"props":20935,"children":20937},{"className":20936},[],[20938],{"type":26,"value":20939},"yourapp",{"type":26,"value":20941},"), and edit it to include the following:",{"type":21,"tag":200,"props":20943,"children":20945},{"className":9840,"code":20944,"language":9842,"meta":8,"style":8},"# Enable upgrading of connection (and websocket proxying) depending on the\n# presence of the upgrade field in the client request header\nmap \\$http_upgrade \\$connection_upgrade {\ndefault upgrade;\n'' close;\n}\n\n# Create an upstream alias to where we've set daphne to bind to\nupstream yourapp {\nserver 127.0.0.1:8000;\n}\n\nserver {\n\nlisten 80;\n# If you have a domain name, this is where to add it\nserver_name localhost;\n\nlocation / {\n# Pass request to the upstream alias\nproxy_pass http://yourapp;\n\n# Require http version 1.1 to allow for upgrade requests\nproxy_http_version 1.1;\n\n# We want proxy_buffering off for proxying to websockets.\nproxy_buffering off;\n\n# http://en.wikipedia.org/wiki/X-Forwarded-For\nproxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n# enable this if you use HTTPS:\n# proxy_set_header X-Forwarded-Proto https;\n\n# pass the Host: header from the client for the sake of redirects\nproxy_set_header Host $http_host;\n\n# We've set the Host header, so we don't need Nginx to muddle\n# about with redirects\nproxy_redirect off;\n\n# Depending on the request value, set the Upgrade and\n# connection headers\nproxy_set_header Upgrade $http_upgrade;\n\nproxy_set_header Connection $connection_upgrade;\n}\n}\n",[20946],{"type":21,"tag":63,"props":20947,"children":20948},{"__ignoreMap":8},[20949,20957,20965,20983,20995,21011,21018,21025,21033,21041,21068,21075,21082,21090,21097,21114,21122,21130,21137,21153,21161,21179,21186,21194,21211,21218,21226,21234,21241,21249,21284,21291,21299,21307,21314,21322,21339,21346,21354,21362,21370,21377,21385,21393,21410,21417,21434,21441],{"type":21,"tag":209,"props":20950,"children":20951},{"class":211,"line":212},[20952],{"type":21,"tag":209,"props":20953,"children":20954},{"style":448},[20955],{"type":26,"value":20956},"# Enable upgrading of connection (and websocket proxying) depending on the\n",{"type":21,"tag":209,"props":20958,"children":20959},{"class":211,"line":244},[20960],{"type":21,"tag":209,"props":20961,"children":20962},{"style":448},[20963],{"type":26,"value":20964},"# presence of the upgrade field in the client request header\n",{"type":21,"tag":209,"props":20966,"children":20967},{"class":211,"line":254},[20968,20972,20977],{"type":21,"tag":209,"props":20969,"children":20970},{"style":263},[20971],{"type":26,"value":11972},{"type":21,"tag":209,"props":20973,"children":20974},{"style":222},[20975],{"type":26,"value":20976}," \\",{"type":21,"tag":209,"props":20978,"children":20980},{"style":20979},"--shiki-default:#B31D28;--shiki-default-font-style:italic;--shiki-dark:#FDAEB7;--shiki-dark-font-style:italic",[20981],{"type":26,"value":20982},"$http_upgrade \\$connection_upgrade {\n",{"type":21,"tag":209,"props":20984,"children":20985},{"class":211,"line":279},[20986,20991],{"type":21,"tag":209,"props":20987,"children":20988},{"style":222},[20989],{"type":26,"value":20990},"default upgrade",{"type":21,"tag":209,"props":20992,"children":20993},{"style":20979},[20994],{"type":26,"value":241},{"type":21,"tag":209,"props":20996,"children":20997},{"class":211,"line":288},[20998,21002,21007],{"type":21,"tag":209,"props":20999,"children":21000},{"style":233},[21001],{"type":26,"value":20111},{"type":21,"tag":209,"props":21003,"children":21004},{"style":222},[21005],{"type":26,"value":21006}," close",{"type":21,"tag":209,"props":21008,"children":21009},{"style":20979},[21010],{"type":26,"value":241},{"type":21,"tag":209,"props":21012,"children":21013},{"class":211,"line":307},[21014],{"type":21,"tag":209,"props":21015,"children":21016},{"style":222},[21017],{"type":26,"value":7798},{"type":21,"tag":209,"props":21019,"children":21020},{"class":211,"line":325},[21021],{"type":21,"tag":209,"props":21022,"children":21023},{"emptyLinePlaceholder":248},[21024],{"type":26,"value":251},{"type":21,"tag":209,"props":21026,"children":21027},{"class":211,"line":334},[21028],{"type":21,"tag":209,"props":21029,"children":21030},{"style":448},[21031],{"type":26,"value":21032},"# Create an upstream alias to where we've set daphne to bind to\n",{"type":21,"tag":209,"props":21034,"children":21035},{"class":211,"line":343},[21036],{"type":21,"tag":209,"props":21037,"children":21038},{"style":222},[21039],{"type":26,"value":21040},"upstream yourapp {\n",{"type":21,"tag":209,"props":21042,"children":21043},{"class":211,"line":351},[21044,21049,21054,21059,21064],{"type":21,"tag":209,"props":21045,"children":21046},{"style":222},[21047],{"type":26,"value":21048},"server ",{"type":21,"tag":209,"props":21050,"children":21051},{"style":263},[21052],{"type":26,"value":21053},"127.0",{"type":21,"tag":209,"props":21055,"children":21056},{"style":222},[21057],{"type":26,"value":21058},".0.1:",{"type":21,"tag":209,"props":21060,"children":21061},{"style":263},[21062],{"type":26,"value":21063},"8000",{"type":21,"tag":209,"props":21065,"children":21066},{"style":222},[21067],{"type":26,"value":241},{"type":21,"tag":209,"props":21069,"children":21070},{"class":211,"line":444},[21071],{"type":21,"tag":209,"props":21072,"children":21073},{"style":222},[21074],{"type":26,"value":7798},{"type":21,"tag":209,"props":21076,"children":21077},{"class":211,"line":454},[21078],{"type":21,"tag":209,"props":21079,"children":21080},{"emptyLinePlaceholder":248},[21081],{"type":26,"value":251},{"type":21,"tag":209,"props":21083,"children":21084},{"class":211,"line":463},[21085],{"type":21,"tag":209,"props":21086,"children":21087},{"style":222},[21088],{"type":26,"value":21089},"server {\n",{"type":21,"tag":209,"props":21091,"children":21092},{"class":211,"line":472},[21093],{"type":21,"tag":209,"props":21094,"children":21095},{"emptyLinePlaceholder":248},[21096],{"type":26,"value":251},{"type":21,"tag":209,"props":21098,"children":21099},{"class":211,"line":480},[21100,21105,21110],{"type":21,"tag":209,"props":21101,"children":21102},{"style":222},[21103],{"type":26,"value":21104},"listen ",{"type":21,"tag":209,"props":21106,"children":21107},{"style":263},[21108],{"type":26,"value":21109},"80",{"type":21,"tag":209,"props":21111,"children":21112},{"style":222},[21113],{"type":26,"value":241},{"type":21,"tag":209,"props":21115,"children":21116},{"class":211,"line":489},[21117],{"type":21,"tag":209,"props":21118,"children":21119},{"style":448},[21120],{"type":26,"value":21121},"# If you have a domain name, this is where to add it\n",{"type":21,"tag":209,"props":21123,"children":21124},{"class":211,"line":847},[21125],{"type":21,"tag":209,"props":21126,"children":21127},{"style":222},[21128],{"type":26,"value":21129},"server_name localhost;\n",{"type":21,"tag":209,"props":21131,"children":21132},{"class":211,"line":860},[21133],{"type":21,"tag":209,"props":21134,"children":21135},{"emptyLinePlaceholder":248},[21136],{"type":26,"value":251},{"type":21,"tag":209,"props":21138,"children":21139},{"class":211,"line":877},[21140,21145,21149],{"type":21,"tag":209,"props":21141,"children":21142},{"style":222},[21143],{"type":26,"value":21144},"location ",{"type":21,"tag":209,"props":21146,"children":21147},{"style":216},[21148],{"type":26,"value":9749},{"type":21,"tag":209,"props":21150,"children":21151},{"style":222},[21152],{"type":26,"value":276},{"type":21,"tag":209,"props":21154,"children":21155},{"class":211,"line":889},[21156],{"type":21,"tag":209,"props":21157,"children":21158},{"style":448},[21159],{"type":26,"value":21160},"# Pass request to the upstream alias\n",{"type":21,"tag":209,"props":21162,"children":21163},{"class":211,"line":902},[21164,21169,21174],{"type":21,"tag":209,"props":21165,"children":21166},{"style":222},[21167],{"type":26,"value":21168},"proxy_pass http:",{"type":21,"tag":209,"props":21170,"children":21171},{"style":216},[21172],{"type":26,"value":21173},"//",{"type":21,"tag":209,"props":21175,"children":21176},{"style":222},[21177],{"type":26,"value":21178},"yourapp;\n",{"type":21,"tag":209,"props":21180,"children":21181},{"class":211,"line":914},[21182],{"type":21,"tag":209,"props":21183,"children":21184},{"emptyLinePlaceholder":248},[21185],{"type":26,"value":251},{"type":21,"tag":209,"props":21187,"children":21188},{"class":211,"line":922},[21189],{"type":21,"tag":209,"props":21190,"children":21191},{"style":448},[21192],{"type":26,"value":21193},"# Require http version 1.1 to allow for upgrade requests\n",{"type":21,"tag":209,"props":21195,"children":21196},{"class":211,"line":2312},[21197,21202,21207],{"type":21,"tag":209,"props":21198,"children":21199},{"style":222},[21200],{"type":26,"value":21201},"proxy_http_version ",{"type":21,"tag":209,"props":21203,"children":21204},{"style":263},[21205],{"type":26,"value":21206},"1.1",{"type":21,"tag":209,"props":21208,"children":21209},{"style":222},[21210],{"type":26,"value":241},{"type":21,"tag":209,"props":21212,"children":21213},{"class":211,"line":2321},[21214],{"type":21,"tag":209,"props":21215,"children":21216},{"emptyLinePlaceholder":248},[21217],{"type":26,"value":251},{"type":21,"tag":209,"props":21219,"children":21220},{"class":211,"line":2372},[21221],{"type":21,"tag":209,"props":21222,"children":21223},{"style":448},[21224],{"type":26,"value":21225},"# We want proxy_buffering off for proxying to websockets.\n",{"type":21,"tag":209,"props":21227,"children":21228},{"class":211,"line":2381},[21229],{"type":21,"tag":209,"props":21230,"children":21231},{"style":222},[21232],{"type":26,"value":21233},"proxy_buffering off;\n",{"type":21,"tag":209,"props":21235,"children":21236},{"class":211,"line":2389},[21237],{"type":21,"tag":209,"props":21238,"children":21239},{"emptyLinePlaceholder":248},[21240],{"type":26,"value":251},{"type":21,"tag":209,"props":21242,"children":21243},{"class":211,"line":2397},[21244],{"type":21,"tag":209,"props":21245,"children":21246},{"style":448},[21247],{"type":26,"value":21248},"# http://en.wikipedia.org/wiki/X-Forwarded-For\n",{"type":21,"tag":209,"props":21250,"children":21251},{"class":211,"line":2406},[21252,21257,21261,21266,21270,21275,21279],{"type":21,"tag":209,"props":21253,"children":21254},{"style":222},[21255],{"type":26,"value":21256},"proxy_set_header X",{"type":21,"tag":209,"props":21258,"children":21259},{"style":216},[21260],{"type":26,"value":13012},{"type":21,"tag":209,"props":21262,"children":21263},{"style":222},[21264],{"type":26,"value":21265},"Forwarded",{"type":21,"tag":209,"props":21267,"children":21268},{"style":216},[21269],{"type":26,"value":13012},{"type":21,"tag":209,"props":21271,"children":21272},{"style":222},[21273],{"type":26,"value":21274},"For ",{"type":21,"tag":209,"props":21276,"children":21277},{"style":20979},[21278],{"type":26,"value":10250},{"type":21,"tag":209,"props":21280,"children":21281},{"style":222},[21282],{"type":26,"value":21283},"proxy_add_x_forwarded_for;\n",{"type":21,"tag":209,"props":21285,"children":21286},{"class":211,"line":2415},[21287],{"type":21,"tag":209,"props":21288,"children":21289},{"emptyLinePlaceholder":248},[21290],{"type":26,"value":251},{"type":21,"tag":209,"props":21292,"children":21293},{"class":211,"line":2424},[21294],{"type":21,"tag":209,"props":21295,"children":21296},{"style":448},[21297],{"type":26,"value":21298},"# enable this if you use HTTPS:\n",{"type":21,"tag":209,"props":21300,"children":21301},{"class":211,"line":2433},[21302],{"type":21,"tag":209,"props":21303,"children":21304},{"style":448},[21305],{"type":26,"value":21306},"# proxy_set_header X-Forwarded-Proto https;\n",{"type":21,"tag":209,"props":21308,"children":21309},{"class":211,"line":2442},[21310],{"type":21,"tag":209,"props":21311,"children":21312},{"emptyLinePlaceholder":248},[21313],{"type":26,"value":251},{"type":21,"tag":209,"props":21315,"children":21316},{"class":211,"line":2471},[21317],{"type":21,"tag":209,"props":21318,"children":21319},{"style":448},[21320],{"type":26,"value":21321},"# pass the Host: header from the client for the sake of redirects\n",{"type":21,"tag":209,"props":21323,"children":21324},{"class":211,"line":2480},[21325,21330,21334],{"type":21,"tag":209,"props":21326,"children":21327},{"style":222},[21328],{"type":26,"value":21329},"proxy_set_header Host ",{"type":21,"tag":209,"props":21331,"children":21332},{"style":20979},[21333],{"type":26,"value":10250},{"type":21,"tag":209,"props":21335,"children":21336},{"style":222},[21337],{"type":26,"value":21338},"http_host;\n",{"type":21,"tag":209,"props":21340,"children":21341},{"class":211,"line":2489},[21342],{"type":21,"tag":209,"props":21343,"children":21344},{"emptyLinePlaceholder":248},[21345],{"type":26,"value":251},{"type":21,"tag":209,"props":21347,"children":21348},{"class":211,"line":2516},[21349],{"type":21,"tag":209,"props":21350,"children":21351},{"style":448},[21352],{"type":26,"value":21353},"# We've set the Host header, so we don't need Nginx to muddle\n",{"type":21,"tag":209,"props":21355,"children":21356},{"class":211,"line":2525},[21357],{"type":21,"tag":209,"props":21358,"children":21359},{"style":448},[21360],{"type":26,"value":21361},"# about with redirects\n",{"type":21,"tag":209,"props":21363,"children":21364},{"class":211,"line":2533},[21365],{"type":21,"tag":209,"props":21366,"children":21367},{"style":222},[21368],{"type":26,"value":21369},"proxy_redirect off;\n",{"type":21,"tag":209,"props":21371,"children":21372},{"class":211,"line":2542},[21373],{"type":21,"tag":209,"props":21374,"children":21375},{"emptyLinePlaceholder":248},[21376],{"type":26,"value":251},{"type":21,"tag":209,"props":21378,"children":21379},{"class":211,"line":2550},[21380],{"type":21,"tag":209,"props":21381,"children":21382},{"style":448},[21383],{"type":26,"value":21384},"# Depending on the request value, set the Upgrade and\n",{"type":21,"tag":209,"props":21386,"children":21387},{"class":211,"line":2564},[21388],{"type":21,"tag":209,"props":21389,"children":21390},{"style":448},[21391],{"type":26,"value":21392},"# connection headers\n",{"type":21,"tag":209,"props":21394,"children":21395},{"class":211,"line":2611},[21396,21401,21405],{"type":21,"tag":209,"props":21397,"children":21398},{"style":222},[21399],{"type":26,"value":21400},"proxy_set_header Upgrade ",{"type":21,"tag":209,"props":21402,"children":21403},{"style":20979},[21404],{"type":26,"value":10250},{"type":21,"tag":209,"props":21406,"children":21407},{"style":222},[21408],{"type":26,"value":21409},"http_upgrade;\n",{"type":21,"tag":209,"props":21411,"children":21412},{"class":211,"line":2619},[21413],{"type":21,"tag":209,"props":21414,"children":21415},{"emptyLinePlaceholder":248},[21416],{"type":26,"value":251},{"type":21,"tag":209,"props":21418,"children":21419},{"class":211,"line":2627},[21420,21425,21429],{"type":21,"tag":209,"props":21421,"children":21422},{"style":222},[21423],{"type":26,"value":21424},"proxy_set_header Connection ",{"type":21,"tag":209,"props":21426,"children":21427},{"style":20979},[21428],{"type":26,"value":10250},{"type":21,"tag":209,"props":21430,"children":21431},{"style":222},[21432],{"type":26,"value":21433},"connection_upgrade;\n",{"type":21,"tag":209,"props":21435,"children":21436},{"class":211,"line":2636},[21437],{"type":21,"tag":209,"props":21438,"children":21439},{"style":222},[21440],{"type":26,"value":7798},{"type":21,"tag":209,"props":21442,"children":21443},{"class":211,"line":2644},[21444],{"type":21,"tag":209,"props":21445,"children":21446},{"style":222},[21447],{"type":26,"value":7798},{"type":21,"tag":17597,"props":21449,"children":21451},{"id":21450},"freebsd-note",[21452],{"type":26,"value":21453},"FreeBSD note:",{"type":21,"tag":22,"props":21455,"children":21456},{},[21457],{"type":26,"value":21458},"Chances are good that your Nginx conf may be in a directory like /usr/local/etc/nginx - you'll either need to alter it to support imports, or simply edit the file to include the above directives.",{"type":21,"tag":22,"props":21460,"children":21461},{},[21462,21464,21470,21472,21478],{"type":26,"value":21463},"Now, check your config for sanity with ",{"type":21,"tag":63,"props":21465,"children":21467},{"className":21466},[],[21468],{"type":26,"value":21469},"nginx -t",{"type":26,"value":21471}," and, if all is well, restart the nginx service ",{"type":21,"tag":63,"props":21473,"children":21475},{"className":21474},[],[21476],{"type":26,"value":21477},"service nginx restart",{"type":26,"value":378},{"type":21,"tag":22,"props":21480,"children":21481},{},[21482],{"type":26,"value":21483},"Now, push your changes to the server, and navigate to it in your browser. If is all well, you should see the simple message from the http.request consumer you set up. What is this feeling. Is this... joy?",{"type":21,"tag":3549,"props":21485,"children":21486},{"id":18849},[21487],{"type":26,"value":18852},{"type":21,"tag":22,"props":21489,"children":21490},{},[21491,21493,21498],{"type":26,"value":21492},"Well, now, all set up with a stack that wouldn't make a dev-op cry, not bad! It... doesn't really ",{"type":21,"tag":1084,"props":21494,"children":21495},{},[21496],{"type":26,"value":21497},"do",{"type":26,"value":21499}," anything yet, though, does it? Next time, we'll be looking at getting some simple websocket communication up and running.",{"type":21,"tag":22,"props":21501,"children":21502},{},[21503,21505,21510],{"type":26,"value":21504},"Not a chat server, though. Everyone does a chat server. Instead, let's try something a little more ambitious - how about real time media from an ",{"type":21,"tag":1084,"props":21506,"children":21507},{},[21508],{"type":26,"value":21509},"rtsp stream",{"type":26,"value":21511},", straight into the browser?",{"type":21,"tag":22,"props":21513,"children":21514},{},[21515,21517,21523],{"type":26,"value":21516},"If you're running into any issues with the above, I suggest that a quick question to the good folks at ",{"type":21,"tag":29,"props":21518,"children":21520},{"href":21519},"stackoverflow.com",[21521],{"type":26,"value":21522},"Stack Overflow",{"type":26,"value":21524}," will likely avail you best; and as always, if you notice any mistakes in the article, or just have something to say, the comment section awaits.",{"type":21,"tag":3490,"props":21526,"children":21527},{},[21528],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":21530},[21531,21532,21533,21534,21535,21536,21537],{"id":18953,"depth":254,"text":18956},{"id":19363,"depth":254,"text":19366},{"id":19462,"depth":254,"text":19465},{"id":19871,"depth":254,"text":19874},{"id":19903,"depth":254,"text":19906},{"id":20900,"depth":254,"text":20903},{"id":18849,"depth":244,"text":18852},"content:ckeefer:2016-4:djangochannels2.md","ckeefer/2016-4/djangochannels2.md","ckeefer/2016-4/djangochannels2",{"user":3518,"name":3519},{"_path":21543,"_dir":21544,"_draft":7,"_partial":7,"_locale":8,"title":21545,"description":21546,"publishDate":21547,"tags":21548,"excerpt":21546,"body":21549,"_type":3511,"_id":23204,"_source":3513,"_file":23205,"_stem":23206,"_extension":3516,"author":23207},"/ckeefer/2016-3/djangochannels1","2016-3","Django Channels: From the Ground Up - Part 1","You stare mournfully into the mass of code you've inherited. At some point, it's clear, the requirements called for the server to push information to the client, because there's an unholy mix of Server-Side Events, long-polling, hidden iframes and even a Java applet in there, all supporting some level of long-term connectivity with the server. It's almost fascinating in its barely functional hideousness, and you would be inclined to leave well enough alone... except for the new feature specifications you've been assigned, which require the client to be able to send data back to the server in response to the received events, in as close to real-time as you can get.","2016-06-13",[18916,9842,18917],{"type":18,"children":21550,"toc":23191},[21551,21572,21586,21592,21639,21644,21649,21663,21676,21689,21694,21700,21706,21720,21725,21731,21745,21750,21755,21793,21798,21816,21821,21826,21832,21837,21842,21933,21938,21977,21982,22006,22028,22033,22039,22044,22049,22075,22086,22091,22139,22145,22158,22163,22357,22362,22406,22410,22454,22460,22473,22501,22515,22520,22525,22536,22542,22556,22561,22600,22605,22646,22659,22663,22896,22900,23105,23125,23146,23158,23163,23175,23187],{"type":21,"tag":22,"props":21552,"children":21553},{},[21554,21556,21563,21565,21570],{"type":26,"value":21555},"You stare mournfully into the mass of code you've inherited. At some point, it's clear, the requirements called for the server to push information to the client, because there's an unholy mix of ",{"type":21,"tag":29,"props":21557,"children":21560},{"href":21558,"rel":21559},"https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events",[93],[21561],{"type":26,"value":21562},"Server-Side Events",{"type":26,"value":21564},", long-polling, hidden iframes and even a Java applet in there, all supporting some level of long-term connectivity with the server. It's almost fascinating in its barely functional hideousness, and you would be inclined to leave well enough alone... except for the ",{"type":21,"tag":1084,"props":21566,"children":21567},{},[21568],{"type":26,"value":21569},"new",{"type":26,"value":21571}," feature specifications you've been assigned, which require the client to be able to send data back to the server in response to the received events, in as close to real-time as you can get.",{"type":21,"tag":22,"props":21573,"children":21574},{},[21575,21577,21584],{"type":26,"value":21576},"It's time for a major overhaul. Only ",{"type":21,"tag":29,"props":21578,"children":21581},{"href":21579,"rel":21580},"https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API",[93],[21582],{"type":26,"value":21583},"Websockets",{"type":26,"value":21585}," can save us now. And, as it so happens, one of your favourite frameworks just added support for real-time, bi-directional communication...",{"type":21,"tag":3549,"props":21587,"children":21589},{"id":21588},"adding-more-batteries",[21590],{"type":26,"value":21591},"Adding More Batteries",{"type":21,"tag":22,"props":21593,"children":21594},{},[21595,21597,21604,21606,21611,21613,21620,21622,21629,21631,21638],{"type":26,"value":21596},"If you've been paying attention to the ",{"type":21,"tag":29,"props":21598,"children":21601},{"href":21599,"rel":21600},"https://www.djangoproject.com/",[93],[21602],{"type":26,"value":21603},"Django",{"type":26,"value":21605}," project, you've probably heard about ",{"type":21,"tag":29,"props":21607,"children":21609},{"href":18932,"rel":21608},[93],[21610],{"type":26,"value":18936},{"type":26,"value":21612},". A new server gateway interface (",{"type":21,"tag":29,"props":21614,"children":21617},{"href":21615,"rel":21616},"https://channels.readthedocs.io/en/latest/asgi.html",[93],[21618],{"type":26,"value":21619},"ASGI",{"type":26,"value":21621},"), a new server (",{"type":21,"tag":29,"props":21623,"children":21626},{"href":21624,"rel":21625},"https://github.com/andrewgodwin/daphne",[93],[21627],{"type":26,"value":21628},"Daphne",{"type":26,"value":21630},") and, as a result, new functionality - including support for Websockets and (at some near-future point) ",{"type":21,"tag":29,"props":21632,"children":21635},{"href":21633,"rel":21634},"https://en.wikipedia.org/wiki/HTTP/2",[93],[21636],{"type":26,"value":21637},"HTTP2",{"type":26,"value":378},{"type":21,"tag":22,"props":21640,"children":21641},{},[21642],{"type":26,"value":21643},"Support for websockets isn't new - Node.js (and thus, Express, Meteor, Sails, etc.) had them pretty much out of the box, and its event-based model is well suited to them. Even on the Python side of things, if you needed websockets, you could have them - Gevent, Tornado/Cyclone and Twisted had your back, amongst others. In fact, the preferred server for Django Channels, Daphne, is based on Twisted.",{"type":21,"tag":22,"props":21645,"children":21646},{},[21647],{"type":26,"value":21648},"So, the big news here isn't OMG Websockets, but rather Websockets + Django. Pyramid and Flask fans may scoff, but Django's batteries-included approach echoes that of Python itself, and enables some solid work that tends to be easier to maintain than, for instance, the special snowflakes that a large Flask project can end up as (your mileage may vary).",{"type":21,"tag":22,"props":21650,"children":21651},{},[21652,21654,21661],{"type":26,"value":21653},"So, if you're sold on Django, there's good reason to be excited about Channels. Although its inclusion in Django core has been ",{"type":21,"tag":29,"props":21655,"children":21658},{"href":21656,"rel":21657},"https://groups.google.com/d/topic/django-developers/QRd4v7OErT8/discussion",[93],[21659],{"type":26,"value":21660},"deferred",{"type":26,"value":21662}," for now, chances are good that it will see integration with the Django core project at some near-future point, making now a good time to get up to speed.",{"type":21,"tag":22,"props":21664,"children":21665},{},[21666,21668,21674],{"type":26,"value":21667},"For this short series of articles, we'll be looking at doing just that. While the ",{"type":21,"tag":29,"props":21669,"children":21671},{"href":18932,"rel":21670},[93],[21672],{"type":26,"value":21673},"Django Channels documentation",{"type":26,"value":21675}," lives up to the high standard set by the core Django documentation, it doesn't spend much time describing what a production-ready setup might look like, or how to achieve it. Additionally, like most tutorials for websockets, it focuses on a simple echo or chat server. We're going to go a step beyond, and take a look at what we need to setup real-time streaming video in the browser.",{"type":21,"tag":22,"props":21677,"children":21678},{},[21679,21681,21687],{"type":26,"value":21680},"For the first two articles, though, we'll focus on how to get our shiny new Django Channels installation up and running. We're going to cover a lot of ground, so we won't be able to focus too closely on the details. If you run into trouble, a quick search might do it for you - if not, I suggest you bring your question to the good people at ",{"type":21,"tag":29,"props":21682,"children":21685},{"href":21683,"rel":21684},"https://stackoverflow.com",[93],[21686],{"type":26,"value":21522},{"type":26,"value":21688},"; and if you note any mistakes in the article, or just have something to say, the comment section below awaits you.",{"type":21,"tag":22,"props":21690,"children":21691},{},[21692],{"type":26,"value":21693},"Let's get started, shall we?",{"type":21,"tag":193,"props":21695,"children":21697},{"id":21696},"penguins-or-daemons",[21698],{"type":26,"value":21699},"Penguins or Daemons?",{"type":21,"tag":17597,"props":21701,"children":21703},{"id":21702},"its-true-penguins-are-cuter-and-ive-never-had-to-kill-9-a-penguin",[21704],{"type":26,"value":21705},"It's true, penguins are cuter, and I've never had to kill -9 a penguin.",{"type":21,"tag":22,"props":21707,"children":21708},{},[21709,21711,21718],{"type":26,"value":21710},"One small additional wrinkle to the following documentation is that we're going to add some details for this same setup with ",{"type":21,"tag":29,"props":21712,"children":21715},{"href":21713,"rel":21714},"https://www.freebsd.org/",[93],[21716],{"type":26,"value":21717},"FreeBSD",{"type":26,"value":21719},". I've had some recent projects that have caused me to dip my toes into the BSD pool, and I noticed there's a relative lack of documentation for this sort of thing there, so we're going to help rectify that a little.",{"type":21,"tag":22,"props":21721,"children":21722},{},[21723],{"type":26,"value":21724},"Don't worry if you're planning to use a Linux flavour - in most cases, the instructions are either identical, or the differences will be called out.",{"type":21,"tag":3549,"props":21726,"children":21728},{"id":21727},"from-the-ground-up",[21729],{"type":26,"value":21730},"From the Ground Up",{"type":21,"tag":22,"props":21732,"children":21733},{},[21734,21736,21743],{"type":26,"value":21735},"Assumption: You have a relatively modern unix-like operating system. Windows folks, as ever in server-land, I'm afraid you're on your own (maybe now's a good time to look into ",{"type":21,"tag":29,"props":21737,"children":21740},{"href":21738,"rel":21739},"https://msdn.microsoft.com/en-us/commandline/wsl/about",[93],[21741],{"type":26,"value":21742},"Ubuntu on Windows",{"type":26,"value":21744},"?).",{"type":21,"tag":22,"props":21746,"children":21747},{},[21748],{"type":26,"value":21749},"We're going to be re-treading some ground that is likely very familiar for some of you, so bear with me - we're going to start up from scratch here.",{"type":21,"tag":22,"props":21751,"children":21752},{},[21753],{"type":26,"value":21754},"Now, let's discuss our stack. We're going to go with a set of software that should look familiar to anyone who's set up a basic, fairly production-worthy server with Django:",{"type":21,"tag":3677,"props":21756,"children":21757},{},[21758,21763,21768,21773,21778,21783,21788],{"type":21,"tag":3681,"props":21759,"children":21760},{},[21761],{"type":26,"value":21762},"Python (2.7+ or 3.4+);",{"type":21,"tag":3681,"props":21764,"children":21765},{},[21766],{"type":26,"value":21767},"Virtualenv;",{"type":21,"tag":3681,"props":21769,"children":21770},{},[21771],{"type":26,"value":21772},"Pip;",{"type":21,"tag":3681,"props":21774,"children":21775},{},[21776],{"type":26,"value":21777},"Nginx;",{"type":21,"tag":3681,"props":21779,"children":21780},{},[21781],{"type":26,"value":21782},"Postgresql;",{"type":21,"tag":3681,"props":21784,"children":21785},{},[21786],{"type":26,"value":21787},"Supervisord;",{"type":21,"tag":3681,"props":21789,"children":21790},{},[21791],{"type":26,"value":21792},"Django (1.8+).",{"type":21,"tag":22,"props":21794,"children":21795},{},[21796],{"type":26,"value":21797},"And adding some new elements to support Channels:",{"type":21,"tag":3677,"props":21799,"children":21800},{},[21801,21806,21811],{"type":21,"tag":3681,"props":21802,"children":21803},{},[21804],{"type":26,"value":21805},"Redis;",{"type":21,"tag":3681,"props":21807,"children":21808},{},[21809],{"type":26,"value":21810},"Daphne;",{"type":21,"tag":3681,"props":21812,"children":21813},{},[21814],{"type":26,"value":21815},"channels.",{"type":21,"tag":22,"props":21817,"children":21818},{},[21819],{"type":26,"value":21820},"Let's go through the setup step-by-step, and discuss the how and, in some cases, the why of our software stack.",{"type":21,"tag":22,"props":21822,"children":21823},{},[21824],{"type":26,"value":21825},"For this first part, we're going to go get us far enough to run Django using our shiny new ASGI server, via the usual development invocation; and in part 2, we'll be getting our stack somewhere approaching production ready.",{"type":21,"tag":51,"props":21827,"children":21829},{"id":21828},"package-installation",[21830],{"type":26,"value":21831},"Package Installation",{"type":21,"tag":22,"props":21833,"children":21834},{},[21835],{"type":26,"value":21836},"This step is nice and straightforward. Ask your friendly neighbourhood package manager for more details.",{"type":21,"tag":22,"props":21838,"children":21839},{},[21840],{"type":26,"value":21841},"Debian/Ubuntu one-liner:",{"type":21,"tag":200,"props":21843,"children":21847},{"className":21844,"code":21845,"language":21846,"meta":8,"style":8},"language-shell shiki shiki-themes github-light github-dark","sudo apt-get -y -q install python python-dev python-pip python-virtualenv libpq-dev postgresql postgresql-contrib nginx supervisor python-software-properties redis-server\n","shell",[21848],{"type":21,"tag":63,"props":21849,"children":21850},{"__ignoreMap":8},[21851],{"type":21,"tag":209,"props":21852,"children":21853},{"class":211,"line":212},[21854,21859,21864,21869,21874,21878,21883,21888,21893,21898,21903,21908,21913,21918,21923,21928],{"type":21,"tag":209,"props":21855,"children":21856},{"style":360},[21857],{"type":26,"value":21858},"sudo",{"type":21,"tag":209,"props":21860,"children":21861},{"style":233},[21862],{"type":26,"value":21863}," apt-get",{"type":21,"tag":209,"props":21865,"children":21866},{"style":263},[21867],{"type":26,"value":21868}," -y",{"type":21,"tag":209,"props":21870,"children":21871},{"style":263},[21872],{"type":26,"value":21873}," -q",{"type":21,"tag":209,"props":21875,"children":21876},{"style":233},[21877],{"type":26,"value":19081},{"type":21,"tag":209,"props":21879,"children":21880},{"style":233},[21881],{"type":26,"value":21882}," python",{"type":21,"tag":209,"props":21884,"children":21885},{"style":233},[21886],{"type":26,"value":21887}," python-dev",{"type":21,"tag":209,"props":21889,"children":21890},{"style":233},[21891],{"type":26,"value":21892}," python-pip",{"type":21,"tag":209,"props":21894,"children":21895},{"style":233},[21896],{"type":26,"value":21897}," python-virtualenv",{"type":21,"tag":209,"props":21899,"children":21900},{"style":233},[21901],{"type":26,"value":21902}," libpq-dev",{"type":21,"tag":209,"props":21904,"children":21905},{"style":233},[21906],{"type":26,"value":21907}," postgresql",{"type":21,"tag":209,"props":21909,"children":21910},{"style":233},[21911],{"type":26,"value":21912}," postgresql-contrib",{"type":21,"tag":209,"props":21914,"children":21915},{"style":233},[21916],{"type":26,"value":21917}," nginx",{"type":21,"tag":209,"props":21919,"children":21920},{"style":233},[21921],{"type":26,"value":21922}," supervisor",{"type":21,"tag":209,"props":21924,"children":21925},{"style":233},[21926],{"type":26,"value":21927}," python-software-properties",{"type":21,"tag":209,"props":21929,"children":21930},{"style":233},[21931],{"type":26,"value":21932}," redis-server\n",{"type":21,"tag":22,"props":21934,"children":21935},{},[21936],{"type":26,"value":21937},"FreeBSD example:",{"type":21,"tag":200,"props":21939,"children":21941},{"className":21844,"code":21940,"language":21846,"meta":8,"style":8},"cd /usr/ports/databases/postgresql95-server/ && make install clean\n",[21942],{"type":21,"tag":63,"props":21943,"children":21944},{"__ignoreMap":8},[21945],{"type":21,"tag":209,"props":21946,"children":21947},{"class":211,"line":212},[21948,21953,21958,21963,21968,21972],{"type":21,"tag":209,"props":21949,"children":21950},{"style":263},[21951],{"type":26,"value":21952},"cd",{"type":21,"tag":209,"props":21954,"children":21955},{"style":233},[21956],{"type":26,"value":21957}," /usr/ports/databases/postgresql95-server/",{"type":21,"tag":209,"props":21959,"children":21960},{"style":222},[21961],{"type":26,"value":21962}," && ",{"type":21,"tag":209,"props":21964,"children":21965},{"style":360},[21966],{"type":26,"value":21967},"make",{"type":21,"tag":209,"props":21969,"children":21970},{"style":233},[21971],{"type":26,"value":19081},{"type":21,"tag":209,"props":21973,"children":21974},{"style":233},[21975],{"type":26,"value":21976}," clean\n",{"type":21,"tag":22,"props":21978,"children":21979},{},[21980],{"type":26,"value":21981},"OR",{"type":21,"tag":200,"props":21983,"children":21985},{"className":21844,"code":21984,"language":21846,"meta":8,"style":8},"pkg install postgresql95-server\n",[21986],{"type":21,"tag":63,"props":21987,"children":21988},{"__ignoreMap":8},[21989],{"type":21,"tag":209,"props":21990,"children":21991},{"class":211,"line":212},[21992,21997,22001],{"type":21,"tag":209,"props":21993,"children":21994},{"style":360},[21995],{"type":26,"value":21996},"pkg",{"type":21,"tag":209,"props":21998,"children":21999},{"style":233},[22000],{"type":26,"value":19081},{"type":21,"tag":209,"props":22002,"children":22003},{"style":233},[22004],{"type":26,"value":22005}," postgresql95-server\n",{"type":21,"tag":22,"props":22007,"children":22008},{},[22009,22011,22017,22019,22026],{"type":26,"value":22010},"and repeat for python27 (e.g. ",{"type":21,"tag":63,"props":22012,"children":22014},{"className":22013},[],[22015],{"type":26,"value":22016},"pkg install python27",{"type":26,"value":22018},"), nginx, supervisord, etc. I suggest searching ",{"type":21,"tag":29,"props":22020,"children":22023},{"href":22021,"rel":22022},"https://www.freshports.org/",[93],[22024],{"type":26,"value":22025},"FreshPorts",{"type":26,"value":22027}," for the specific package names.",{"type":21,"tag":22,"props":22029,"children":22030},{},[22031],{"type":26,"value":22032},"If you're on FreeBSD, you'll also want to add the appropriate enable commands to rc.conf to allow these applications to start with the server.",{"type":21,"tag":51,"props":22034,"children":22036},{"id":22035},"user-virtualenv-setup",[22037],{"type":26,"value":22038},"User & VirtualEnv setup",{"type":21,"tag":22,"props":22040,"children":22041},{},[22042],{"type":26,"value":22043},"Now that we have our system packages installed, let's set up our python virtual environment in preparation for getting our python packages into place.",{"type":21,"tag":22,"props":22045,"children":22046},{},[22047],{"type":26,"value":22048},"First, we'll create a new, low-priviledged user who we want to run our server software - running web-facing processes as root can be a security faux pas.",{"type":21,"tag":22,"props":22050,"children":22051},{},[22052,22058,22060,22065,22067,22073],{"type":21,"tag":63,"props":22053,"children":22055},{"className":22054},[],[22056],{"type":26,"value":22057},"sudo adduser web",{"type":26,"value":22059}," (If using FreeBSD, drop the ",{"type":21,"tag":63,"props":22061,"children":22063},{"className":22062},[],[22064],{"type":26,"value":21858},{"type":26,"value":22066}," and execute this (and other commands requiring sudo) as root by ",{"type":21,"tag":63,"props":22068,"children":22070},{"className":22069},[],[22071],{"type":26,"value":22072},"su",{"type":26,"value":22074},"ing into root account, or else install sudo package).",{"type":21,"tag":22,"props":22076,"children":22077},{},[22078,22080],{"type":26,"value":22079},"Let's su in as this user... ",{"type":21,"tag":63,"props":22081,"children":22083},{"className":22082},[],[22084],{"type":26,"value":22085},"su web",{"type":21,"tag":22,"props":22087,"children":22088},{},[22089],{"type":26,"value":22090},"We're now going to drop our virtualenv directory (and, in a moment, our deploy directory) into this users home dir - we don't have to do it this way, of course, but this avoids some bothersome chmod'ing and chown'ing we'd have to do otherwise.",{"type":21,"tag":200,"props":22092,"children":22094},{"className":18972,"code":22093,"language":18974,"meta":8,"style":8},"mkdir -p /home/web/venv/\n\nvirtualenv --no-site-packages /home/web/venv/\n",[22095],{"type":21,"tag":63,"props":22096,"children":22097},{"__ignoreMap":8},[22098,22115,22122],{"type":21,"tag":209,"props":22099,"children":22100},{"class":211,"line":212},[22101,22106,22110],{"type":21,"tag":209,"props":22102,"children":22103},{"style":360},[22104],{"type":26,"value":22105},"mkdir",{"type":21,"tag":209,"props":22107,"children":22108},{"style":263},[22109],{"type":26,"value":19678},{"type":21,"tag":209,"props":22111,"children":22112},{"style":233},[22113],{"type":26,"value":22114}," /home/web/venv/\n",{"type":21,"tag":209,"props":22116,"children":22117},{"class":211,"line":244},[22118],{"type":21,"tag":209,"props":22119,"children":22120},{"emptyLinePlaceholder":248},[22121],{"type":26,"value":251},{"type":21,"tag":209,"props":22123,"children":22124},{"class":211,"line":254},[22125,22130,22135],{"type":21,"tag":209,"props":22126,"children":22127},{"style":360},[22128],{"type":26,"value":22129},"virtualenv",{"type":21,"tag":209,"props":22131,"children":22132},{"style":263},[22133],{"type":26,"value":22134}," --no-site-packages",{"type":21,"tag":209,"props":22136,"children":22137},{"style":233},[22138],{"type":26,"value":22114},{"type":21,"tag":51,"props":22140,"children":22142},{"id":22141},"python-package-installation",[22143],{"type":26,"value":22144},"Python Package Installation",{"type":21,"tag":22,"props":22146,"children":22147},{},[22148,22150,22157],{"type":26,"value":22149},"Now that we have our virtualenv in place, we can install our python packages via pip. If we follow the git deploy setup, below, these can also be automatically installed/upgraded for us by processing a ",{"type":21,"tag":29,"props":22151,"children":22154},{"href":22152,"rel":22153},"https://pip.readthedocs.io/en/1.1/requirements.html",[93],[22155],{"type":26,"value":22156},"requirements.txt file",{"type":26,"value":378},{"type":21,"tag":22,"props":22159,"children":22160},{},[22161],{"type":26,"value":22162},"Let's make a requirements.txt file that looks like the following:",{"type":21,"tag":200,"props":22164,"children":22166},{"className":21844,"code":22165,"language":21846,"meta":8,"style":8},"asgi-redis==0.12.0\nasgiref==0.13.0\nautobahn==0.14.1\nchannels==0.14.0\ndaphne==0.12.1\nDjango>=1.9,=2.6,\u003C2.7\nredis==2.10.5\nsix==1.10.0\nTwisted==16.2.0\ntxaio==2.5.1\nzope.interface==4.1.3\n",[22167],{"type":21,"tag":63,"props":22168,"children":22169},{"__ignoreMap":8},[22170,22187,22204,22221,22238,22255,22276,22293,22310,22327,22344],{"type":21,"tag":209,"props":22171,"children":22172},{"class":211,"line":212},[22173,22178,22182],{"type":21,"tag":209,"props":22174,"children":22175},{"style":222},[22176],{"type":26,"value":22177},"asgi-redis",{"type":21,"tag":209,"props":22179,"children":22180},{"style":216},[22181],{"type":26,"value":1432},{"type":21,"tag":209,"props":22183,"children":22184},{"style":233},[22185],{"type":26,"value":22186},"=0.12.0\n",{"type":21,"tag":209,"props":22188,"children":22189},{"class":211,"line":244},[22190,22195,22199],{"type":21,"tag":209,"props":22191,"children":22192},{"style":222},[22193],{"type":26,"value":22194},"asgiref",{"type":21,"tag":209,"props":22196,"children":22197},{"style":216},[22198],{"type":26,"value":1432},{"type":21,"tag":209,"props":22200,"children":22201},{"style":233},[22202],{"type":26,"value":22203},"=0.13.0\n",{"type":21,"tag":209,"props":22205,"children":22206},{"class":211,"line":254},[22207,22212,22216],{"type":21,"tag":209,"props":22208,"children":22209},{"style":222},[22210],{"type":26,"value":22211},"autobahn",{"type":21,"tag":209,"props":22213,"children":22214},{"style":216},[22215],{"type":26,"value":1432},{"type":21,"tag":209,"props":22217,"children":22218},{"style":233},[22219],{"type":26,"value":22220},"=0.14.1\n",{"type":21,"tag":209,"props":22222,"children":22223},{"class":211,"line":279},[22224,22229,22233],{"type":21,"tag":209,"props":22225,"children":22226},{"style":222},[22227],{"type":26,"value":22228},"channels",{"type":21,"tag":209,"props":22230,"children":22231},{"style":216},[22232],{"type":26,"value":1432},{"type":21,"tag":209,"props":22234,"children":22235},{"style":233},[22236],{"type":26,"value":22237},"=0.14.0\n",{"type":21,"tag":209,"props":22239,"children":22240},{"class":211,"line":288},[22241,22246,22250],{"type":21,"tag":209,"props":22242,"children":22243},{"style":222},[22244],{"type":26,"value":22245},"daphne",{"type":21,"tag":209,"props":22247,"children":22248},{"style":216},[22249],{"type":26,"value":1432},{"type":21,"tag":209,"props":22251,"children":22252},{"style":233},[22253],{"type":26,"value":22254},"=0.12.1\n",{"type":21,"tag":209,"props":22256,"children":22257},{"class":211,"line":307},[22258,22262,22266,22271],{"type":21,"tag":209,"props":22259,"children":22260},{"style":360},[22261],{"type":26,"value":21603},{"type":21,"tag":209,"props":22263,"children":22264},{"style":222},[22265],{"type":26,"value":2014},{"type":21,"tag":209,"props":22267,"children":22268},{"style":233},[22269],{"type":26,"value":22270},"=1.9,=2.6,",{"type":21,"tag":209,"props":22272,"children":22273},{"style":222},[22274],{"type":26,"value":22275},"\u003C2.7\n",{"type":21,"tag":209,"props":22277,"children":22278},{"class":211,"line":325},[22279,22284,22288],{"type":21,"tag":209,"props":22280,"children":22281},{"style":222},[22282],{"type":26,"value":22283},"redis",{"type":21,"tag":209,"props":22285,"children":22286},{"style":216},[22287],{"type":26,"value":1432},{"type":21,"tag":209,"props":22289,"children":22290},{"style":233},[22291],{"type":26,"value":22292},"=2.10.5\n",{"type":21,"tag":209,"props":22294,"children":22295},{"class":211,"line":334},[22296,22301,22305],{"type":21,"tag":209,"props":22297,"children":22298},{"style":222},[22299],{"type":26,"value":22300},"six",{"type":21,"tag":209,"props":22302,"children":22303},{"style":216},[22304],{"type":26,"value":1432},{"type":21,"tag":209,"props":22306,"children":22307},{"style":233},[22308],{"type":26,"value":22309},"=1.10.0\n",{"type":21,"tag":209,"props":22311,"children":22312},{"class":211,"line":343},[22313,22318,22322],{"type":21,"tag":209,"props":22314,"children":22315},{"style":222},[22316],{"type":26,"value":22317},"Twisted",{"type":21,"tag":209,"props":22319,"children":22320},{"style":216},[22321],{"type":26,"value":1432},{"type":21,"tag":209,"props":22323,"children":22324},{"style":233},[22325],{"type":26,"value":22326},"=16.2.0\n",{"type":21,"tag":209,"props":22328,"children":22329},{"class":211,"line":351},[22330,22335,22339],{"type":21,"tag":209,"props":22331,"children":22332},{"style":222},[22333],{"type":26,"value":22334},"txaio",{"type":21,"tag":209,"props":22336,"children":22337},{"style":216},[22338],{"type":26,"value":1432},{"type":21,"tag":209,"props":22340,"children":22341},{"style":233},[22342],{"type":26,"value":22343},"=2.5.1\n",{"type":21,"tag":209,"props":22345,"children":22346},{"class":211,"line":444},[22347,22352],{"type":21,"tag":209,"props":22348,"children":22349},{"style":360},[22350],{"type":26,"value":22351},"zope.interface",{"type":21,"tag":209,"props":22353,"children":22354},{"style":233},[22355],{"type":26,"value":22356},"==4.1.3\n",{"type":21,"tag":22,"props":22358,"children":22359},{},[22360],{"type":26,"value":22361},"Now, we can activate the virtual environment and install these requirements with pip like so:",{"type":21,"tag":200,"props":22363,"children":22365},{"className":21844,"code":22364,"language":21846,"meta":8,"style":8},"source /home/web/venv/bin/activate\npip install -r requirements.txt\ndeactivate\n",[22366],{"type":21,"tag":63,"props":22367,"children":22368},{"__ignoreMap":8},[22369,22380,22399],{"type":21,"tag":209,"props":22370,"children":22371},{"class":211,"line":212},[22372,22376],{"type":21,"tag":209,"props":22373,"children":22374},{"style":263},[22375],{"type":26,"value":19040},{"type":21,"tag":209,"props":22377,"children":22378},{"style":233},[22379],{"type":26,"value":19045},{"type":21,"tag":209,"props":22381,"children":22382},{"class":211,"line":244},[22383,22387,22391,22395],{"type":21,"tag":209,"props":22384,"children":22385},{"style":360},[22386],{"type":26,"value":19076},{"type":21,"tag":209,"props":22388,"children":22389},{"style":233},[22390],{"type":26,"value":19081},{"type":21,"tag":209,"props":22392,"children":22393},{"style":263},[22394],{"type":26,"value":19091},{"type":21,"tag":209,"props":22396,"children":22397},{"style":233},[22398],{"type":26,"value":19096},{"type":21,"tag":209,"props":22400,"children":22401},{"class":211,"line":254},[22402],{"type":21,"tag":209,"props":22403,"children":22404},{"style":360},[22405],{"type":26,"value":19136},{"type":21,"tag":22,"props":22407,"children":22408},{},[22409],{"type":26,"value":19178},{"type":21,"tag":200,"props":22411,"children":22413},{"className":21844,"code":22412,"language":21846,"meta":8,"style":8},"source /home/web/venv/bin/activate.csh\npip install -r requirements.txt\ndeactivate\n",[22414],{"type":21,"tag":63,"props":22415,"children":22416},{"__ignoreMap":8},[22417,22428,22447],{"type":21,"tag":209,"props":22418,"children":22419},{"class":211,"line":212},[22420,22424],{"type":21,"tag":209,"props":22421,"children":22422},{"style":263},[22423],{"type":26,"value":19040},{"type":21,"tag":209,"props":22425,"children":22426},{"style":233},[22427],{"type":26,"value":19237},{"type":21,"tag":209,"props":22429,"children":22430},{"class":211,"line":244},[22431,22435,22439,22443],{"type":21,"tag":209,"props":22432,"children":22433},{"style":360},[22434],{"type":26,"value":19076},{"type":21,"tag":209,"props":22436,"children":22437},{"style":233},[22438],{"type":26,"value":19081},{"type":21,"tag":209,"props":22440,"children":22441},{"style":263},[22442],{"type":26,"value":19091},{"type":21,"tag":209,"props":22444,"children":22445},{"style":233},[22446],{"type":26,"value":19096},{"type":21,"tag":209,"props":22448,"children":22449},{"class":211,"line":254},[22450],{"type":21,"tag":209,"props":22451,"children":22452},{"style":360},[22453],{"type":26,"value":19136},{"type":21,"tag":51,"props":22455,"children":22457},{"id":22456},"django-project-setup",[22458],{"type":26,"value":22459},"Django Project Setup",{"type":21,"tag":22,"props":22461,"children":22462},{},[22463,22465,22472],{"type":26,"value":22464},"Now, we're going to get a bare minimal Django project structure in place. Thankfully, Django has some built-in ability to generate it's own boilerplate, which we'll take advantage of. For this, I refer you to the ",{"type":21,"tag":29,"props":22466,"children":22469},{"href":22467,"rel":22468},"https://docs.djangoproject.com/en/1.9/intro/tutorial01/#creating-a-project",[93],[22470],{"type":26,"value":22471},"official Django docs",{"type":26,"value":378},{"type":21,"tag":22,"props":22474,"children":22475},{},[22476,22478,22483,22485,22491,22493,22499],{"type":26,"value":22477},"For our purposes, the only file of interest is ",{"type":21,"tag":63,"props":22479,"children":22481},{"className":22480},[],[22482],{"type":26,"value":19944},{"type":26,"value":22484}," in your app directory. Open that up in your favourite editor, and find the ",{"type":21,"tag":63,"props":22486,"children":22488},{"className":22487},[],[22489],{"type":26,"value":22490},"INSTALLED_APPS",{"type":26,"value":22492}," tuple. Installing channels into Django is as simple as adding ",{"type":21,"tag":63,"props":22494,"children":22496},{"className":22495},[],[22497],{"type":26,"value":22498},"'channels'",{"type":26,"value":22500}," to the end of the tuple.",{"type":21,"tag":22,"props":22502,"children":22503},{},[22504,22506,22513],{"type":26,"value":22505},"You may also need/want to add your 'app_name' to this tuple, especially if you need static file discovery. You can take a look at the ",{"type":21,"tag":29,"props":22507,"children":22510},{"href":22508,"rel":22509},"https://channels.readthedocs.io/en/latest/installation.html",[93],[22511],{"type":26,"value":22512},"Channels Installation",{"type":26,"value":22514}," documentation for a little more detail here, but it's nicely straightforward.",{"type":21,"tag":22,"props":22516,"children":22517},{},[22518],{"type":26,"value":22519},"You should also copy that requirements.txt file we made earlier into the root of your app directory. If nothing else, it serves as a reference as to what packages you're using.",{"type":21,"tag":17597,"props":22521,"children":22522},{"id":21450},[22523],{"type":26,"value":22524},"FreeBSD Note:",{"type":21,"tag":22,"props":22526,"children":22527},{},[22528,22530],{"type":26,"value":22529},"At this point we'll be relying on SQLite to provide our database solution - in many distributions, this is built-in to Python, but on FreeBSD we'll also need to install the py-sqlite3 package: ",{"type":21,"tag":63,"props":22531,"children":22533},{"className":22532},[],[22534],{"type":26,"value":22535},"pkg install py27-sqlite3",{"type":21,"tag":51,"props":22537,"children":22539},{"id":22538},"deploy-setup-optional",[22540],{"type":26,"value":22541},"Deploy Setup [Optional]",{"type":21,"tag":22,"props":22543,"children":22544},{},[22545,22547,22554],{"type":26,"value":22546},"This step is purely optional, but I like it as an easy way to ",{"type":21,"tag":29,"props":22548,"children":22551},{"href":22549,"rel":22550},"https://artandlogic.com/2013/12/deploying-websites-with-git/",[93],[22552],{"type":26,"value":22553},"deploy via git push",{"type":26,"value":22555},". That link has more info, so we'll just sketch out the implementation here:",{"type":21,"tag":22,"props":22557,"children":22558},{},[22559],{"type":26,"value":22560},"Make the necessary directories:",{"type":21,"tag":200,"props":22562,"children":22564},{"className":21844,"code":22563,"language":21846,"meta":8,"style":8},"mkdir -p /home/web/www.git/\nmkdir -p /home/web/www/\n",[22565],{"type":21,"tag":63,"props":22566,"children":22567},{"__ignoreMap":8},[22568,22584],{"type":21,"tag":209,"props":22569,"children":22570},{"class":211,"line":212},[22571,22575,22579],{"type":21,"tag":209,"props":22572,"children":22573},{"style":360},[22574],{"type":26,"value":22105},{"type":21,"tag":209,"props":22576,"children":22577},{"style":263},[22578],{"type":26,"value":19678},{"type":21,"tag":209,"props":22580,"children":22581},{"style":233},[22582],{"type":26,"value":22583}," /home/web/www.git/\n",{"type":21,"tag":209,"props":22585,"children":22586},{"class":211,"line":244},[22587,22591,22595],{"type":21,"tag":209,"props":22588,"children":22589},{"style":360},[22590],{"type":26,"value":22105},{"type":21,"tag":209,"props":22592,"children":22593},{"style":263},[22594],{"type":26,"value":19678},{"type":21,"tag":209,"props":22596,"children":22597},{"style":233},[22598],{"type":26,"value":22599}," /home/web/www/\n",{"type":21,"tag":22,"props":22601,"children":22602},{},[22603],{"type":26,"value":22604},"Setup a bare git repository:",{"type":21,"tag":200,"props":22606,"children":22608},{"className":21844,"code":22607,"language":21846,"meta":8,"style":8},"cd /home/web/www.git/\ngit config core.sharedRepository group\n",[22609],{"type":21,"tag":63,"props":22610,"children":22611},{"__ignoreMap":8},[22612,22623],{"type":21,"tag":209,"props":22613,"children":22614},{"class":211,"line":212},[22615,22619],{"type":21,"tag":209,"props":22616,"children":22617},{"style":263},[22618],{"type":26,"value":21952},{"type":21,"tag":209,"props":22620,"children":22621},{"style":233},[22622],{"type":26,"value":22583},{"type":21,"tag":209,"props":22624,"children":22625},{"class":211,"line":244},[22626,22631,22636,22641],{"type":21,"tag":209,"props":22627,"children":22628},{"style":360},[22629],{"type":26,"value":22630},"git",{"type":21,"tag":209,"props":22632,"children":22633},{"style":233},[22634],{"type":26,"value":22635}," config",{"type":21,"tag":209,"props":22637,"children":22638},{"style":233},[22639],{"type":26,"value":22640}," core.sharedRepository",{"type":21,"tag":209,"props":22642,"children":22643},{"style":233},[22644],{"type":26,"value":22645}," group\n",{"type":21,"tag":22,"props":22647,"children":22648},{},[22649,22651,22657],{"type":26,"value":22650},"And create a post-receive hook that will ",{"type":21,"tag":63,"props":22652,"children":22654},{"className":22653},[],[22655],{"type":26,"value":22656},"install/update",{"type":26,"value":22658}," our packages, run migrations for us, and kill and restart the development server:",{"type":21,"tag":22,"props":22660,"children":22661},{},[22662],{"type":26,"value":18969},{"type":21,"tag":200,"props":22664,"children":22666},{"className":18972,"code":22665,"language":18974,"meta":8,"style":8},"#!/bin/bash\n\nGIT_WORK_TREE=/home/web/www/ git checkout -f\n\nsource /home/web/venv/bin/activate\npushd /home/web/www/\n\n# Install python libs via pip and perform database migrations\npip install --upgrade -r requirements.txt\npython manage.py migrate\n\nkill ps aux | grep runserver | grep -v grep | awk '{print $2}'\npython manage.py runserver\n\npopd\ndeactivate\n",[22667],{"type":21,"tag":63,"props":22668,"children":22669},{"__ignoreMap":8},[22670,22677,22684,22711,22718,22729,22736,22743,22750,22773,22788,22795,22859,22875,22882,22889],{"type":21,"tag":209,"props":22671,"children":22672},{"class":211,"line":212},[22673],{"type":21,"tag":209,"props":22674,"children":22675},{"style":448},[22676],{"type":26,"value":18986},{"type":21,"tag":209,"props":22678,"children":22679},{"class":211,"line":244},[22680],{"type":21,"tag":209,"props":22681,"children":22682},{"emptyLinePlaceholder":248},[22683],{"type":26,"value":251},{"type":21,"tag":209,"props":22685,"children":22686},{"class":211,"line":254},[22687,22691,22695,22699,22703,22707],{"type":21,"tag":209,"props":22688,"children":22689},{"style":222},[22690],{"type":26,"value":19001},{"type":21,"tag":209,"props":22692,"children":22693},{"style":216},[22694],{"type":26,"value":1432},{"type":21,"tag":209,"props":22696,"children":22697},{"style":233},[22698],{"type":26,"value":19010},{"type":21,"tag":209,"props":22700,"children":22701},{"style":360},[22702],{"type":26,"value":19015},{"type":21,"tag":209,"props":22704,"children":22705},{"style":233},[22706],{"type":26,"value":19020},{"type":21,"tag":209,"props":22708,"children":22709},{"style":263},[22710],{"type":26,"value":19025},{"type":21,"tag":209,"props":22712,"children":22713},{"class":211,"line":279},[22714],{"type":21,"tag":209,"props":22715,"children":22716},{"emptyLinePlaceholder":248},[22717],{"type":26,"value":251},{"type":21,"tag":209,"props":22719,"children":22720},{"class":211,"line":288},[22721,22725],{"type":21,"tag":209,"props":22722,"children":22723},{"style":263},[22724],{"type":26,"value":19040},{"type":21,"tag":209,"props":22726,"children":22727},{"style":233},[22728],{"type":26,"value":19045},{"type":21,"tag":209,"props":22730,"children":22731},{"class":211,"line":307},[22732],{"type":21,"tag":209,"props":22733,"children":22734},{"style":222},[22735],{"type":26,"value":19053},{"type":21,"tag":209,"props":22737,"children":22738},{"class":211,"line":325},[22739],{"type":21,"tag":209,"props":22740,"children":22741},{"emptyLinePlaceholder":248},[22742],{"type":26,"value":251},{"type":21,"tag":209,"props":22744,"children":22745},{"class":211,"line":334},[22746],{"type":21,"tag":209,"props":22747,"children":22748},{"style":448},[22749],{"type":26,"value":19068},{"type":21,"tag":209,"props":22751,"children":22752},{"class":211,"line":343},[22753,22757,22761,22765,22769],{"type":21,"tag":209,"props":22754,"children":22755},{"style":360},[22756],{"type":26,"value":19076},{"type":21,"tag":209,"props":22758,"children":22759},{"style":233},[22760],{"type":26,"value":19081},{"type":21,"tag":209,"props":22762,"children":22763},{"style":263},[22764],{"type":26,"value":19086},{"type":21,"tag":209,"props":22766,"children":22767},{"style":263},[22768],{"type":26,"value":19091},{"type":21,"tag":209,"props":22770,"children":22771},{"style":233},[22772],{"type":26,"value":19096},{"type":21,"tag":209,"props":22774,"children":22775},{"class":211,"line":351},[22776,22780,22784],{"type":21,"tag":209,"props":22777,"children":22778},{"style":360},[22779],{"type":26,"value":9842},{"type":21,"tag":209,"props":22781,"children":22782},{"style":233},[22783],{"type":26,"value":19108},{"type":21,"tag":209,"props":22785,"children":22786},{"style":233},[22787],{"type":26,"value":19113},{"type":21,"tag":209,"props":22789,"children":22790},{"class":211,"line":444},[22791],{"type":21,"tag":209,"props":22792,"children":22793},{"emptyLinePlaceholder":248},[22794],{"type":26,"value":251},{"type":21,"tag":209,"props":22796,"children":22797},{"class":211,"line":454},[22798,22803,22808,22813,22818,22823,22828,22832,22836,22841,22845,22849,22854],{"type":21,"tag":209,"props":22799,"children":22800},{"style":263},[22801],{"type":26,"value":22802},"kill",{"type":21,"tag":209,"props":22804,"children":22805},{"style":233},[22806],{"type":26,"value":22807}," ps",{"type":21,"tag":209,"props":22809,"children":22810},{"style":233},[22811],{"type":26,"value":22812}," aux",{"type":21,"tag":209,"props":22814,"children":22815},{"style":216},[22816],{"type":26,"value":22817}," |",{"type":21,"tag":209,"props":22819,"children":22820},{"style":360},[22821],{"type":26,"value":22822}," grep",{"type":21,"tag":209,"props":22824,"children":22825},{"style":233},[22826],{"type":26,"value":22827}," runserver",{"type":21,"tag":209,"props":22829,"children":22830},{"style":216},[22831],{"type":26,"value":22817},{"type":21,"tag":209,"props":22833,"children":22834},{"style":360},[22835],{"type":26,"value":22822},{"type":21,"tag":209,"props":22837,"children":22838},{"style":263},[22839],{"type":26,"value":22840}," -v",{"type":21,"tag":209,"props":22842,"children":22843},{"style":233},[22844],{"type":26,"value":22822},{"type":21,"tag":209,"props":22846,"children":22847},{"style":216},[22848],{"type":26,"value":22817},{"type":21,"tag":209,"props":22850,"children":22851},{"style":360},[22852],{"type":26,"value":22853}," awk",{"type":21,"tag":209,"props":22855,"children":22856},{"style":233},[22857],{"type":26,"value":22858}," '{print $2}'\n",{"type":21,"tag":209,"props":22860,"children":22861},{"class":211,"line":463},[22862,22866,22870],{"type":21,"tag":209,"props":22863,"children":22864},{"style":360},[22865],{"type":26,"value":9842},{"type":21,"tag":209,"props":22867,"children":22868},{"style":233},[22869],{"type":26,"value":19108},{"type":21,"tag":209,"props":22871,"children":22872},{"style":233},[22873],{"type":26,"value":22874}," runserver\n",{"type":21,"tag":209,"props":22876,"children":22877},{"class":211,"line":472},[22878],{"type":21,"tag":209,"props":22879,"children":22880},{"emptyLinePlaceholder":248},[22881],{"type":26,"value":251},{"type":21,"tag":209,"props":22883,"children":22884},{"class":211,"line":480},[22885],{"type":21,"tag":209,"props":22886,"children":22887},{"style":222},[22888],{"type":26,"value":19128},{"type":21,"tag":209,"props":22890,"children":22891},{"class":211,"line":489},[22892],{"type":21,"tag":209,"props":22893,"children":22894},{"style":360},[22895],{"type":26,"value":19136},{"type":21,"tag":22,"props":22897,"children":22898},{},[22899],{"type":26,"value":19178},{"type":21,"tag":200,"props":22901,"children":22903},{"className":18972,"code":22902,"language":18974,"meta":8,"style":8},"#!/bin/csh\n\nenv GIT_WORK_TREE=/home/web/www/ git checkout -f\nsource /home/web/venv/bin/activate.csh\npushd /home/web/www/\n\npip install --upgrade -r requirements.txt\npython manage.py migrate\n\nkill ps aux | grep runserver | grep -v grep | awk '{print $2}'\npython manage.py runserver\n\npopd\ndeactivate\n",[22904],{"type":21,"tag":63,"props":22905,"children":22906},{"__ignoreMap":8},[22907,22914,22921,22944,22955,22962,22969,22992,23007,23014,23069,23084,23091,23098],{"type":21,"tag":209,"props":22908,"children":22909},{"class":211,"line":212},[22910],{"type":21,"tag":209,"props":22911,"children":22912},{"style":448},[22913],{"type":26,"value":19193},{"type":21,"tag":209,"props":22915,"children":22916},{"class":211,"line":244},[22917],{"type":21,"tag":209,"props":22918,"children":22919},{"emptyLinePlaceholder":248},[22920],{"type":26,"value":251},{"type":21,"tag":209,"props":22922,"children":22923},{"class":211,"line":254},[22924,22928,22932,22936,22940],{"type":21,"tag":209,"props":22925,"children":22926},{"style":360},[22927],{"type":26,"value":19208},{"type":21,"tag":209,"props":22929,"children":22930},{"style":233},[22931],{"type":26,"value":19213},{"type":21,"tag":209,"props":22933,"children":22934},{"style":233},[22935],{"type":26,"value":19015},{"type":21,"tag":209,"props":22937,"children":22938},{"style":233},[22939],{"type":26,"value":19020},{"type":21,"tag":209,"props":22941,"children":22942},{"style":263},[22943],{"type":26,"value":19025},{"type":21,"tag":209,"props":22945,"children":22946},{"class":211,"line":279},[22947,22951],{"type":21,"tag":209,"props":22948,"children":22949},{"style":263},[22950],{"type":26,"value":19040},{"type":21,"tag":209,"props":22952,"children":22953},{"style":233},[22954],{"type":26,"value":19237},{"type":21,"tag":209,"props":22956,"children":22957},{"class":211,"line":288},[22958],{"type":21,"tag":209,"props":22959,"children":22960},{"style":222},[22961],{"type":26,"value":19053},{"type":21,"tag":209,"props":22963,"children":22964},{"class":211,"line":307},[22965],{"type":21,"tag":209,"props":22966,"children":22967},{"emptyLinePlaceholder":248},[22968],{"type":26,"value":251},{"type":21,"tag":209,"props":22970,"children":22971},{"class":211,"line":325},[22972,22976,22980,22984,22988],{"type":21,"tag":209,"props":22973,"children":22974},{"style":360},[22975],{"type":26,"value":19076},{"type":21,"tag":209,"props":22977,"children":22978},{"style":233},[22979],{"type":26,"value":19081},{"type":21,"tag":209,"props":22981,"children":22982},{"style":263},[22983],{"type":26,"value":19086},{"type":21,"tag":209,"props":22985,"children":22986},{"style":263},[22987],{"type":26,"value":19091},{"type":21,"tag":209,"props":22989,"children":22990},{"style":233},[22991],{"type":26,"value":19096},{"type":21,"tag":209,"props":22993,"children":22994},{"class":211,"line":334},[22995,22999,23003],{"type":21,"tag":209,"props":22996,"children":22997},{"style":360},[22998],{"type":26,"value":9842},{"type":21,"tag":209,"props":23000,"children":23001},{"style":233},[23002],{"type":26,"value":19108},{"type":21,"tag":209,"props":23004,"children":23005},{"style":233},[23006],{"type":26,"value":19113},{"type":21,"tag":209,"props":23008,"children":23009},{"class":211,"line":343},[23010],{"type":21,"tag":209,"props":23011,"children":23012},{"emptyLinePlaceholder":248},[23013],{"type":26,"value":251},{"type":21,"tag":209,"props":23015,"children":23016},{"class":211,"line":351},[23017,23021,23025,23029,23033,23037,23041,23045,23049,23053,23057,23061,23065],{"type":21,"tag":209,"props":23018,"children":23019},{"style":263},[23020],{"type":26,"value":22802},{"type":21,"tag":209,"props":23022,"children":23023},{"style":233},[23024],{"type":26,"value":22807},{"type":21,"tag":209,"props":23026,"children":23027},{"style":233},[23028],{"type":26,"value":22812},{"type":21,"tag":209,"props":23030,"children":23031},{"style":216},[23032],{"type":26,"value":22817},{"type":21,"tag":209,"props":23034,"children":23035},{"style":360},[23036],{"type":26,"value":22822},{"type":21,"tag":209,"props":23038,"children":23039},{"style":233},[23040],{"type":26,"value":22827},{"type":21,"tag":209,"props":23042,"children":23043},{"style":216},[23044],{"type":26,"value":22817},{"type":21,"tag":209,"props":23046,"children":23047},{"style":360},[23048],{"type":26,"value":22822},{"type":21,"tag":209,"props":23050,"children":23051},{"style":263},[23052],{"type":26,"value":22840},{"type":21,"tag":209,"props":23054,"children":23055},{"style":233},[23056],{"type":26,"value":22822},{"type":21,"tag":209,"props":23058,"children":23059},{"style":216},[23060],{"type":26,"value":22817},{"type":21,"tag":209,"props":23062,"children":23063},{"style":360},[23064],{"type":26,"value":22853},{"type":21,"tag":209,"props":23066,"children":23067},{"style":233},[23068],{"type":26,"value":22858},{"type":21,"tag":209,"props":23070,"children":23071},{"class":211,"line":444},[23072,23076,23080],{"type":21,"tag":209,"props":23073,"children":23074},{"style":360},[23075],{"type":26,"value":9842},{"type":21,"tag":209,"props":23077,"children":23078},{"style":233},[23079],{"type":26,"value":19108},{"type":21,"tag":209,"props":23081,"children":23082},{"style":233},[23083],{"type":26,"value":22874},{"type":21,"tag":209,"props":23085,"children":23086},{"class":211,"line":454},[23087],{"type":21,"tag":209,"props":23088,"children":23089},{"emptyLinePlaceholder":248},[23090],{"type":26,"value":251},{"type":21,"tag":209,"props":23092,"children":23093},{"class":211,"line":463},[23094],{"type":21,"tag":209,"props":23095,"children":23096},{"style":222},[23097],{"type":26,"value":19128},{"type":21,"tag":209,"props":23099,"children":23100},{"class":211,"line":472},[23101],{"type":21,"tag":209,"props":23102,"children":23103},{"style":360},[23104],{"type":26,"value":19136},{"type":21,"tag":22,"props":23106,"children":23107},{},[23108,23110,23116,23118,23124],{"type":26,"value":23109},"Save this file as ",{"type":21,"tag":63,"props":23111,"children":23113},{"className":23112},[],[23114],{"type":26,"value":23115},"post-receive",{"type":26,"value":23117},", and then make it executable: ",{"type":21,"tag":63,"props":23119,"children":23121},{"className":23120},[],[23122],{"type":26,"value":23123},"chmod +x post-receive",{"type":26,"value":378},{"type":21,"tag":22,"props":23126,"children":23127},{},[23128,23130,23136,23138,23144],{"type":26,"value":23129},"Now, ",{"type":21,"tag":63,"props":23131,"children":23133},{"className":23132},[],[23134],{"type":26,"value":23135},"git init",{"type":26,"value":23137}," in your local directory, and add a new remote with ",{"type":21,"tag":63,"props":23139,"children":23141},{"className":23140},[],[23142],{"type":26,"value":23143},"git remote add your.server.addr.octets/home/web/www.git",{"type":26,"value":23145},". When pushing, do so as your web user, or you may run into permissions issues.",{"type":21,"tag":22,"props":23147,"children":23148},{},[23149,23151,23157],{"type":26,"value":23150},"As noted before, ",{"type":21,"tag":29,"props":23152,"children":23154},{"href":22549,"rel":23153},[93],[23155],{"type":26,"value":23156},"more details on this can be found in this article",{"type":26,"value":378},{"type":21,"tag":3549,"props":23159,"children":23160},{"id":8764},[23161],{"type":26,"value":23162},"Are we there yet?",{"type":21,"tag":22,"props":23164,"children":23165},{},[23166,23168,23173],{"type":26,"value":23167},"Hah, no, but we are done for today. We're now at a point where you could push your code into your server, and use django's runserver command to run the development server. With the ",{"type":21,"tag":63,"props":23169,"children":23171},{"className":23170},[],[23172],{"type":26,"value":22228},{"type":26,"value":23174}," app installed, this well-known invocation will not start up the old wsgi server, but a shiny new ASGI server instead, with workers and interface living inside the same process as separate threads.",{"type":21,"tag":22,"props":23176,"children":23177},{},[23178,23185],{"type":21,"tag":29,"props":23179,"children":23182},{"href":23180,"rel":23181},"https://artandlogic.com/2016/06/django-channels-ground-part-2/",[93],[23183],{"type":26,"value":23184},"Next time",{"type":26,"value":23186},", we'll go the rest of the way - getting your server something resembling production ready, with postgresql setup, supervisord managing our server workers and interface, and we'll start figuring out what we need to actually use this setup for something cool.",{"type":21,"tag":3490,"props":23188,"children":23189},{},[23190],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":23192},[23193,23196,23203],{"id":21588,"depth":244,"text":21591,"children":23194},[23195],{"id":21696,"depth":279,"text":21699},{"id":21727,"depth":244,"text":21730,"children":23197},[23198,23199,23200,23201,23202],{"id":21828,"depth":254,"text":21831},{"id":22035,"depth":254,"text":22038},{"id":22141,"depth":254,"text":22144},{"id":22456,"depth":254,"text":22459},{"id":22538,"depth":254,"text":22541},{"id":8764,"depth":244,"text":23162},"content:ckeefer:2016-3:djangoChannels1.md","ckeefer/2016-3/djangoChannels1.md","ckeefer/2016-3/djangoChannels1",{"user":3518,"name":3519},{"_path":23209,"_dir":23210,"_draft":7,"_partial":7,"_locale":8,"title":23211,"description":23212,"publishDate":23213,"tags":23214,"excerpt":23212,"body":23215,"_type":3511,"_id":26508,"_source":3513,"_file":26509,"_stem":26510,"_extension":3516,"author":26511},"/ckeefer/2016-2/paymentprocessing","2016-2","Payment Processing with Braintree","You've built the web application of the century, and the users have rightly flooded to it. Cat pictures for everyone!","2016-05-11",[18916,12,13804,9842],{"type":18,"children":23216,"toc":26501},[23217,23221,23226,23238,23250,23264,23304,23309,23315,23334,23339,23345,23384,23389,23534,23548,23785,23804,23809,24036,24042,24074,24096,24417,24422,24435,24606,24611,24616,24624,24630,24652,25396,25402,25415,26443,26449,26454,26466,26478,26483,26497],{"type":21,"tag":22,"props":23218,"children":23219},{},[23220],{"type":26,"value":23212},{"type":21,"tag":22,"props":23222,"children":23223},{},[23224],{"type":26,"value":23225},"But alas, while your users indulge in cat-induced bliss, the cold hard reality of server costs cannot help but harsh your mellow. What is to be done?",{"type":21,"tag":22,"props":23227,"children":23228},{},[23229,23231,23236],{"type":26,"value":23230},"Maybe, you could get the users to... ",{"type":21,"tag":1084,"props":23232,"children":23233},{},[23234],{"type":26,"value":23235},"pay",{"type":26,"value":23237}," for access to your incredible web application in all its multivarious splendour?",{"type":21,"tag":22,"props":23239,"children":23240},{},[23241,23248],{"type":21,"tag":29,"props":23242,"children":23245},{"href":23243,"rel":23244},"https://www.braintreepayments.com/",[93],[23246],{"type":26,"value":23247},"Braintree",{"type":26,"value":23249}," is a payment processor (now a subsidiary of PayPal), which boasts of a \"simple, robust way to accept payments\", and with features like a drop-in payment ui and libraries for various programming languages enabling fairly easy integration, is a solid choice for accepting payments via credit card or PayPal.",{"type":21,"tag":22,"props":23251,"children":23252},{},[23253,23255,23262],{"type":26,"value":23254},"While Braintree's ",{"type":21,"tag":29,"props":23256,"children":23259},{"href":23257,"rel":23258},"https://developers.braintreepayments.com/",[93],[23260],{"type":26,"value":23261},"developer documentation",{"type":26,"value":23263}," is blessedly detailed, it's possessed of a potentially confusing bevy of options, and its various implementation examples are spread out amongst a number of pages and platforms. So today, rather than reiterate any particular section of the docs, we're going to take a look at an end-to-end example of a specific, straightforward scenario - accepting and processing a one-time, immediately settled payment in a web application.",{"type":21,"tag":22,"props":23265,"children":23266},{},[23267,23269,23276,23278,23285,23287,23294,23295,23302],{"type":26,"value":23268},"Our languages of choice for today will be ",{"type":21,"tag":29,"props":23270,"children":23273},{"href":23271,"rel":23272},"https://developers.braintreepayments.com/start/hello-server/python",[93],[23274],{"type":26,"value":23275},"Python",{"type":26,"value":23277}," for the backend and, of course, ",{"type":21,"tag":29,"props":23279,"children":23282},{"href":23280,"rel":23281},"https://developers.braintreepayments.com/start/hello-client/javascript",[93],[23283],{"type":26,"value":23284},"JavaScript",{"type":26,"value":23286}," for the frontend, with the additional assumption of jQuery for the ease of $.ajax. The general logic for the backend will be portable to the other languages for which Braintree has released an SDK, e.g. ",{"type":21,"tag":29,"props":23288,"children":23291},{"href":23289,"rel":23290},"https://developers.braintreepayments.com/start/hello-server/ruby",[93],[23292],{"type":26,"value":23293},"Ruby",{"type":26,"value":408},{"type":21,"tag":29,"props":23296,"children":23299},{"href":23297,"rel":23298},"https://developers.braintreepayments.com/start/hello-server/php",[93],[23300],{"type":26,"value":23301},"PHP",{"type":26,"value":23303},", etc., and the frontend logic could certainly be implemented without jQuery.",{"type":21,"tag":22,"props":23305,"children":23306},{},[23307],{"type":26,"value":23308},"We're also going to assume the existence of a database for storing and retrieving item and transaction details. We're also going to assume the use of Django as our web framework in the following examples, but the general concepts are portable to other frameworks.",{"type":21,"tag":17597,"props":23310,"children":23312},{"id":23311},"not-production-ready",[23313],{"type":26,"value":23314},"Not Production Ready",{"type":21,"tag":22,"props":23316,"children":23317},{},[23318,23320,23325,23327,23332],{"type":26,"value":23319},"One more important note before we get started - the code below should ",{"type":21,"tag":5270,"props":23321,"children":23322},{},[23323],{"type":26,"value":23324},"not",{"type":26,"value":23326}," be considered production ready. It is example-quality, meant for instructional purposes only! While it should go without saying that copy-pasting code is always a bad idea, copy-pasting example code for business critical purposes like payment processing is a big enough no-no to warrant an extra paragraph warning everyone against it. ",{"type":21,"tag":1084,"props":23328,"children":23329},{},[23330],{"type":26,"value":23331},"This is that paragraph.",{"type":26,"value":23333}," Copy-pasting == bad. Using this tutorial to learn == good.",{"type":21,"tag":22,"props":23335,"children":23336},{},[23337],{"type":26,"value":23338},"With that established, let's get started.",{"type":21,"tag":3549,"props":23340,"children":23342},{"id":23341},"server-setup-and-token-generation",[23343],{"type":26,"value":23344},"Server Setup and Token Generation",{"type":21,"tag":22,"props":23346,"children":23347},{},[23348,23350,23357,23359,23366,23367,23373,23375,23382],{"type":26,"value":23349},"After ",{"type":21,"tag":29,"props":23351,"children":23354},{"href":23352,"rel":23353},"https://www.braintreepayments.com/get-started",[93],[23355],{"type":26,"value":23356},"signing up for a sandbox account",{"type":26,"value":23358}," and doing some basic setup in the ",{"type":21,"tag":29,"props":23360,"children":23363},{"href":23361,"rel":23362},"https://articles.braintreepayments.com/control-panel/basics/overview",[93],[23364],{"type":26,"value":23365},"braintree control panel",{"type":26,"value":408},{"type":21,"tag":29,"props":23368,"children":23370},{"href":23271,"rel":23369},[93],[23371],{"type":26,"value":23372},"our first step",{"type":26,"value":23374}," is to install the ",{"type":21,"tag":29,"props":23376,"children":23379},{"href":23377,"rel":23378},"https://pypi.python.org/pypi/braintree/3.25.0",[93],[23380],{"type":26,"value":23381},"Braintree Python Library",{"type":26,"value":23383},", manually or via pip.",{"type":21,"tag":22,"props":23385,"children":23386},{},[23387],{"type":26,"value":23388},"That done, we'll want to store our configuration details somewhere. In Django we might perform our configuration in settings.py:",{"type":21,"tag":200,"props":23390,"children":23392},{"className":9840,"code":23391,"language":9842,"meta":8,"style":8},"import os\nimport braintree\n\nbraintree.Configuration.configure(\n    os.environ.get('BT_ENVIRONMENT', braintree.Environment.Sandbox),\n    os.environ.get('BT_MERCHANT_ID', 'your_sandbox_merchant_id'),\n    os.environ.get('BT_PUBLIC_KEY', 'your_sandbox_public_key'),\n    os.environ.get('BT_PRIVATE_KEY', 'your_sandbox_private_key')\n)\n",[23393],{"type":21,"tag":63,"props":23394,"children":23395},{"__ignoreMap":8},[23396,23407,23419,23426,23434,23452,23477,23502,23527],{"type":21,"tag":209,"props":23397,"children":23398},{"class":211,"line":212},[23399,23403],{"type":21,"tag":209,"props":23400,"children":23401},{"style":216},[23402],{"type":26,"value":219},{"type":21,"tag":209,"props":23404,"children":23405},{"style":222},[23406],{"type":26,"value":20781},{"type":21,"tag":209,"props":23408,"children":23409},{"class":211,"line":244},[23410,23414],{"type":21,"tag":209,"props":23411,"children":23412},{"style":216},[23413],{"type":26,"value":219},{"type":21,"tag":209,"props":23415,"children":23416},{"style":222},[23417],{"type":26,"value":23418}," braintree\n",{"type":21,"tag":209,"props":23420,"children":23421},{"class":211,"line":254},[23422],{"type":21,"tag":209,"props":23423,"children":23424},{"emptyLinePlaceholder":248},[23425],{"type":26,"value":251},{"type":21,"tag":209,"props":23427,"children":23428},{"class":211,"line":279},[23429],{"type":21,"tag":209,"props":23430,"children":23431},{"style":222},[23432],{"type":26,"value":23433},"braintree.Configuration.configure(\n",{"type":21,"tag":209,"props":23435,"children":23436},{"class":211,"line":288},[23437,23442,23447],{"type":21,"tag":209,"props":23438,"children":23439},{"style":222},[23440],{"type":26,"value":23441},"    os.environ.get(",{"type":21,"tag":209,"props":23443,"children":23444},{"style":233},[23445],{"type":26,"value":23446},"'BT_ENVIRONMENT'",{"type":21,"tag":209,"props":23448,"children":23449},{"style":222},[23450],{"type":26,"value":23451},", braintree.Environment.Sandbox),\n",{"type":21,"tag":209,"props":23453,"children":23454},{"class":211,"line":307},[23455,23459,23464,23468,23473],{"type":21,"tag":209,"props":23456,"children":23457},{"style":222},[23458],{"type":26,"value":23441},{"type":21,"tag":209,"props":23460,"children":23461},{"style":233},[23462],{"type":26,"value":23463},"'BT_MERCHANT_ID'",{"type":21,"tag":209,"props":23465,"children":23466},{"style":222},[23467],{"type":26,"value":408},{"type":21,"tag":209,"props":23469,"children":23470},{"style":233},[23471],{"type":26,"value":23472},"'your_sandbox_merchant_id'",{"type":21,"tag":209,"props":23474,"children":23475},{"style":222},[23476],{"type":26,"value":10277},{"type":21,"tag":209,"props":23478,"children":23479},{"class":211,"line":325},[23480,23484,23489,23493,23498],{"type":21,"tag":209,"props":23481,"children":23482},{"style":222},[23483],{"type":26,"value":23441},{"type":21,"tag":209,"props":23485,"children":23486},{"style":233},[23487],{"type":26,"value":23488},"'BT_PUBLIC_KEY'",{"type":21,"tag":209,"props":23490,"children":23491},{"style":222},[23492],{"type":26,"value":408},{"type":21,"tag":209,"props":23494,"children":23495},{"style":233},[23496],{"type":26,"value":23497},"'your_sandbox_public_key'",{"type":21,"tag":209,"props":23499,"children":23500},{"style":222},[23501],{"type":26,"value":10277},{"type":21,"tag":209,"props":23503,"children":23504},{"class":211,"line":334},[23505,23509,23514,23518,23523],{"type":21,"tag":209,"props":23506,"children":23507},{"style":222},[23508],{"type":26,"value":23441},{"type":21,"tag":209,"props":23510,"children":23511},{"style":233},[23512],{"type":26,"value":23513},"'BT_PRIVATE_KEY'",{"type":21,"tag":209,"props":23515,"children":23516},{"style":222},[23517],{"type":26,"value":408},{"type":21,"tag":209,"props":23519,"children":23520},{"style":233},[23521],{"type":26,"value":23522},"'your_sandbox_private_key'",{"type":21,"tag":209,"props":23524,"children":23525},{"style":222},[23526],{"type":26,"value":10112},{"type":21,"tag":209,"props":23528,"children":23529},{"class":211,"line":343},[23530],{"type":21,"tag":209,"props":23531,"children":23532},{"style":222},[23533],{"type":26,"value":10112},{"type":21,"tag":22,"props":23535,"children":23536},{},[23537,23539,23546],{"type":26,"value":23538},"Next, we need to setup an endpoint for the client to request a ",{"type":21,"tag":29,"props":23540,"children":23543},{"href":23541,"rel":23542},"https://developers.braintreepayments.com/start/hello-server/python#generate-a-client-token",[93],[23544],{"type":26,"value":23545},"client token",{"type":26,"value":23547}," from:",{"type":21,"tag":200,"props":23549,"children":23551},{"className":9840,"code":23550,"language":9842,"meta":8,"style":8},"import braintree\nfrom django.http import JsonResponse\nfrom django.views.decorators.http import require_http_methods\n\n@require_http_methods(['GET'])\ndef get_braintree_client_token(request):\n    \"\"\"\n    Generate and return client token.\n    \"\"\"\n    try:\n        client_token = braintree.ClientToken.generate()\n    except ValueError as e:\n        return JsonResponse({\"error\": e.message}, status=500)\n    return JsonResponse({\"token\": client_token})\n",[23552],{"type":21,"tag":63,"props":23553,"children":23554},{"__ignoreMap":8},[23555,23566,23586,23607,23614,23635,23652,23659,23667,23674,23685,23702,23724,23764],{"type":21,"tag":209,"props":23556,"children":23557},{"class":211,"line":212},[23558,23562],{"type":21,"tag":209,"props":23559,"children":23560},{"style":216},[23561],{"type":26,"value":219},{"type":21,"tag":209,"props":23563,"children":23564},{"style":222},[23565],{"type":26,"value":23418},{"type":21,"tag":209,"props":23567,"children":23568},{"class":211,"line":244},[23569,23573,23577,23581],{"type":21,"tag":209,"props":23570,"children":23571},{"style":216},[23572],{"type":26,"value":230},{"type":21,"tag":209,"props":23574,"children":23575},{"style":222},[23576],{"type":26,"value":20584},{"type":21,"tag":209,"props":23578,"children":23579},{"style":216},[23580],{"type":26,"value":219},{"type":21,"tag":209,"props":23582,"children":23583},{"style":222},[23584],{"type":26,"value":23585}," JsonResponse\n",{"type":21,"tag":209,"props":23587,"children":23588},{"class":211,"line":254},[23589,23593,23598,23602],{"type":21,"tag":209,"props":23590,"children":23591},{"style":216},[23592],{"type":26,"value":230},{"type":21,"tag":209,"props":23594,"children":23595},{"style":222},[23596],{"type":26,"value":23597}," django.views.decorators.http ",{"type":21,"tag":209,"props":23599,"children":23600},{"style":216},[23601],{"type":26,"value":219},{"type":21,"tag":209,"props":23603,"children":23604},{"style":222},[23605],{"type":26,"value":23606}," require_http_methods\n",{"type":21,"tag":209,"props":23608,"children":23609},{"class":211,"line":279},[23610],{"type":21,"tag":209,"props":23611,"children":23612},{"emptyLinePlaceholder":248},[23613],{"type":26,"value":251},{"type":21,"tag":209,"props":23615,"children":23616},{"class":211,"line":288},[23617,23622,23627,23631],{"type":21,"tag":209,"props":23618,"children":23619},{"style":360},[23620],{"type":26,"value":23621},"@require_http_methods",{"type":21,"tag":209,"props":23623,"children":23624},{"style":222},[23625],{"type":26,"value":23626},"([",{"type":21,"tag":209,"props":23628,"children":23629},{"style":233},[23630],{"type":26,"value":17996},{"type":21,"tag":209,"props":23632,"children":23633},{"style":222},[23634],{"type":26,"value":20697},{"type":21,"tag":209,"props":23636,"children":23637},{"class":211,"line":307},[23638,23642,23647],{"type":21,"tag":209,"props":23639,"children":23640},{"style":216},[23641],{"type":26,"value":9882},{"type":21,"tag":209,"props":23643,"children":23644},{"style":360},[23645],{"type":26,"value":23646}," get_braintree_client_token",{"type":21,"tag":209,"props":23648,"children":23649},{"style":222},[23650],{"type":26,"value":23651},"(request):\n",{"type":21,"tag":209,"props":23653,"children":23654},{"class":211,"line":325},[23655],{"type":21,"tag":209,"props":23656,"children":23657},{"style":233},[23658],{"type":26,"value":9900},{"type":21,"tag":209,"props":23660,"children":23661},{"class":211,"line":334},[23662],{"type":21,"tag":209,"props":23663,"children":23664},{"style":233},[23665],{"type":26,"value":23666},"    Generate and return client token.\n",{"type":21,"tag":209,"props":23668,"children":23669},{"class":211,"line":343},[23670],{"type":21,"tag":209,"props":23671,"children":23672},{"style":233},[23673],{"type":26,"value":9900},{"type":21,"tag":209,"props":23675,"children":23676},{"class":211,"line":351},[23677,23681],{"type":21,"tag":209,"props":23678,"children":23679},{"style":216},[23680],{"type":26,"value":10041},{"type":21,"tag":209,"props":23682,"children":23683},{"style":222},[23684],{"type":26,"value":844},{"type":21,"tag":209,"props":23686,"children":23687},{"class":211,"line":444},[23688,23693,23697],{"type":21,"tag":209,"props":23689,"children":23690},{"style":222},[23691],{"type":26,"value":23692},"        client_token ",{"type":21,"tag":209,"props":23694,"children":23695},{"style":216},[23696],{"type":26,"value":1432},{"type":21,"tag":209,"props":23698,"children":23699},{"style":222},[23700],{"type":26,"value":23701}," braintree.ClientToken.generate()\n",{"type":21,"tag":209,"props":23703,"children":23704},{"class":211,"line":454},[23705,23709,23714,23719],{"type":21,"tag":209,"props":23706,"children":23707},{"style":216},[23708],{"type":26,"value":10120},{"type":21,"tag":209,"props":23710,"children":23711},{"style":263},[23712],{"type":26,"value":23713}," ValueError",{"type":21,"tag":209,"props":23715,"children":23716},{"style":216},[23717],{"type":26,"value":23718}," as",{"type":21,"tag":209,"props":23720,"children":23721},{"style":222},[23722],{"type":26,"value":23723}," e:\n",{"type":21,"tag":209,"props":23725,"children":23726},{"class":211,"line":463},[23727,23731,23736,23741,23746,23751,23755,23760],{"type":21,"tag":209,"props":23728,"children":23729},{"style":216},[23730],{"type":26,"value":3069},{"type":21,"tag":209,"props":23732,"children":23733},{"style":222},[23734],{"type":26,"value":23735}," JsonResponse({",{"type":21,"tag":209,"props":23737,"children":23738},{"style":233},[23739],{"type":26,"value":23740},"\"error\"",{"type":21,"tag":209,"props":23742,"children":23743},{"style":222},[23744],{"type":26,"value":23745},": e.message}, ",{"type":21,"tag":209,"props":23747,"children":23748},{"style":400},[23749],{"type":26,"value":23750},"status",{"type":21,"tag":209,"props":23752,"children":23753},{"style":216},[23754],{"type":26,"value":1432},{"type":21,"tag":209,"props":23756,"children":23757},{"style":263},[23758],{"type":26,"value":23759},"500",{"type":21,"tag":209,"props":23761,"children":23762},{"style":222},[23763],{"type":26,"value":10112},{"type":21,"tag":209,"props":23765,"children":23766},{"class":211,"line":472},[23767,23771,23775,23780],{"type":21,"tag":209,"props":23768,"children":23769},{"style":216},[23770],{"type":26,"value":1298},{"type":21,"tag":209,"props":23772,"children":23773},{"style":222},[23774],{"type":26,"value":23735},{"type":21,"tag":209,"props":23776,"children":23777},{"style":233},[23778],{"type":26,"value":23779},"\"token\"",{"type":21,"tag":209,"props":23781,"children":23782},{"style":222},[23783],{"type":26,"value":23784},": client_token})\n",{"type":21,"tag":22,"props":23786,"children":23787},{},[23788,23790,23795,23797,23803],{"type":26,"value":23789},"For Django, we can add this to a reasonable route in our ",{"type":21,"tag":63,"props":23791,"children":23793},{"className":23792},[],[23794],{"type":26,"value":20306},{"type":26,"value":23796}," file, and then make ajax requests against this route to generate and return the client token that the javascript braintree library requires. For the purpose of this tutorial, we'll assume we've bound it to ",{"type":21,"tag":63,"props":23798,"children":23800},{"className":23799},[],[23801],{"type":26,"value":23802},"/payment/token/",{"type":26,"value":378},{"type":21,"tag":22,"props":23805,"children":23806},{},[23807],{"type":26,"value":23808},"As an aside, we could also generate this token as part of the view and pass it into the context if we knew we were going to need it immediately, or if there were some other reason why an ajax roundtrip is undesirable. This could be as simple as:",{"type":21,"tag":200,"props":23810,"children":23812},{"className":9840,"code":23811,"language":9842,"meta":8,"style":8},"import braintree\nfrom django.shortcuts import render\nfrom django.http import HttpResponse\n\ndef start_payment_view(request, template_name=\"start_payment.html\"):\n    \"\"\"\n    Generate client token and pass it in the view context.\n    \"\"\"\n    try:\n        client_token = braintree.ClientToken.generate()\n    except ValueError as e:\n        return HttpResponse(\"Failed to generate Braintree client token\", status=500)\n\n    return render(request, template_name, {\"bt_client_token\": client_token})\n",[23813],{"type":21,"tag":63,"props":23814,"children":23815},{"__ignoreMap":8},[23816,23827,23848,23867,23874,23905,23912,23920,23927,23938,23953,23972,24008,24015],{"type":21,"tag":209,"props":23817,"children":23818},{"class":211,"line":212},[23819,23823],{"type":21,"tag":209,"props":23820,"children":23821},{"style":216},[23822],{"type":26,"value":219},{"type":21,"tag":209,"props":23824,"children":23825},{"style":222},[23826],{"type":26,"value":23418},{"type":21,"tag":209,"props":23828,"children":23829},{"class":211,"line":244},[23830,23834,23839,23843],{"type":21,"tag":209,"props":23831,"children":23832},{"style":216},[23833],{"type":26,"value":230},{"type":21,"tag":209,"props":23835,"children":23836},{"style":222},[23837],{"type":26,"value":23838}," django.shortcuts ",{"type":21,"tag":209,"props":23840,"children":23841},{"style":216},[23842],{"type":26,"value":219},{"type":21,"tag":209,"props":23844,"children":23845},{"style":222},[23846],{"type":26,"value":23847}," render\n",{"type":21,"tag":209,"props":23849,"children":23850},{"class":211,"line":254},[23851,23855,23859,23863],{"type":21,"tag":209,"props":23852,"children":23853},{"style":216},[23854],{"type":26,"value":230},{"type":21,"tag":209,"props":23856,"children":23857},{"style":222},[23858],{"type":26,"value":20584},{"type":21,"tag":209,"props":23860,"children":23861},{"style":216},[23862],{"type":26,"value":219},{"type":21,"tag":209,"props":23864,"children":23865},{"style":222},[23866],{"type":26,"value":20593},{"type":21,"tag":209,"props":23868,"children":23869},{"class":211,"line":279},[23870],{"type":21,"tag":209,"props":23871,"children":23872},{"emptyLinePlaceholder":248},[23873],{"type":26,"value":251},{"type":21,"tag":209,"props":23875,"children":23876},{"class":211,"line":288},[23877,23881,23886,23891,23895,23900],{"type":21,"tag":209,"props":23878,"children":23879},{"style":216},[23880],{"type":26,"value":9882},{"type":21,"tag":209,"props":23882,"children":23883},{"style":360},[23884],{"type":26,"value":23885}," start_payment_view",{"type":21,"tag":209,"props":23887,"children":23888},{"style":222},[23889],{"type":26,"value":23890},"(request, template_name",{"type":21,"tag":209,"props":23892,"children":23893},{"style":216},[23894],{"type":26,"value":1432},{"type":21,"tag":209,"props":23896,"children":23897},{"style":233},[23898],{"type":26,"value":23899},"\"start_payment.html\"",{"type":21,"tag":209,"props":23901,"children":23902},{"style":222},[23903],{"type":26,"value":23904},"):\n",{"type":21,"tag":209,"props":23906,"children":23907},{"class":211,"line":307},[23908],{"type":21,"tag":209,"props":23909,"children":23910},{"style":233},[23911],{"type":26,"value":9900},{"type":21,"tag":209,"props":23913,"children":23914},{"class":211,"line":325},[23915],{"type":21,"tag":209,"props":23916,"children":23917},{"style":233},[23918],{"type":26,"value":23919},"    Generate client token and pass it in the view context.\n",{"type":21,"tag":209,"props":23921,"children":23922},{"class":211,"line":334},[23923],{"type":21,"tag":209,"props":23924,"children":23925},{"style":233},[23926],{"type":26,"value":9900},{"type":21,"tag":209,"props":23928,"children":23929},{"class":211,"line":343},[23930,23934],{"type":21,"tag":209,"props":23931,"children":23932},{"style":216},[23933],{"type":26,"value":10041},{"type":21,"tag":209,"props":23935,"children":23936},{"style":222},[23937],{"type":26,"value":844},{"type":21,"tag":209,"props":23939,"children":23940},{"class":211,"line":351},[23941,23945,23949],{"type":21,"tag":209,"props":23942,"children":23943},{"style":222},[23944],{"type":26,"value":23692},{"type":21,"tag":209,"props":23946,"children":23947},{"style":216},[23948],{"type":26,"value":1432},{"type":21,"tag":209,"props":23950,"children":23951},{"style":222},[23952],{"type":26,"value":23701},{"type":21,"tag":209,"props":23954,"children":23955},{"class":211,"line":444},[23956,23960,23964,23968],{"type":21,"tag":209,"props":23957,"children":23958},{"style":216},[23959],{"type":26,"value":10120},{"type":21,"tag":209,"props":23961,"children":23962},{"style":263},[23963],{"type":26,"value":23713},{"type":21,"tag":209,"props":23965,"children":23966},{"style":216},[23967],{"type":26,"value":23718},{"type":21,"tag":209,"props":23969,"children":23970},{"style":222},[23971],{"type":26,"value":23723},{"type":21,"tag":209,"props":23973,"children":23974},{"class":211,"line":454},[23975,23979,23983,23988,23992,23996,24000,24004],{"type":21,"tag":209,"props":23976,"children":23977},{"style":216},[23978],{"type":26,"value":3069},{"type":21,"tag":209,"props":23980,"children":23981},{"style":222},[23982],{"type":26,"value":20663},{"type":21,"tag":209,"props":23984,"children":23985},{"style":233},[23986],{"type":26,"value":23987},"\"Failed to generate Braintree client token\"",{"type":21,"tag":209,"props":23989,"children":23990},{"style":222},[23991],{"type":26,"value":408},{"type":21,"tag":209,"props":23993,"children":23994},{"style":400},[23995],{"type":26,"value":23750},{"type":21,"tag":209,"props":23997,"children":23998},{"style":216},[23999],{"type":26,"value":1432},{"type":21,"tag":209,"props":24001,"children":24002},{"style":263},[24003],{"type":26,"value":23759},{"type":21,"tag":209,"props":24005,"children":24006},{"style":222},[24007],{"type":26,"value":10112},{"type":21,"tag":209,"props":24009,"children":24010},{"class":211,"line":463},[24011],{"type":21,"tag":209,"props":24012,"children":24013},{"emptyLinePlaceholder":248},[24014],{"type":26,"value":251},{"type":21,"tag":209,"props":24016,"children":24017},{"class":211,"line":472},[24018,24022,24027,24032],{"type":21,"tag":209,"props":24019,"children":24020},{"style":216},[24021],{"type":26,"value":1298},{"type":21,"tag":209,"props":24023,"children":24024},{"style":222},[24025],{"type":26,"value":24026}," render(request, template_name, {",{"type":21,"tag":209,"props":24028,"children":24029},{"style":233},[24030],{"type":26,"value":24031},"\"bt_client_token\"",{"type":21,"tag":209,"props":24033,"children":24034},{"style":222},[24035],{"type":26,"value":23784},{"type":21,"tag":3549,"props":24037,"children":24039},{"id":24038},"client-setup",[24040],{"type":26,"value":24041},"Client Setup",{"type":21,"tag":22,"props":24043,"children":24044},{},[24045,24047,24054,24056,24063,24065,24072],{"type":26,"value":24046},"Now for ",{"type":21,"tag":29,"props":24048,"children":24051},{"href":24049,"rel":24050},"https://developers.braintreepayments.com/reference/client-reference/javascript/v2/configuration",[93],[24052],{"type":26,"value":24053},"client side configuration",{"type":26,"value":24055},". On the client side, we're going to assume we want to use the ",{"type":21,"tag":29,"props":24057,"children":24060},{"href":24058,"rel":24059},"https://developers.braintreepayments.com/guides/drop-in/javascript/v2",[93],[24061],{"type":26,"value":24062},"'Drop-in'",{"type":26,"value":24064}," integration. This generates an iframe hosted by Braintree, allowing our application to qualify for the lowest-effort level of ",{"type":21,"tag":29,"props":24066,"children":24069},{"href":24067,"rel":24068},"https://en.wikipedia.org/wiki/Payment_Card_Industry_Data_Security_Standard",[93],[24070],{"type":26,"value":24071},"PCI Compliance",{"type":26,"value":24073},", while still allowing for a fair amount of customizability, some of which we'll explore shortly.",{"type":21,"tag":22,"props":24075,"children":24076},{},[24077,24079,24086,24088,24094],{"type":26,"value":24078},"Braintree offers a ",{"type":21,"tag":29,"props":24080,"children":24083},{"href":24081,"rel":24082},"https://developers.braintreepayments.com/guides/client-sdk/setup/javascript/v2#install-it-with-npm",[93],[24084],{"type":26,"value":24085},"variety of options",{"type":26,"value":24087}," for integrating the library with your application. For the below, we assume we have a ",{"type":21,"tag":63,"props":24089,"children":24091},{"className":24090},[],[24092],{"type":26,"value":24093},"braintree",{"type":26,"value":24095}," object in global scope:",{"type":21,"tag":200,"props":24097,"children":24099},{"className":9044,"code":24098,"language":9046,"meta":8,"style":8},"        /**\n         * Request client token and initialize braintree payment library.\n         */\n    setupBraintree:function(){\n        $.ajax({\n            type:'GET',\n            dataType:'json',\n            url:'/payment/token/'\n        }).done(function(res){\n            braintree.setup(res.token, \"dropin\", {\n                container:$('#braintreeContainer')[0],\n                onReady:paymentMethodReady,\n                onPaymentMethodReceived:paymentMethodReceived,\n                onError:paymentMethodError\n            });\n        }.bind(this)).fail(function(jqXHR){\n            console.log(jqXHR, jqXHR.responseJSON || jqXHR.responseText);\n        });\n    }\n",[24100],{"type":21,"tag":63,"props":24101,"children":24102},{"__ignoreMap":8},[24103,24110,24118,24125,24145,24161,24177,24194,24207,24238,24264,24298,24306,24314,24322,24329,24378,24403,24410],{"type":21,"tag":209,"props":24104,"children":24105},{"class":211,"line":212},[24106],{"type":21,"tag":209,"props":24107,"children":24108},{"style":448},[24109],{"type":26,"value":2412},{"type":21,"tag":209,"props":24111,"children":24112},{"class":211,"line":244},[24113],{"type":21,"tag":209,"props":24114,"children":24115},{"style":448},[24116],{"type":26,"value":24117},"         * Request client token and initialize braintree payment library.\n",{"type":21,"tag":209,"props":24119,"children":24120},{"class":211,"line":254},[24121],{"type":21,"tag":209,"props":24122,"children":24123},{"style":448},[24124],{"type":26,"value":2439},{"type":21,"tag":209,"props":24126,"children":24127},{"class":211,"line":279},[24128,24133,24137,24141],{"type":21,"tag":209,"props":24129,"children":24130},{"style":360},[24131],{"type":26,"value":24132},"    setupBraintree",{"type":21,"tag":209,"props":24134,"children":24135},{"style":222},[24136],{"type":26,"value":191},{"type":21,"tag":209,"props":24138,"children":24139},{"style":216},[24140],{"type":26,"value":5370},{"type":21,"tag":209,"props":24142,"children":24143},{"style":222},[24144],{"type":26,"value":2561},{"type":21,"tag":209,"props":24146,"children":24147},{"class":211,"line":288},[24148,24153,24157],{"type":21,"tag":209,"props":24149,"children":24150},{"style":222},[24151],{"type":26,"value":24152},"        $.",{"type":21,"tag":209,"props":24154,"children":24155},{"style":360},[24156],{"type":26,"value":17978},{"type":21,"tag":209,"props":24158,"children":24159},{"style":222},[24160],{"type":26,"value":17983},{"type":21,"tag":209,"props":24162,"children":24163},{"class":211,"line":307},[24164,24169,24173],{"type":21,"tag":209,"props":24165,"children":24166},{"style":222},[24167],{"type":26,"value":24168},"            type:",{"type":21,"tag":209,"props":24170,"children":24171},{"style":233},[24172],{"type":26,"value":17996},{"type":21,"tag":209,"props":24174,"children":24175},{"style":222},[24176],{"type":26,"value":304},{"type":21,"tag":209,"props":24178,"children":24179},{"class":211,"line":325},[24180,24185,24190],{"type":21,"tag":209,"props":24181,"children":24182},{"style":222},[24183],{"type":26,"value":24184},"            dataType:",{"type":21,"tag":209,"props":24186,"children":24187},{"style":233},[24188],{"type":26,"value":24189},"'json'",{"type":21,"tag":209,"props":24191,"children":24192},{"style":222},[24193],{"type":26,"value":304},{"type":21,"tag":209,"props":24195,"children":24196},{"class":211,"line":334},[24197,24202],{"type":21,"tag":209,"props":24198,"children":24199},{"style":222},[24200],{"type":26,"value":24201},"            url:",{"type":21,"tag":209,"props":24203,"children":24204},{"style":233},[24205],{"type":26,"value":24206},"'/payment/token/'\n",{"type":21,"tag":209,"props":24208,"children":24209},{"class":211,"line":343},[24210,24214,24218,24222,24226,24230,24234],{"type":21,"tag":209,"props":24211,"children":24212},{"style":222},[24213],{"type":26,"value":11670},{"type":21,"tag":209,"props":24215,"children":24216},{"style":360},[24217],{"type":26,"value":18042},{"type":21,"tag":209,"props":24219,"children":24220},{"style":222},[24221],{"type":26,"value":368},{"type":21,"tag":209,"props":24223,"children":24224},{"style":216},[24225],{"type":26,"value":5370},{"type":21,"tag":209,"props":24227,"children":24228},{"style":222},[24229],{"type":26,"value":368},{"type":21,"tag":209,"props":24231,"children":24232},{"style":400},[24233],{"type":26,"value":1385},{"type":21,"tag":209,"props":24235,"children":24236},{"style":222},[24237],{"type":26,"value":2369},{"type":21,"tag":209,"props":24239,"children":24240},{"class":211,"line":351},[24241,24246,24250,24255,24260],{"type":21,"tag":209,"props":24242,"children":24243},{"style":222},[24244],{"type":26,"value":24245},"            braintree.",{"type":21,"tag":209,"props":24247,"children":24248},{"style":360},[24249],{"type":26,"value":2887},{"type":21,"tag":209,"props":24251,"children":24252},{"style":222},[24253],{"type":26,"value":24254},"(res.token, ",{"type":21,"tag":209,"props":24256,"children":24257},{"style":233},[24258],{"type":26,"value":24259},"\"dropin\"",{"type":21,"tag":209,"props":24261,"children":24262},{"style":222},[24263],{"type":26,"value":18186},{"type":21,"tag":209,"props":24265,"children":24266},{"class":211,"line":444},[24267,24272,24276,24280,24285,24290,24294],{"type":21,"tag":209,"props":24268,"children":24269},{"style":222},[24270],{"type":26,"value":24271},"                container:",{"type":21,"tag":209,"props":24273,"children":24274},{"style":360},[24275],{"type":26,"value":10250},{"type":21,"tag":209,"props":24277,"children":24278},{"style":222},[24279],{"type":26,"value":368},{"type":21,"tag":209,"props":24281,"children":24282},{"style":233},[24283],{"type":26,"value":24284},"'#braintreeContainer'",{"type":21,"tag":209,"props":24286,"children":24287},{"style":222},[24288],{"type":26,"value":24289},")[",{"type":21,"tag":209,"props":24291,"children":24292},{"style":263},[24293],{"type":26,"value":6048},{"type":21,"tag":209,"props":24295,"children":24296},{"style":222},[24297],{"type":26,"value":10454},{"type":21,"tag":209,"props":24299,"children":24300},{"class":211,"line":454},[24301],{"type":21,"tag":209,"props":24302,"children":24303},{"style":222},[24304],{"type":26,"value":24305},"                onReady:paymentMethodReady,\n",{"type":21,"tag":209,"props":24307,"children":24308},{"class":211,"line":463},[24309],{"type":21,"tag":209,"props":24310,"children":24311},{"style":222},[24312],{"type":26,"value":24313},"                onPaymentMethodReceived:paymentMethodReceived,\n",{"type":21,"tag":209,"props":24315,"children":24316},{"class":211,"line":472},[24317],{"type":21,"tag":209,"props":24318,"children":24319},{"style":222},[24320],{"type":26,"value":24321},"                onError:paymentMethodError\n",{"type":21,"tag":209,"props":24323,"children":24324},{"class":211,"line":480},[24325],{"type":21,"tag":209,"props":24326,"children":24327},{"style":222},[24328],{"type":26,"value":2782},{"type":21,"tag":209,"props":24330,"children":24331},{"class":211,"line":489},[24332,24337,24341,24345,24349,24354,24358,24362,24366,24370,24374],{"type":21,"tag":209,"props":24333,"children":24334},{"style":222},[24335],{"type":26,"value":24336},"        }.",{"type":21,"tag":209,"props":24338,"children":24339},{"style":360},[24340],{"type":26,"value":17387},{"type":21,"tag":209,"props":24342,"children":24343},{"style":222},[24344],{"type":26,"value":368},{"type":21,"tag":209,"props":24346,"children":24347},{"style":263},[24348],{"type":26,"value":2508},{"type":21,"tag":209,"props":24350,"children":24351},{"style":222},[24352],{"type":26,"value":24353},")).",{"type":21,"tag":209,"props":24355,"children":24356},{"style":360},[24357],{"type":26,"value":18091},{"type":21,"tag":209,"props":24359,"children":24360},{"style":222},[24361],{"type":26,"value":368},{"type":21,"tag":209,"props":24363,"children":24364},{"style":216},[24365],{"type":26,"value":5370},{"type":21,"tag":209,"props":24367,"children":24368},{"style":222},[24369],{"type":26,"value":368},{"type":21,"tag":209,"props":24371,"children":24372},{"style":400},[24373],{"type":26,"value":18108},{"type":21,"tag":209,"props":24375,"children":24376},{"style":222},[24377],{"type":26,"value":2369},{"type":21,"tag":209,"props":24379,"children":24380},{"class":211,"line":847},[24381,24385,24389,24394,24398],{"type":21,"tag":209,"props":24382,"children":24383},{"style":222},[24384],{"type":26,"value":2495},{"type":21,"tag":209,"props":24386,"children":24387},{"style":360},[24388],{"type":26,"value":1059},{"type":21,"tag":209,"props":24390,"children":24391},{"style":222},[24392],{"type":26,"value":24393},"(jqXHR, jqXHR.responseJSON ",{"type":21,"tag":209,"props":24395,"children":24396},{"style":216},[24397],{"type":26,"value":4677},{"type":21,"tag":209,"props":24399,"children":24400},{"style":222},[24401],{"type":26,"value":24402}," jqXHR.responseText);\n",{"type":21,"tag":209,"props":24404,"children":24405},{"class":211,"line":860},[24406],{"type":21,"tag":209,"props":24407,"children":24408},{"style":222},[24409],{"type":26,"value":5114},{"type":21,"tag":209,"props":24411,"children":24412},{"class":211,"line":877},[24413],{"type":21,"tag":209,"props":24414,"children":24415},{"style":222},[24416],{"type":26,"value":331},{"type":21,"tag":22,"props":24418,"children":24419},{},[24420],{"type":26,"value":24421},"Here, we request the client token and, as soon as we've received it from the server, initialize the braintree library, telling it where to place the 'dropin' iframe, and specifying a number of other options, which we'll return to shortly.",{"type":21,"tag":22,"props":24423,"children":24424},{},[24425,24427,24433],{"type":26,"value":24426},"As we need a node for the braintree iframe to live in, which you'll notice in the above code we've given the id of ",{"type":21,"tag":63,"props":24428,"children":24430},{"className":24429},[],[24431],{"type":26,"value":24432},"braintreeContainer",{"type":26,"value":24434},", a sparse example of the markup might look like:",{"type":21,"tag":200,"props":24436,"children":24438},{"className":7947,"code":24437,"language":7949,"meta":8,"style":8},"    \u003Cbody>\n\n        \u003Cform>\n            \u003Cdiv id=\"braintreeContainer\">\u003C/div>\n\n            \u003Cbutton type=\"submit\">Pay Now\u003C/button>\n        \u003C/form>\n\n    \u003C/body>\n",[24439],{"type":21,"tag":63,"props":24440,"children":24441},{"__ignoreMap":8},[24442,24458,24465,24482,24521,24528,24567,24583,24590],{"type":21,"tag":209,"props":24443,"children":24444},{"class":211,"line":212},[24445,24449,24454],{"type":21,"tag":209,"props":24446,"children":24447},{"style":222},[24448],{"type":26,"value":2004},{"type":21,"tag":209,"props":24450,"children":24451},{"style":1988},[24452],{"type":26,"value":24453},"body",{"type":21,"tag":209,"props":24455,"children":24456},{"style":222},[24457],{"type":26,"value":1996},{"type":21,"tag":209,"props":24459,"children":24460},{"class":211,"line":244},[24461],{"type":21,"tag":209,"props":24462,"children":24463},{"emptyLinePlaceholder":248},[24464],{"type":26,"value":251},{"type":21,"tag":209,"props":24466,"children":24467},{"class":211,"line":254},[24468,24473,24478],{"type":21,"tag":209,"props":24469,"children":24470},{"style":222},[24471],{"type":26,"value":24472},"        \u003C",{"type":21,"tag":209,"props":24474,"children":24475},{"style":1988},[24476],{"type":26,"value":24477},"form",{"type":21,"tag":209,"props":24479,"children":24480},{"style":222},[24481],{"type":26,"value":1996},{"type":21,"tag":209,"props":24483,"children":24484},{"class":211,"line":279},[24485,24490,24494,24499,24503,24508,24513,24517],{"type":21,"tag":209,"props":24486,"children":24487},{"style":222},[24488],{"type":26,"value":24489},"            \u003C",{"type":21,"tag":209,"props":24491,"children":24492},{"style":1988},[24493],{"type":26,"value":2009},{"type":21,"tag":209,"props":24495,"children":24496},{"style":360},[24497],{"type":26,"value":24498}," id",{"type":21,"tag":209,"props":24500,"children":24501},{"style":222},[24502],{"type":26,"value":1432},{"type":21,"tag":209,"props":24504,"children":24505},{"style":233},[24506],{"type":26,"value":24507},"\"braintreeContainer\"",{"type":21,"tag":209,"props":24509,"children":24510},{"style":222},[24511],{"type":26,"value":24512},">\u003C/",{"type":21,"tag":209,"props":24514,"children":24515},{"style":1988},[24516],{"type":26,"value":2009},{"type":21,"tag":209,"props":24518,"children":24519},{"style":222},[24520],{"type":26,"value":1996},{"type":21,"tag":209,"props":24522,"children":24523},{"class":211,"line":288},[24524],{"type":21,"tag":209,"props":24525,"children":24526},{"emptyLinePlaceholder":248},[24527],{"type":26,"value":251},{"type":21,"tag":209,"props":24529,"children":24530},{"class":211,"line":307},[24531,24535,24540,24545,24549,24554,24559,24563],{"type":21,"tag":209,"props":24532,"children":24533},{"style":222},[24534],{"type":26,"value":24489},{"type":21,"tag":209,"props":24536,"children":24537},{"style":1988},[24538],{"type":26,"value":24539},"button",{"type":21,"tag":209,"props":24541,"children":24542},{"style":360},[24543],{"type":26,"value":24544}," type",{"type":21,"tag":209,"props":24546,"children":24547},{"style":222},[24548],{"type":26,"value":1432},{"type":21,"tag":209,"props":24550,"children":24551},{"style":233},[24552],{"type":26,"value":24553},"\"submit\"",{"type":21,"tag":209,"props":24555,"children":24556},{"style":222},[24557],{"type":26,"value":24558},">Pay Now\u003C/",{"type":21,"tag":209,"props":24560,"children":24561},{"style":1988},[24562],{"type":26,"value":24539},{"type":21,"tag":209,"props":24564,"children":24565},{"style":222},[24566],{"type":26,"value":1996},{"type":21,"tag":209,"props":24568,"children":24569},{"class":211,"line":325},[24570,24575,24579],{"type":21,"tag":209,"props":24571,"children":24572},{"style":222},[24573],{"type":26,"value":24574},"        \u003C/",{"type":21,"tag":209,"props":24576,"children":24577},{"style":1988},[24578],{"type":26,"value":24477},{"type":21,"tag":209,"props":24580,"children":24581},{"style":222},[24582],{"type":26,"value":1996},{"type":21,"tag":209,"props":24584,"children":24585},{"class":211,"line":334},[24586],{"type":21,"tag":209,"props":24587,"children":24588},{"emptyLinePlaceholder":248},[24589],{"type":26,"value":251},{"type":21,"tag":209,"props":24591,"children":24592},{"class":211,"line":343},[24593,24598,24602],{"type":21,"tag":209,"props":24594,"children":24595},{"style":222},[24596],{"type":26,"value":24597},"    \u003C/",{"type":21,"tag":209,"props":24599,"children":24600},{"style":1988},[24601],{"type":26,"value":24453},{"type":21,"tag":209,"props":24603,"children":24604},{"style":222},[24605],{"type":26,"value":1996},{"type":21,"tag":22,"props":24607,"children":24608},{},[24609],{"type":26,"value":24610},"Notice the 'Pay Now' button - we'll need to use it to trigger submission of the containing form (which in turn will trigger submission/processing of the input within the braintree iframe). Notice also that we don't specify any form action - we'll be submitting our payment details by ajax, but we could instead specify an action, and send needed details via hidden fields in the form.",{"type":21,"tag":22,"props":24612,"children":24613},{},[24614],{"type":26,"value":24615},"At this point, if those additional options in the braintree.setup pointed to real functions, we would see something like:",{"type":21,"tag":22,"props":24617,"children":24618},{},[24619],{"type":21,"tag":8920,"props":24620,"children":24623},{"alt":24621,"src":24622},"braintree client example","assets/images/bt_ex_1.jpg",[],{"type":21,"tag":3549,"props":24625,"children":24627},{"id":24626},"client-options",[24628],{"type":26,"value":24629},"Client Options",{"type":21,"tag":22,"props":24631,"children":24632},{},[24633,24635,24642,24644,24650],{"type":26,"value":24634},"Let's take a closer look at those ",{"type":21,"tag":29,"props":24636,"children":24639},{"href":24637,"rel":24638},"https://developers.braintreepayments.com/reference/client-reference/javascript/v2/configuration#setup-method-options",[93],[24640],{"type":26,"value":24641},"setup options",{"type":26,"value":24643},", then. Besides the obvious ",{"type":21,"tag":63,"props":24645,"children":24647},{"className":24646},[],[24648],{"type":26,"value":24649},"container",{"type":26,"value":24651}," option, we have three more: onReady, onPaymentMethodReceived, and onError, which we supply with callback functions. The Braintree documentation adequately explains each of them (and a number of others we aren't taking a look at today, such as an option to enable CORS requests), so let's instead take at what other things might do in the specified functions.",{"type":21,"tag":200,"props":24653,"children":24655},{"className":9044,"code":24654,"language":9046,"meta":8,"style":8},"    /**\n     * As this function informs us that the braintree setup is complete, if we were hiding the braintree container node\n     * or displaying some other dialog while it loaded, we could now safely reveal it to the user.\n     * @param {object} integration An object containing the teardown, paypal and deviceData objects, as noted\n     * in the braintree docs.\n     */\n    paymentMethodReady:function(integration){\n        // e.g.\n        $('#braintreeContainer').show();\n    }\n    /**\n     * Called by the braintree js SDK once the payment method has been received - that is, once the user has selected\n     * their paypal account or entered their credit card details.\n     * @param {object} recv Contains the following:\n     * nonce: The payment method nonce.\n     * type: A string representing the type of payment method generated; either 'CreditCard' or 'PayPalAccount'.\n     * details: Additional details. See https://developers.braintreepayments.com/reference/client-reference/javascript/v2/configuration#onpaymentmethodreceived-details-object\n     */\n    paymentMethodReceived:function(recv){\n        // We could be submitting information to our server via the form, and add information we need submitted as hidden\n        // fields on the form, but we can also submit the information we want to the server within this callback via ajax.\n        var details = {otherDetails:{/* object containing any other info we want to send up */, payment:recv};\n\n        $.ajax({\n            url:'/payment/process/',\n            type:'POST',\n            dataType:'json',\n            contentType:'application/json',\n            data:JSON.stringify(details)\n        }).done(function(res){\n            // Do something with the response from your server.\n        }.bind(this)).fail(function(jqXHR){\n            var res = jqXHR.responseJSON || jqXHR.responseText;\n            console.log(res);\n        }\n    }\n\n    /**\n     * On payment method error, this callback will receive a detail object, as noted in the setup options\n     * documentation, which gives us some idea as to what error occurred, allowing us to choose how to \n     * respond to it or inform the client about it.\n     * @param {object} detail\n     */\n    paymentMethodError:function(detail){\n        console.log(detail);\n\n        if (detail.type == \"VALIDATION\"){\n            // Potentially display a notification to your user that validation failed.\n            return;\n        }\n\n        // Potentially display or log that another type of error occurred.\n    }\n",[24656],{"type":21,"tag":63,"props":24657,"children":24658},{"__ignoreMap":8},[24659,24666,24674,24682,24708,24716,24723,24752,24760,24789,24796,24803,24811,24819,24844,24852,24860,24868,24875,24904,24912,24920,24951,24958,24973,24989,25005,25020,25037,25064,25095,25103,25150,25180,25196,25203,25210,25217,25224,25232,25240,25248,25268,25275,25300,25316,25323,25348,25356,25367,25374,25381,25389],{"type":21,"tag":209,"props":24660,"children":24661},{"class":211,"line":212},[24662],{"type":21,"tag":209,"props":24663,"children":24664},{"style":448},[24665],{"type":26,"value":4697},{"type":21,"tag":209,"props":24667,"children":24668},{"class":211,"line":244},[24669],{"type":21,"tag":209,"props":24670,"children":24671},{"style":448},[24672],{"type":26,"value":24673},"     * As this function informs us that the braintree setup is complete, if we were hiding the braintree container node\n",{"type":21,"tag":209,"props":24675,"children":24676},{"class":211,"line":254},[24677],{"type":21,"tag":209,"props":24678,"children":24679},{"style":448},[24680],{"type":26,"value":24681},"     * or displaying some other dialog while it loaded, we could now safely reveal it to the user.\n",{"type":21,"tag":209,"props":24683,"children":24684},{"class":211,"line":279},[24685,24689,24693,24698,24703],{"type":21,"tag":209,"props":24686,"children":24687},{"style":448},[24688],{"type":26,"value":4713},{"type":21,"tag":209,"props":24690,"children":24691},{"style":216},[24692],{"type":26,"value":4718},{"type":21,"tag":209,"props":24694,"children":24695},{"style":360},[24696],{"type":26,"value":24697}," {object}",{"type":21,"tag":209,"props":24699,"children":24700},{"style":222},[24701],{"type":26,"value":24702}," integration",{"type":21,"tag":209,"props":24704,"children":24705},{"style":448},[24706],{"type":26,"value":24707}," An object containing the teardown, paypal and deviceData objects, as noted\n",{"type":21,"tag":209,"props":24709,"children":24710},{"class":211,"line":288},[24711],{"type":21,"tag":209,"props":24712,"children":24713},{"style":448},[24714],{"type":26,"value":24715},"     * in the braintree docs.\n",{"type":21,"tag":209,"props":24717,"children":24718},{"class":211,"line":307},[24719],{"type":21,"tag":209,"props":24720,"children":24721},{"style":448},[24722],{"type":26,"value":4753},{"type":21,"tag":209,"props":24724,"children":24725},{"class":211,"line":325},[24726,24731,24735,24739,24743,24748],{"type":21,"tag":209,"props":24727,"children":24728},{"style":360},[24729],{"type":26,"value":24730},"    paymentMethodReady",{"type":21,"tag":209,"props":24732,"children":24733},{"style":222},[24734],{"type":26,"value":191},{"type":21,"tag":209,"props":24736,"children":24737},{"style":216},[24738],{"type":26,"value":5370},{"type":21,"tag":209,"props":24740,"children":24741},{"style":222},[24742],{"type":26,"value":368},{"type":21,"tag":209,"props":24744,"children":24745},{"style":400},[24746],{"type":26,"value":24747},"integration",{"type":21,"tag":209,"props":24749,"children":24750},{"style":222},[24751],{"type":26,"value":2369},{"type":21,"tag":209,"props":24753,"children":24754},{"class":211,"line":334},[24755],{"type":21,"tag":209,"props":24756,"children":24757},{"style":448},[24758],{"type":26,"value":24759},"        // e.g.\n",{"type":21,"tag":209,"props":24761,"children":24762},{"class":211,"line":343},[24763,24768,24772,24776,24780,24785],{"type":21,"tag":209,"props":24764,"children":24765},{"style":360},[24766],{"type":26,"value":24767},"        $",{"type":21,"tag":209,"props":24769,"children":24770},{"style":222},[24771],{"type":26,"value":368},{"type":21,"tag":209,"props":24773,"children":24774},{"style":233},[24775],{"type":26,"value":24284},{"type":21,"tag":209,"props":24777,"children":24778},{"style":222},[24779],{"type":26,"value":2699},{"type":21,"tag":209,"props":24781,"children":24782},{"style":360},[24783],{"type":26,"value":24784},"show",{"type":21,"tag":209,"props":24786,"children":24787},{"style":222},[24788],{"type":26,"value":4842},{"type":21,"tag":209,"props":24790,"children":24791},{"class":211,"line":351},[24792],{"type":21,"tag":209,"props":24793,"children":24794},{"style":222},[24795],{"type":26,"value":331},{"type":21,"tag":209,"props":24797,"children":24798},{"class":211,"line":444},[24799],{"type":21,"tag":209,"props":24800,"children":24801},{"style":448},[24802],{"type":26,"value":4697},{"type":21,"tag":209,"props":24804,"children":24805},{"class":211,"line":454},[24806],{"type":21,"tag":209,"props":24807,"children":24808},{"style":448},[24809],{"type":26,"value":24810},"     * Called by the braintree js SDK once the payment method has been received - that is, once the user has selected\n",{"type":21,"tag":209,"props":24812,"children":24813},{"class":211,"line":463},[24814],{"type":21,"tag":209,"props":24815,"children":24816},{"style":448},[24817],{"type":26,"value":24818},"     * their paypal account or entered their credit card details.\n",{"type":21,"tag":209,"props":24820,"children":24821},{"class":211,"line":472},[24822,24826,24830,24834,24839],{"type":21,"tag":209,"props":24823,"children":24824},{"style":448},[24825],{"type":26,"value":4713},{"type":21,"tag":209,"props":24827,"children":24828},{"style":216},[24829],{"type":26,"value":4718},{"type":21,"tag":209,"props":24831,"children":24832},{"style":360},[24833],{"type":26,"value":24697},{"type":21,"tag":209,"props":24835,"children":24836},{"style":222},[24837],{"type":26,"value":24838}," recv",{"type":21,"tag":209,"props":24840,"children":24841},{"style":448},[24842],{"type":26,"value":24843}," Contains the following:\n",{"type":21,"tag":209,"props":24845,"children":24846},{"class":211,"line":480},[24847],{"type":21,"tag":209,"props":24848,"children":24849},{"style":448},[24850],{"type":26,"value":24851},"     * nonce: The payment method nonce.\n",{"type":21,"tag":209,"props":24853,"children":24854},{"class":211,"line":489},[24855],{"type":21,"tag":209,"props":24856,"children":24857},{"style":448},[24858],{"type":26,"value":24859},"     * type: A string representing the type of payment method generated; either 'CreditCard' or 'PayPalAccount'.\n",{"type":21,"tag":209,"props":24861,"children":24862},{"class":211,"line":847},[24863],{"type":21,"tag":209,"props":24864,"children":24865},{"style":448},[24866],{"type":26,"value":24867},"     * details: Additional details. See https://developers.braintreepayments.com/reference/client-reference/javascript/v2/configuration#onpaymentmethodreceived-details-object\n",{"type":21,"tag":209,"props":24869,"children":24870},{"class":211,"line":860},[24871],{"type":21,"tag":209,"props":24872,"children":24873},{"style":448},[24874],{"type":26,"value":4753},{"type":21,"tag":209,"props":24876,"children":24877},{"class":211,"line":877},[24878,24883,24887,24891,24895,24900],{"type":21,"tag":209,"props":24879,"children":24880},{"style":360},[24881],{"type":26,"value":24882},"    paymentMethodReceived",{"type":21,"tag":209,"props":24884,"children":24885},{"style":222},[24886],{"type":26,"value":191},{"type":21,"tag":209,"props":24888,"children":24889},{"style":216},[24890],{"type":26,"value":5370},{"type":21,"tag":209,"props":24892,"children":24893},{"style":222},[24894],{"type":26,"value":368},{"type":21,"tag":209,"props":24896,"children":24897},{"style":400},[24898],{"type":26,"value":24899},"recv",{"type":21,"tag":209,"props":24901,"children":24902},{"style":222},[24903],{"type":26,"value":2369},{"type":21,"tag":209,"props":24905,"children":24906},{"class":211,"line":889},[24907],{"type":21,"tag":209,"props":24908,"children":24909},{"style":448},[24910],{"type":26,"value":24911},"        // We could be submitting information to our server via the form, and add information we need submitted as hidden\n",{"type":21,"tag":209,"props":24913,"children":24914},{"class":211,"line":902},[24915],{"type":21,"tag":209,"props":24916,"children":24917},{"style":448},[24918],{"type":26,"value":24919},"        // fields on the form, but we can also submit the information we want to the server within this callback via ajax.\n",{"type":21,"tag":209,"props":24921,"children":24922},{"class":211,"line":914},[24923,24927,24932,24936,24941,24946],{"type":21,"tag":209,"props":24924,"children":24925},{"style":216},[24926],{"type":26,"value":5925},{"type":21,"tag":209,"props":24928,"children":24929},{"style":222},[24930],{"type":26,"value":24931}," details ",{"type":21,"tag":209,"props":24933,"children":24934},{"style":216},[24935],{"type":26,"value":1432},{"type":21,"tag":209,"props":24937,"children":24938},{"style":222},[24939],{"type":26,"value":24940}," {otherDetails:{",{"type":21,"tag":209,"props":24942,"children":24943},{"style":448},[24944],{"type":26,"value":24945},"/* object containing any other info we want to send up */",{"type":21,"tag":209,"props":24947,"children":24948},{"style":222},[24949],{"type":26,"value":24950},", payment:recv};\n",{"type":21,"tag":209,"props":24952,"children":24953},{"class":211,"line":922},[24954],{"type":21,"tag":209,"props":24955,"children":24956},{"emptyLinePlaceholder":248},[24957],{"type":26,"value":251},{"type":21,"tag":209,"props":24959,"children":24960},{"class":211,"line":2312},[24961,24965,24969],{"type":21,"tag":209,"props":24962,"children":24963},{"style":222},[24964],{"type":26,"value":24152},{"type":21,"tag":209,"props":24966,"children":24967},{"style":360},[24968],{"type":26,"value":17978},{"type":21,"tag":209,"props":24970,"children":24971},{"style":222},[24972],{"type":26,"value":17983},{"type":21,"tag":209,"props":24974,"children":24975},{"class":211,"line":2321},[24976,24980,24985],{"type":21,"tag":209,"props":24977,"children":24978},{"style":222},[24979],{"type":26,"value":24201},{"type":21,"tag":209,"props":24981,"children":24982},{"style":233},[24983],{"type":26,"value":24984},"'/payment/process/'",{"type":21,"tag":209,"props":24986,"children":24987},{"style":222},[24988],{"type":26,"value":304},{"type":21,"tag":209,"props":24990,"children":24991},{"class":211,"line":2372},[24992,24996,25001],{"type":21,"tag":209,"props":24993,"children":24994},{"style":222},[24995],{"type":26,"value":24168},{"type":21,"tag":209,"props":24997,"children":24998},{"style":233},[24999],{"type":26,"value":25000},"'POST'",{"type":21,"tag":209,"props":25002,"children":25003},{"style":222},[25004],{"type":26,"value":304},{"type":21,"tag":209,"props":25006,"children":25007},{"class":211,"line":2381},[25008,25012,25016],{"type":21,"tag":209,"props":25009,"children":25010},{"style":222},[25011],{"type":26,"value":24184},{"type":21,"tag":209,"props":25013,"children":25014},{"style":233},[25015],{"type":26,"value":24189},{"type":21,"tag":209,"props":25017,"children":25018},{"style":222},[25019],{"type":26,"value":304},{"type":21,"tag":209,"props":25021,"children":25022},{"class":211,"line":2389},[25023,25028,25033],{"type":21,"tag":209,"props":25024,"children":25025},{"style":222},[25026],{"type":26,"value":25027},"            contentType:",{"type":21,"tag":209,"props":25029,"children":25030},{"style":233},[25031],{"type":26,"value":25032},"'application/json'",{"type":21,"tag":209,"props":25034,"children":25035},{"style":222},[25036],{"type":26,"value":304},{"type":21,"tag":209,"props":25038,"children":25039},{"class":211,"line":2397},[25040,25045,25050,25054,25059],{"type":21,"tag":209,"props":25041,"children":25042},{"style":222},[25043],{"type":26,"value":25044},"            data:",{"type":21,"tag":209,"props":25046,"children":25047},{"style":263},[25048],{"type":26,"value":25049},"JSON",{"type":21,"tag":209,"props":25051,"children":25052},{"style":222},[25053],{"type":26,"value":378},{"type":21,"tag":209,"props":25055,"children":25056},{"style":360},[25057],{"type":26,"value":25058},"stringify",{"type":21,"tag":209,"props":25060,"children":25061},{"style":222},[25062],{"type":26,"value":25063},"(details)\n",{"type":21,"tag":209,"props":25065,"children":25066},{"class":211,"line":2406},[25067,25071,25075,25079,25083,25087,25091],{"type":21,"tag":209,"props":25068,"children":25069},{"style":222},[25070],{"type":26,"value":11670},{"type":21,"tag":209,"props":25072,"children":25073},{"style":360},[25074],{"type":26,"value":18042},{"type":21,"tag":209,"props":25076,"children":25077},{"style":222},[25078],{"type":26,"value":368},{"type":21,"tag":209,"props":25080,"children":25081},{"style":216},[25082],{"type":26,"value":5370},{"type":21,"tag":209,"props":25084,"children":25085},{"style":222},[25086],{"type":26,"value":368},{"type":21,"tag":209,"props":25088,"children":25089},{"style":400},[25090],{"type":26,"value":1385},{"type":21,"tag":209,"props":25092,"children":25093},{"style":222},[25094],{"type":26,"value":2369},{"type":21,"tag":209,"props":25096,"children":25097},{"class":211,"line":2415},[25098],{"type":21,"tag":209,"props":25099,"children":25100},{"style":448},[25101],{"type":26,"value":25102},"            // Do something with the response from your server.\n",{"type":21,"tag":209,"props":25104,"children":25105},{"class":211,"line":2424},[25106,25110,25114,25118,25122,25126,25130,25134,25138,25142,25146],{"type":21,"tag":209,"props":25107,"children":25108},{"style":222},[25109],{"type":26,"value":24336},{"type":21,"tag":209,"props":25111,"children":25112},{"style":360},[25113],{"type":26,"value":17387},{"type":21,"tag":209,"props":25115,"children":25116},{"style":222},[25117],{"type":26,"value":368},{"type":21,"tag":209,"props":25119,"children":25120},{"style":263},[25121],{"type":26,"value":2508},{"type":21,"tag":209,"props":25123,"children":25124},{"style":222},[25125],{"type":26,"value":24353},{"type":21,"tag":209,"props":25127,"children":25128},{"style":360},[25129],{"type":26,"value":18091},{"type":21,"tag":209,"props":25131,"children":25132},{"style":222},[25133],{"type":26,"value":368},{"type":21,"tag":209,"props":25135,"children":25136},{"style":216},[25137],{"type":26,"value":5370},{"type":21,"tag":209,"props":25139,"children":25140},{"style":222},[25141],{"type":26,"value":368},{"type":21,"tag":209,"props":25143,"children":25144},{"style":400},[25145],{"type":26,"value":18108},{"type":21,"tag":209,"props":25147,"children":25148},{"style":222},[25149],{"type":26,"value":2369},{"type":21,"tag":209,"props":25151,"children":25152},{"class":211,"line":2433},[25153,25157,25162,25166,25171,25175],{"type":21,"tag":209,"props":25154,"children":25155},{"style":216},[25156],{"type":26,"value":5959},{"type":21,"tag":209,"props":25158,"children":25159},{"style":222},[25160],{"type":26,"value":25161}," res ",{"type":21,"tag":209,"props":25163,"children":25164},{"style":216},[25165],{"type":26,"value":1432},{"type":21,"tag":209,"props":25167,"children":25168},{"style":222},[25169],{"type":26,"value":25170}," jqXHR.responseJSON ",{"type":21,"tag":209,"props":25172,"children":25173},{"style":216},[25174],{"type":26,"value":4677},{"type":21,"tag":209,"props":25176,"children":25177},{"style":222},[25178],{"type":26,"value":25179}," jqXHR.responseText;\n",{"type":21,"tag":209,"props":25181,"children":25182},{"class":211,"line":2442},[25183,25187,25191],{"type":21,"tag":209,"props":25184,"children":25185},{"style":222},[25186],{"type":26,"value":2495},{"type":21,"tag":209,"props":25188,"children":25189},{"style":360},[25190],{"type":26,"value":1059},{"type":21,"tag":209,"props":25192,"children":25193},{"style":222},[25194],{"type":26,"value":25195},"(res);\n",{"type":21,"tag":209,"props":25197,"children":25198},{"class":211,"line":2471},[25199],{"type":21,"tag":209,"props":25200,"children":25201},{"style":222},[25202],{"type":26,"value":2235},{"type":21,"tag":209,"props":25204,"children":25205},{"class":211,"line":2480},[25206],{"type":21,"tag":209,"props":25207,"children":25208},{"style":222},[25209],{"type":26,"value":331},{"type":21,"tag":209,"props":25211,"children":25212},{"class":211,"line":2489},[25213],{"type":21,"tag":209,"props":25214,"children":25215},{"emptyLinePlaceholder":248},[25216],{"type":26,"value":251},{"type":21,"tag":209,"props":25218,"children":25219},{"class":211,"line":2516},[25220],{"type":21,"tag":209,"props":25221,"children":25222},{"style":448},[25223],{"type":26,"value":4697},{"type":21,"tag":209,"props":25225,"children":25226},{"class":211,"line":2525},[25227],{"type":21,"tag":209,"props":25228,"children":25229},{"style":448},[25230],{"type":26,"value":25231},"     * On payment method error, this callback will receive a detail object, as noted in the setup options\n",{"type":21,"tag":209,"props":25233,"children":25234},{"class":211,"line":2533},[25235],{"type":21,"tag":209,"props":25236,"children":25237},{"style":448},[25238],{"type":26,"value":25239},"     * documentation, which gives us some idea as to what error occurred, allowing us to choose how to \n",{"type":21,"tag":209,"props":25241,"children":25242},{"class":211,"line":2542},[25243],{"type":21,"tag":209,"props":25244,"children":25245},{"style":448},[25246],{"type":26,"value":25247},"     * respond to it or inform the client about it.\n",{"type":21,"tag":209,"props":25249,"children":25250},{"class":211,"line":2550},[25251,25255,25259,25263],{"type":21,"tag":209,"props":25252,"children":25253},{"style":448},[25254],{"type":26,"value":4713},{"type":21,"tag":209,"props":25256,"children":25257},{"style":216},[25258],{"type":26,"value":4718},{"type":21,"tag":209,"props":25260,"children":25261},{"style":360},[25262],{"type":26,"value":24697},{"type":21,"tag":209,"props":25264,"children":25265},{"style":222},[25266],{"type":26,"value":25267}," detail\n",{"type":21,"tag":209,"props":25269,"children":25270},{"class":211,"line":2564},[25271],{"type":21,"tag":209,"props":25272,"children":25273},{"style":448},[25274],{"type":26,"value":4753},{"type":21,"tag":209,"props":25276,"children":25277},{"class":211,"line":2611},[25278,25283,25287,25291,25296],{"type":21,"tag":209,"props":25279,"children":25280},{"style":222},[25281],{"type":26,"value":25282},"    paymentMethodError:",{"type":21,"tag":209,"props":25284,"children":25285},{"style":216},[25286],{"type":26,"value":5370},{"type":21,"tag":209,"props":25288,"children":25289},{"style":222},[25290],{"type":26,"value":368},{"type":21,"tag":209,"props":25292,"children":25293},{"style":400},[25294],{"type":26,"value":25295},"detail",{"type":21,"tag":209,"props":25297,"children":25298},{"style":222},[25299],{"type":26,"value":2369},{"type":21,"tag":209,"props":25301,"children":25302},{"class":211,"line":2619},[25303,25307,25311],{"type":21,"tag":209,"props":25304,"children":25305},{"style":222},[25306],{"type":26,"value":3374},{"type":21,"tag":209,"props":25308,"children":25309},{"style":360},[25310],{"type":26,"value":1059},{"type":21,"tag":209,"props":25312,"children":25313},{"style":222},[25314],{"type":26,"value":25315},"(detail);\n",{"type":21,"tag":209,"props":25317,"children":25318},{"class":211,"line":2627},[25319],{"type":21,"tag":209,"props":25320,"children":25321},{"emptyLinePlaceholder":248},[25322],{"type":26,"value":251},{"type":21,"tag":209,"props":25324,"children":25325},{"class":211,"line":2636},[25326,25330,25335,25339,25344],{"type":21,"tag":209,"props":25327,"children":25328},{"style":216},[25329],{"type":26,"value":5803},{"type":21,"tag":209,"props":25331,"children":25332},{"style":222},[25333],{"type":26,"value":25334}," (detail.type ",{"type":21,"tag":209,"props":25336,"children":25337},{"style":216},[25338],{"type":26,"value":12908},{"type":21,"tag":209,"props":25340,"children":25341},{"style":233},[25342],{"type":26,"value":25343}," \"VALIDATION\"",{"type":21,"tag":209,"props":25345,"children":25346},{"style":222},[25347],{"type":26,"value":2369},{"type":21,"tag":209,"props":25349,"children":25350},{"class":211,"line":2644},[25351],{"type":21,"tag":209,"props":25352,"children":25353},{"style":448},[25354],{"type":26,"value":25355},"            // Potentially display a notification to your user that validation failed.\n",{"type":21,"tag":209,"props":25357,"children":25358},{"class":211,"line":2657},[25359,25363],{"type":21,"tag":209,"props":25360,"children":25361},{"style":216},[25362],{"type":26,"value":5101},{"type":21,"tag":209,"props":25364,"children":25365},{"style":222},[25366],{"type":26,"value":241},{"type":21,"tag":209,"props":25368,"children":25369},{"class":211,"line":2728},[25370],{"type":21,"tag":209,"props":25371,"children":25372},{"style":222},[25373],{"type":26,"value":2235},{"type":21,"tag":209,"props":25375,"children":25376},{"class":211,"line":2758},[25377],{"type":21,"tag":209,"props":25378,"children":25379},{"emptyLinePlaceholder":248},[25380],{"type":26,"value":251},{"type":21,"tag":209,"props":25382,"children":25383},{"class":211,"line":2776},[25384],{"type":21,"tag":209,"props":25385,"children":25386},{"style":448},[25387],{"type":26,"value":25388},"        // Potentially display or log that another type of error occurred.\n",{"type":21,"tag":209,"props":25390,"children":25391},{"class":211,"line":2785},[25392],{"type":21,"tag":209,"props":25393,"children":25394},{"style":222},[25395],{"type":26,"value":331},{"type":21,"tag":3549,"props":25397,"children":25399},{"id":25398},"perform-transaction",[25400],{"type":26,"value":25401},"Perform Transaction",{"type":21,"tag":22,"props":25403,"children":25404},{},[25405,25407,25413],{"type":26,"value":25406},"You'll notice that we specified an endpoint of ",{"type":21,"tag":63,"props":25408,"children":25410},{"className":25409},[],[25411],{"type":26,"value":25412},"/payment/process/",{"type":26,"value":25414}," in the paymentMethodReceived callback on the client-side. So, on the server side, let's define this endpoint and finally process our payment.",{"type":21,"tag":200,"props":25416,"children":25418},{"className":9840,"code":25417,"language":9842,"meta":8,"style":8},"import braintree\nimport json\n\nfrom django.views.decorators.http import require_http_methods\nfrom django.http import JsonResponse\n\n#from yourapp.models import SaleItem, TransactionRecord\n\n@require_http_methods(['POST'])\ndef perform_braintree_simple_sale(request):\n    \"\"\"\n    Perform one-time, immediate settlement sale transaction using\n    the payment nonce sent to us by the client.\n    On failure, return the failure details to the client.\n    \"\"\"\n    try:\n        details = json.loads(request.body)\n    except ValueError:\n        # Handle the error case where you fail to parse the request body\n        return JsonResponse(status=400)\n\n    payment_details = details['payment']\n\n    # Note that we get the value of the transaction from a database row - generally speaking,\n    # it's a bad idea to trust the client to define the transaction amount - otherwise, the client\n    # may alter the request to say, have themselves charged $1 for something you want to charge $100\n    # for, and if you don't validate this, you're out $99. Allowing the client to specify what 'item' \n    # they'd like to purchase is safer, however, as long as the server remains in control of setting and\n    # confirming the price.\n    item = SaleItem.objects.get(type=\"your-sale-item\")\n    sale = {\n        \"amount\": str(item.amount),\n        \"payment_method_nonce\": payment_details['nonce'],\n        \"descriptor\": {\"name\": \"BIZ*NAME\"},\n        \"options\": {\n            \"paypal\": {\"description\": \"BizName (bizname.foo)\"},\n            # Note that setting this to true indicates we want both authorization and immediate settlement of this charge\n            \"submit_for_settlement\": True \n        }\n    }\n\n    # Perform transaction, making the remote request to braintree\n    payment_result = braintree.Transaction.sale(sale)\n\n    if payment_result.is_success is not True:\n        if not hasattr(payment_result, 'transation'):\n            \"\"\"\n            If the transaction was not successfully processed by braintree,\n            the list of possible errors is staggeringly long:\n            @see https://developers.braintreepayments.com/reference/general/validation-errors/all/python#transaction\n            You'll likely want to iterate through the deep_errors list and handle them appropriately.\n            \"\"\"\n            return JsonResponse(status=500)\n        else:\n            \"\"\"\n            If the transacation was successfully processed by braintree, but was rejected by\n            the payment processor, you'll want to handle this rejection appropriately.\n            @see https://developers.braintreepayments.com/reference/general/processor-responses/settlement-responses\n            \"\"\"\n            return JsonResponse(status=500)\n\n    transaction = payment_result.transaction\n    if transaction.amount \u003C item.amount:\n        # Confirm you actually were paid as much as your item costs! If you don't submit for settlement,\n        # or only submit for partial settlement, you should skip this check.\n        return JsonResponse(status=500)\n\n    # Transaction successful - you can now proceed to create a new user, produce a download link for an item,\n    # or whatever else it is you need payment processing for.\n    # You can also now create a local reference for the transaction, in case you ever need to look it up for refund\n    # purposes, for example.\n    TransactionRecord.objects.create(item=item, amount=transaction.amount,\n                                     transaction_id=transaction.id, type=transaction.payment_instrument_type)\n\n    return JsonResponse(status=200)\n",[25419],{"type":21,"tag":63,"props":25420,"children":25421},{"__ignoreMap":8},[25422,25433,25445,25452,25471,25490,25497,25505,25512,25531,25547,25554,25562,25570,25578,25585,25596,25613,25628,25636,25665,25672,25698,25705,25713,25721,25729,25737,25745,25753,25788,25804,25826,25848,25879,25891,25921,25929,25951,25958,25965,25972,25980,25997,26004,26035,26065,26073,26081,26089,26097,26105,26112,26139,26151,26158,26166,26174,26182,26189,26216,26223,26240,26261,26269,26277,26304,26311,26319,26327,26335,26343,26379,26409,26416],{"type":21,"tag":209,"props":25423,"children":25424},{"class":211,"line":212},[25425,25429],{"type":21,"tag":209,"props":25426,"children":25427},{"style":216},[25428],{"type":26,"value":219},{"type":21,"tag":209,"props":25430,"children":25431},{"style":222},[25432],{"type":26,"value":23418},{"type":21,"tag":209,"props":25434,"children":25435},{"class":211,"line":244},[25436,25440],{"type":21,"tag":209,"props":25437,"children":25438},{"style":216},[25439],{"type":26,"value":219},{"type":21,"tag":209,"props":25441,"children":25442},{"style":222},[25443],{"type":26,"value":25444}," json\n",{"type":21,"tag":209,"props":25446,"children":25447},{"class":211,"line":254},[25448],{"type":21,"tag":209,"props":25449,"children":25450},{"emptyLinePlaceholder":248},[25451],{"type":26,"value":251},{"type":21,"tag":209,"props":25453,"children":25454},{"class":211,"line":279},[25455,25459,25463,25467],{"type":21,"tag":209,"props":25456,"children":25457},{"style":216},[25458],{"type":26,"value":230},{"type":21,"tag":209,"props":25460,"children":25461},{"style":222},[25462],{"type":26,"value":23597},{"type":21,"tag":209,"props":25464,"children":25465},{"style":216},[25466],{"type":26,"value":219},{"type":21,"tag":209,"props":25468,"children":25469},{"style":222},[25470],{"type":26,"value":23606},{"type":21,"tag":209,"props":25472,"children":25473},{"class":211,"line":288},[25474,25478,25482,25486],{"type":21,"tag":209,"props":25475,"children":25476},{"style":216},[25477],{"type":26,"value":230},{"type":21,"tag":209,"props":25479,"children":25480},{"style":222},[25481],{"type":26,"value":20584},{"type":21,"tag":209,"props":25483,"children":25484},{"style":216},[25485],{"type":26,"value":219},{"type":21,"tag":209,"props":25487,"children":25488},{"style":222},[25489],{"type":26,"value":23585},{"type":21,"tag":209,"props":25491,"children":25492},{"class":211,"line":307},[25493],{"type":21,"tag":209,"props":25494,"children":25495},{"emptyLinePlaceholder":248},[25496],{"type":26,"value":251},{"type":21,"tag":209,"props":25498,"children":25499},{"class":211,"line":325},[25500],{"type":21,"tag":209,"props":25501,"children":25502},{"style":448},[25503],{"type":26,"value":25504},"#from yourapp.models import SaleItem, TransactionRecord\n",{"type":21,"tag":209,"props":25506,"children":25507},{"class":211,"line":334},[25508],{"type":21,"tag":209,"props":25509,"children":25510},{"emptyLinePlaceholder":248},[25511],{"type":26,"value":251},{"type":21,"tag":209,"props":25513,"children":25514},{"class":211,"line":343},[25515,25519,25523,25527],{"type":21,"tag":209,"props":25516,"children":25517},{"style":360},[25518],{"type":26,"value":23621},{"type":21,"tag":209,"props":25520,"children":25521},{"style":222},[25522],{"type":26,"value":23626},{"type":21,"tag":209,"props":25524,"children":25525},{"style":233},[25526],{"type":26,"value":25000},{"type":21,"tag":209,"props":25528,"children":25529},{"style":222},[25530],{"type":26,"value":20697},{"type":21,"tag":209,"props":25532,"children":25533},{"class":211,"line":351},[25534,25538,25543],{"type":21,"tag":209,"props":25535,"children":25536},{"style":216},[25537],{"type":26,"value":9882},{"type":21,"tag":209,"props":25539,"children":25540},{"style":360},[25541],{"type":26,"value":25542}," perform_braintree_simple_sale",{"type":21,"tag":209,"props":25544,"children":25545},{"style":222},[25546],{"type":26,"value":23651},{"type":21,"tag":209,"props":25548,"children":25549},{"class":211,"line":444},[25550],{"type":21,"tag":209,"props":25551,"children":25552},{"style":233},[25553],{"type":26,"value":9900},{"type":21,"tag":209,"props":25555,"children":25556},{"class":211,"line":454},[25557],{"type":21,"tag":209,"props":25558,"children":25559},{"style":233},[25560],{"type":26,"value":25561},"    Perform one-time, immediate settlement sale transaction using\n",{"type":21,"tag":209,"props":25563,"children":25564},{"class":211,"line":463},[25565],{"type":21,"tag":209,"props":25566,"children":25567},{"style":233},[25568],{"type":26,"value":25569},"    the payment nonce sent to us by the client.\n",{"type":21,"tag":209,"props":25571,"children":25572},{"class":211,"line":472},[25573],{"type":21,"tag":209,"props":25574,"children":25575},{"style":233},[25576],{"type":26,"value":25577},"    On failure, return the failure details to the client.\n",{"type":21,"tag":209,"props":25579,"children":25580},{"class":211,"line":480},[25581],{"type":21,"tag":209,"props":25582,"children":25583},{"style":233},[25584],{"type":26,"value":9900},{"type":21,"tag":209,"props":25586,"children":25587},{"class":211,"line":489},[25588,25592],{"type":21,"tag":209,"props":25589,"children":25590},{"style":216},[25591],{"type":26,"value":10041},{"type":21,"tag":209,"props":25593,"children":25594},{"style":222},[25595],{"type":26,"value":844},{"type":21,"tag":209,"props":25597,"children":25598},{"class":211,"line":847},[25599,25604,25608],{"type":21,"tag":209,"props":25600,"children":25601},{"style":222},[25602],{"type":26,"value":25603},"        details ",{"type":21,"tag":209,"props":25605,"children":25606},{"style":216},[25607],{"type":26,"value":1432},{"type":21,"tag":209,"props":25609,"children":25610},{"style":222},[25611],{"type":26,"value":25612}," json.loads(request.body)\n",{"type":21,"tag":209,"props":25614,"children":25615},{"class":211,"line":860},[25616,25620,25624],{"type":21,"tag":209,"props":25617,"children":25618},{"style":216},[25619],{"type":26,"value":10120},{"type":21,"tag":209,"props":25621,"children":25622},{"style":263},[25623],{"type":26,"value":23713},{"type":21,"tag":209,"props":25625,"children":25626},{"style":222},[25627],{"type":26,"value":844},{"type":21,"tag":209,"props":25629,"children":25630},{"class":211,"line":877},[25631],{"type":21,"tag":209,"props":25632,"children":25633},{"style":448},[25634],{"type":26,"value":25635},"        # Handle the error case where you fail to parse the request body\n",{"type":21,"tag":209,"props":25637,"children":25638},{"class":211,"line":889},[25639,25643,25648,25652,25656,25661],{"type":21,"tag":209,"props":25640,"children":25641},{"style":216},[25642],{"type":26,"value":3069},{"type":21,"tag":209,"props":25644,"children":25645},{"style":222},[25646],{"type":26,"value":25647}," JsonResponse(",{"type":21,"tag":209,"props":25649,"children":25650},{"style":400},[25651],{"type":26,"value":23750},{"type":21,"tag":209,"props":25653,"children":25654},{"style":216},[25655],{"type":26,"value":1432},{"type":21,"tag":209,"props":25657,"children":25658},{"style":263},[25659],{"type":26,"value":25660},"400",{"type":21,"tag":209,"props":25662,"children":25663},{"style":222},[25664],{"type":26,"value":10112},{"type":21,"tag":209,"props":25666,"children":25667},{"class":211,"line":902},[25668],{"type":21,"tag":209,"props":25669,"children":25670},{"emptyLinePlaceholder":248},[25671],{"type":26,"value":251},{"type":21,"tag":209,"props":25673,"children":25674},{"class":211,"line":914},[25675,25680,25684,25689,25694],{"type":21,"tag":209,"props":25676,"children":25677},{"style":222},[25678],{"type":26,"value":25679},"    payment_details ",{"type":21,"tag":209,"props":25681,"children":25682},{"style":216},[25683],{"type":26,"value":1432},{"type":21,"tag":209,"props":25685,"children":25686},{"style":222},[25687],{"type":26,"value":25688}," details[",{"type":21,"tag":209,"props":25690,"children":25691},{"style":233},[25692],{"type":26,"value":25693},"'payment'",{"type":21,"tag":209,"props":25695,"children":25696},{"style":222},[25697],{"type":26,"value":10292},{"type":21,"tag":209,"props":25699,"children":25700},{"class":211,"line":922},[25701],{"type":21,"tag":209,"props":25702,"children":25703},{"emptyLinePlaceholder":248},[25704],{"type":26,"value":251},{"type":21,"tag":209,"props":25706,"children":25707},{"class":211,"line":2312},[25708],{"type":21,"tag":209,"props":25709,"children":25710},{"style":448},[25711],{"type":26,"value":25712},"    # Note that we get the value of the transaction from a database row - generally speaking,\n",{"type":21,"tag":209,"props":25714,"children":25715},{"class":211,"line":2321},[25716],{"type":21,"tag":209,"props":25717,"children":25718},{"style":448},[25719],{"type":26,"value":25720},"    # it's a bad idea to trust the client to define the transaction amount - otherwise, the client\n",{"type":21,"tag":209,"props":25722,"children":25723},{"class":211,"line":2372},[25724],{"type":21,"tag":209,"props":25725,"children":25726},{"style":448},[25727],{"type":26,"value":25728},"    # may alter the request to say, have themselves charged $1 for something you want to charge $100\n",{"type":21,"tag":209,"props":25730,"children":25731},{"class":211,"line":2381},[25732],{"type":21,"tag":209,"props":25733,"children":25734},{"style":448},[25735],{"type":26,"value":25736},"    # for, and if you don't validate this, you're out $99. Allowing the client to specify what 'item' \n",{"type":21,"tag":209,"props":25738,"children":25739},{"class":211,"line":2389},[25740],{"type":21,"tag":209,"props":25741,"children":25742},{"style":448},[25743],{"type":26,"value":25744},"    # they'd like to purchase is safer, however, as long as the server remains in control of setting and\n",{"type":21,"tag":209,"props":25746,"children":25747},{"class":211,"line":2397},[25748],{"type":21,"tag":209,"props":25749,"children":25750},{"style":448},[25751],{"type":26,"value":25752},"    # confirming the price.\n",{"type":21,"tag":209,"props":25754,"children":25755},{"class":211,"line":2406},[25756,25761,25765,25770,25775,25779,25784],{"type":21,"tag":209,"props":25757,"children":25758},{"style":222},[25759],{"type":26,"value":25760},"    item ",{"type":21,"tag":209,"props":25762,"children":25763},{"style":216},[25764],{"type":26,"value":1432},{"type":21,"tag":209,"props":25766,"children":25767},{"style":222},[25768],{"type":26,"value":25769}," SaleItem.objects.get(",{"type":21,"tag":209,"props":25771,"children":25772},{"style":400},[25773],{"type":26,"value":25774},"type",{"type":21,"tag":209,"props":25776,"children":25777},{"style":216},[25778],{"type":26,"value":1432},{"type":21,"tag":209,"props":25780,"children":25781},{"style":233},[25782],{"type":26,"value":25783},"\"your-sale-item\"",{"type":21,"tag":209,"props":25785,"children":25786},{"style":222},[25787],{"type":26,"value":10112},{"type":21,"tag":209,"props":25789,"children":25790},{"class":211,"line":2415},[25791,25796,25800],{"type":21,"tag":209,"props":25792,"children":25793},{"style":222},[25794],{"type":26,"value":25795},"    sale ",{"type":21,"tag":209,"props":25797,"children":25798},{"style":216},[25799],{"type":26,"value":1432},{"type":21,"tag":209,"props":25801,"children":25802},{"style":222},[25803],{"type":26,"value":276},{"type":21,"tag":209,"props":25805,"children":25806},{"class":211,"line":2424},[25807,25812,25816,25821],{"type":21,"tag":209,"props":25808,"children":25809},{"style":233},[25810],{"type":26,"value":25811},"        \"amount\"",{"type":21,"tag":209,"props":25813,"children":25814},{"style":222},[25815],{"type":26,"value":7427},{"type":21,"tag":209,"props":25817,"children":25818},{"style":263},[25819],{"type":26,"value":25820},"str",{"type":21,"tag":209,"props":25822,"children":25823},{"style":222},[25824],{"type":26,"value":25825},"(item.amount),\n",{"type":21,"tag":209,"props":25827,"children":25828},{"class":211,"line":2433},[25829,25834,25839,25844],{"type":21,"tag":209,"props":25830,"children":25831},{"style":233},[25832],{"type":26,"value":25833},"        \"payment_method_nonce\"",{"type":21,"tag":209,"props":25835,"children":25836},{"style":222},[25837],{"type":26,"value":25838},": payment_details[",{"type":21,"tag":209,"props":25840,"children":25841},{"style":233},[25842],{"type":26,"value":25843},"'nonce'",{"type":21,"tag":209,"props":25845,"children":25846},{"style":222},[25847],{"type":26,"value":10454},{"type":21,"tag":209,"props":25849,"children":25850},{"class":211,"line":2442},[25851,25856,25861,25866,25870,25875],{"type":21,"tag":209,"props":25852,"children":25853},{"style":233},[25854],{"type":26,"value":25855},"        \"descriptor\"",{"type":21,"tag":209,"props":25857,"children":25858},{"style":222},[25859],{"type":26,"value":25860},": {",{"type":21,"tag":209,"props":25862,"children":25863},{"style":233},[25864],{"type":26,"value":25865},"\"name\"",{"type":21,"tag":209,"props":25867,"children":25868},{"style":222},[25869],{"type":26,"value":7427},{"type":21,"tag":209,"props":25871,"children":25872},{"style":233},[25873],{"type":26,"value":25874},"\"BIZ*NAME\"",{"type":21,"tag":209,"props":25876,"children":25877},{"style":222},[25878],{"type":26,"value":20247},{"type":21,"tag":209,"props":25880,"children":25881},{"class":211,"line":2471},[25882,25887],{"type":21,"tag":209,"props":25883,"children":25884},{"style":233},[25885],{"type":26,"value":25886},"        \"options\"",{"type":21,"tag":209,"props":25888,"children":25889},{"style":222},[25890],{"type":26,"value":19989},{"type":21,"tag":209,"props":25892,"children":25893},{"class":211,"line":2480},[25894,25899,25903,25908,25912,25917],{"type":21,"tag":209,"props":25895,"children":25896},{"style":233},[25897],{"type":26,"value":25898},"            \"paypal\"",{"type":21,"tag":209,"props":25900,"children":25901},{"style":222},[25902],{"type":26,"value":25860},{"type":21,"tag":209,"props":25904,"children":25905},{"style":233},[25906],{"type":26,"value":25907},"\"description\"",{"type":21,"tag":209,"props":25909,"children":25910},{"style":222},[25911],{"type":26,"value":7427},{"type":21,"tag":209,"props":25913,"children":25914},{"style":233},[25915],{"type":26,"value":25916},"\"BizName (bizname.foo)\"",{"type":21,"tag":209,"props":25918,"children":25919},{"style":222},[25920],{"type":26,"value":20247},{"type":21,"tag":209,"props":25922,"children":25923},{"class":211,"line":2489},[25924],{"type":21,"tag":209,"props":25925,"children":25926},{"style":448},[25927],{"type":26,"value":25928},"            # Note that setting this to true indicates we want both authorization and immediate settlement of this charge\n",{"type":21,"tag":209,"props":25930,"children":25931},{"class":211,"line":2516},[25932,25937,25941,25946],{"type":21,"tag":209,"props":25933,"children":25934},{"style":233},[25935],{"type":26,"value":25936},"            \"submit_for_settlement\"",{"type":21,"tag":209,"props":25938,"children":25939},{"style":222},[25940],{"type":26,"value":7427},{"type":21,"tag":209,"props":25942,"children":25943},{"style":263},[25944],{"type":26,"value":25945},"True",{"type":21,"tag":209,"props":25947,"children":25948},{"style":222},[25949],{"type":26,"value":25950}," \n",{"type":21,"tag":209,"props":25952,"children":25953},{"class":211,"line":2525},[25954],{"type":21,"tag":209,"props":25955,"children":25956},{"style":222},[25957],{"type":26,"value":2235},{"type":21,"tag":209,"props":25959,"children":25960},{"class":211,"line":2533},[25961],{"type":21,"tag":209,"props":25962,"children":25963},{"style":222},[25964],{"type":26,"value":331},{"type":21,"tag":209,"props":25966,"children":25967},{"class":211,"line":2542},[25968],{"type":21,"tag":209,"props":25969,"children":25970},{"emptyLinePlaceholder":248},[25971],{"type":26,"value":251},{"type":21,"tag":209,"props":25973,"children":25974},{"class":211,"line":2550},[25975],{"type":21,"tag":209,"props":25976,"children":25977},{"style":448},[25978],{"type":26,"value":25979},"    # Perform transaction, making the remote request to braintree\n",{"type":21,"tag":209,"props":25981,"children":25982},{"class":211,"line":2564},[25983,25988,25992],{"type":21,"tag":209,"props":25984,"children":25985},{"style":222},[25986],{"type":26,"value":25987},"    payment_result ",{"type":21,"tag":209,"props":25989,"children":25990},{"style":216},[25991],{"type":26,"value":1432},{"type":21,"tag":209,"props":25993,"children":25994},{"style":222},[25995],{"type":26,"value":25996}," braintree.Transaction.sale(sale)\n",{"type":21,"tag":209,"props":25998,"children":25999},{"class":211,"line":2611},[26000],{"type":21,"tag":209,"props":26001,"children":26002},{"emptyLinePlaceholder":248},[26003],{"type":26,"value":251},{"type":21,"tag":209,"props":26005,"children":26006},{"class":211,"line":2619},[26007,26011,26016,26021,26026,26031],{"type":21,"tag":209,"props":26008,"children":26009},{"style":216},[26010],{"type":26,"value":10853},{"type":21,"tag":209,"props":26012,"children":26013},{"style":222},[26014],{"type":26,"value":26015}," payment_result.is_success ",{"type":21,"tag":209,"props":26017,"children":26018},{"style":216},[26019],{"type":26,"value":26020},"is",{"type":21,"tag":209,"props":26022,"children":26023},{"style":216},[26024],{"type":26,"value":26025}," not",{"type":21,"tag":209,"props":26027,"children":26028},{"style":263},[26029],{"type":26,"value":26030}," True",{"type":21,"tag":209,"props":26032,"children":26033},{"style":222},[26034],{"type":26,"value":844},{"type":21,"tag":209,"props":26036,"children":26037},{"class":211,"line":2627},[26038,26042,26046,26051,26056,26061],{"type":21,"tag":209,"props":26039,"children":26040},{"style":216},[26041],{"type":26,"value":5803},{"type":21,"tag":209,"props":26043,"children":26044},{"style":216},[26045],{"type":26,"value":26025},{"type":21,"tag":209,"props":26047,"children":26048},{"style":263},[26049],{"type":26,"value":26050}," hasattr",{"type":21,"tag":209,"props":26052,"children":26053},{"style":222},[26054],{"type":26,"value":26055},"(payment_result, ",{"type":21,"tag":209,"props":26057,"children":26058},{"style":233},[26059],{"type":26,"value":26060},"'transation'",{"type":21,"tag":209,"props":26062,"children":26063},{"style":222},[26064],{"type":26,"value":23904},{"type":21,"tag":209,"props":26066,"children":26067},{"class":211,"line":2636},[26068],{"type":21,"tag":209,"props":26069,"children":26070},{"style":233},[26071],{"type":26,"value":26072},"            \"\"\"\n",{"type":21,"tag":209,"props":26074,"children":26075},{"class":211,"line":2644},[26076],{"type":21,"tag":209,"props":26077,"children":26078},{"style":233},[26079],{"type":26,"value":26080},"            If the transaction was not successfully processed by braintree,\n",{"type":21,"tag":209,"props":26082,"children":26083},{"class":211,"line":2657},[26084],{"type":21,"tag":209,"props":26085,"children":26086},{"style":233},[26087],{"type":26,"value":26088},"            the list of possible errors is staggeringly long:\n",{"type":21,"tag":209,"props":26090,"children":26091},{"class":211,"line":2728},[26092],{"type":21,"tag":209,"props":26093,"children":26094},{"style":233},[26095],{"type":26,"value":26096},"            @see https://developers.braintreepayments.com/reference/general/validation-errors/all/python#transaction\n",{"type":21,"tag":209,"props":26098,"children":26099},{"class":211,"line":2758},[26100],{"type":21,"tag":209,"props":26101,"children":26102},{"style":233},[26103],{"type":26,"value":26104},"            You'll likely want to iterate through the deep_errors list and handle them appropriately.\n",{"type":21,"tag":209,"props":26106,"children":26107},{"class":211,"line":2776},[26108],{"type":21,"tag":209,"props":26109,"children":26110},{"style":233},[26111],{"type":26,"value":26072},{"type":21,"tag":209,"props":26113,"children":26114},{"class":211,"line":2785},[26115,26119,26123,26127,26131,26135],{"type":21,"tag":209,"props":26116,"children":26117},{"style":216},[26118],{"type":26,"value":5101},{"type":21,"tag":209,"props":26120,"children":26121},{"style":222},[26122],{"type":26,"value":25647},{"type":21,"tag":209,"props":26124,"children":26125},{"style":400},[26126],{"type":26,"value":23750},{"type":21,"tag":209,"props":26128,"children":26129},{"style":216},[26130],{"type":26,"value":1432},{"type":21,"tag":209,"props":26132,"children":26133},{"style":263},[26134],{"type":26,"value":23759},{"type":21,"tag":209,"props":26136,"children":26137},{"style":222},[26138],{"type":26,"value":10112},{"type":21,"tag":209,"props":26140,"children":26141},{"class":211,"line":2793},[26142,26147],{"type":21,"tag":209,"props":26143,"children":26144},{"style":216},[26145],{"type":26,"value":26146},"        else",{"type":21,"tag":209,"props":26148,"children":26149},{"style":222},[26150],{"type":26,"value":844},{"type":21,"tag":209,"props":26152,"children":26153},{"class":211,"line":2801},[26154],{"type":21,"tag":209,"props":26155,"children":26156},{"style":233},[26157],{"type":26,"value":26072},{"type":21,"tag":209,"props":26159,"children":26160},{"class":211,"line":2809},[26161],{"type":21,"tag":209,"props":26162,"children":26163},{"style":233},[26164],{"type":26,"value":26165},"            If the transacation was successfully processed by braintree, but was rejected by\n",{"type":21,"tag":209,"props":26167,"children":26168},{"class":211,"line":6219},[26169],{"type":21,"tag":209,"props":26170,"children":26171},{"style":233},[26172],{"type":26,"value":26173},"            the payment processor, you'll want to handle this rejection appropriately.\n",{"type":21,"tag":209,"props":26175,"children":26176},{"class":211,"line":6228},[26177],{"type":21,"tag":209,"props":26178,"children":26179},{"style":233},[26180],{"type":26,"value":26181},"            @see https://developers.braintreepayments.com/reference/general/processor-responses/settlement-responses\n",{"type":21,"tag":209,"props":26183,"children":26184},{"class":211,"line":6250},[26185],{"type":21,"tag":209,"props":26186,"children":26187},{"style":233},[26188],{"type":26,"value":26072},{"type":21,"tag":209,"props":26190,"children":26191},{"class":211,"line":6258},[26192,26196,26200,26204,26208,26212],{"type":21,"tag":209,"props":26193,"children":26194},{"style":216},[26195],{"type":26,"value":5101},{"type":21,"tag":209,"props":26197,"children":26198},{"style":222},[26199],{"type":26,"value":25647},{"type":21,"tag":209,"props":26201,"children":26202},{"style":400},[26203],{"type":26,"value":23750},{"type":21,"tag":209,"props":26205,"children":26206},{"style":216},[26207],{"type":26,"value":1432},{"type":21,"tag":209,"props":26209,"children":26210},{"style":263},[26211],{"type":26,"value":23759},{"type":21,"tag":209,"props":26213,"children":26214},{"style":222},[26215],{"type":26,"value":10112},{"type":21,"tag":209,"props":26217,"children":26218},{"class":211,"line":6267},[26219],{"type":21,"tag":209,"props":26220,"children":26221},{"emptyLinePlaceholder":248},[26222],{"type":26,"value":251},{"type":21,"tag":209,"props":26224,"children":26225},{"class":211,"line":6303},[26226,26231,26235],{"type":21,"tag":209,"props":26227,"children":26228},{"style":222},[26229],{"type":26,"value":26230},"    transaction ",{"type":21,"tag":209,"props":26232,"children":26233},{"style":216},[26234],{"type":26,"value":1432},{"type":21,"tag":209,"props":26236,"children":26237},{"style":222},[26238],{"type":26,"value":26239}," payment_result.transaction\n",{"type":21,"tag":209,"props":26241,"children":26242},{"class":211,"line":6336},[26243,26247,26252,26256],{"type":21,"tag":209,"props":26244,"children":26245},{"style":216},[26246],{"type":26,"value":10853},{"type":21,"tag":209,"props":26248,"children":26249},{"style":222},[26250],{"type":26,"value":26251}," transaction.amount ",{"type":21,"tag":209,"props":26253,"children":26254},{"style":216},[26255],{"type":26,"value":1985},{"type":21,"tag":209,"props":26257,"children":26258},{"style":222},[26259],{"type":26,"value":26260}," item.amount:\n",{"type":21,"tag":209,"props":26262,"children":26263},{"class":211,"line":6369},[26264],{"type":21,"tag":209,"props":26265,"children":26266},{"style":448},[26267],{"type":26,"value":26268},"        # Confirm you actually were paid as much as your item costs! If you don't submit for settlement,\n",{"type":21,"tag":209,"props":26270,"children":26271},{"class":211,"line":6378},[26272],{"type":21,"tag":209,"props":26273,"children":26274},{"style":448},[26275],{"type":26,"value":26276},"        # or only submit for partial settlement, you should skip this check.\n",{"type":21,"tag":209,"props":26278,"children":26279},{"class":211,"line":6387},[26280,26284,26288,26292,26296,26300],{"type":21,"tag":209,"props":26281,"children":26282},{"style":216},[26283],{"type":26,"value":3069},{"type":21,"tag":209,"props":26285,"children":26286},{"style":222},[26287],{"type":26,"value":25647},{"type":21,"tag":209,"props":26289,"children":26290},{"style":400},[26291],{"type":26,"value":23750},{"type":21,"tag":209,"props":26293,"children":26294},{"style":216},[26295],{"type":26,"value":1432},{"type":21,"tag":209,"props":26297,"children":26298},{"style":263},[26299],{"type":26,"value":23759},{"type":21,"tag":209,"props":26301,"children":26302},{"style":222},[26303],{"type":26,"value":10112},{"type":21,"tag":209,"props":26305,"children":26306},{"class":211,"line":6395},[26307],{"type":21,"tag":209,"props":26308,"children":26309},{"emptyLinePlaceholder":248},[26310],{"type":26,"value":251},{"type":21,"tag":209,"props":26312,"children":26313},{"class":211,"line":6404},[26314],{"type":21,"tag":209,"props":26315,"children":26316},{"style":448},[26317],{"type":26,"value":26318},"    # Transaction successful - you can now proceed to create a new user, produce a download link for an item,\n",{"type":21,"tag":209,"props":26320,"children":26321},{"class":211,"line":6413},[26322],{"type":21,"tag":209,"props":26323,"children":26324},{"style":448},[26325],{"type":26,"value":26326},"    # or whatever else it is you need payment processing for.\n",{"type":21,"tag":209,"props":26328,"children":26329},{"class":211,"line":6447},[26330],{"type":21,"tag":209,"props":26331,"children":26332},{"style":448},[26333],{"type":26,"value":26334},"    # You can also now create a local reference for the transaction, in case you ever need to look it up for refund\n",{"type":21,"tag":209,"props":26336,"children":26337},{"class":211,"line":6479},[26338],{"type":21,"tag":209,"props":26339,"children":26340},{"style":448},[26341],{"type":26,"value":26342},"    # purposes, for example.\n",{"type":21,"tag":209,"props":26344,"children":26345},{"class":211,"line":6511},[26346,26351,26356,26360,26365,26370,26374],{"type":21,"tag":209,"props":26347,"children":26348},{"style":222},[26349],{"type":26,"value":26350},"    TransactionRecord.objects.create(",{"type":21,"tag":209,"props":26352,"children":26353},{"style":400},[26354],{"type":26,"value":26355},"item",{"type":21,"tag":209,"props":26357,"children":26358},{"style":216},[26359],{"type":26,"value":1432},{"type":21,"tag":209,"props":26361,"children":26362},{"style":222},[26363],{"type":26,"value":26364},"item, ",{"type":21,"tag":209,"props":26366,"children":26367},{"style":400},[26368],{"type":26,"value":26369},"amount",{"type":21,"tag":209,"props":26371,"children":26372},{"style":216},[26373],{"type":26,"value":1432},{"type":21,"tag":209,"props":26375,"children":26376},{"style":222},[26377],{"type":26,"value":26378},"transaction.amount,\n",{"type":21,"tag":209,"props":26380,"children":26381},{"class":211,"line":6519},[26382,26387,26391,26396,26400,26404],{"type":21,"tag":209,"props":26383,"children":26384},{"style":400},[26385],{"type":26,"value":26386},"                                     transaction_id",{"type":21,"tag":209,"props":26388,"children":26389},{"style":216},[26390],{"type":26,"value":1432},{"type":21,"tag":209,"props":26392,"children":26393},{"style":222},[26394],{"type":26,"value":26395},"transaction.id, ",{"type":21,"tag":209,"props":26397,"children":26398},{"style":400},[26399],{"type":26,"value":25774},{"type":21,"tag":209,"props":26401,"children":26402},{"style":216},[26403],{"type":26,"value":1432},{"type":21,"tag":209,"props":26405,"children":26406},{"style":222},[26407],{"type":26,"value":26408},"transaction.payment_instrument_type)\n",{"type":21,"tag":209,"props":26410,"children":26411},{"class":211,"line":6527},[26412],{"type":21,"tag":209,"props":26413,"children":26414},{"emptyLinePlaceholder":248},[26415],{"type":26,"value":251},{"type":21,"tag":209,"props":26417,"children":26418},{"class":211,"line":6535},[26419,26423,26427,26431,26435,26439],{"type":21,"tag":209,"props":26420,"children":26421},{"style":216},[26422],{"type":26,"value":1298},{"type":21,"tag":209,"props":26424,"children":26425},{"style":222},[26426],{"type":26,"value":25647},{"type":21,"tag":209,"props":26428,"children":26429},{"style":400},[26430],{"type":26,"value":23750},{"type":21,"tag":209,"props":26432,"children":26433},{"style":216},[26434],{"type":26,"value":1432},{"type":21,"tag":209,"props":26436,"children":26437},{"style":263},[26438],{"type":26,"value":14764},{"type":21,"tag":209,"props":26440,"children":26441},{"style":222},[26442],{"type":26,"value":10112},{"type":21,"tag":3549,"props":26444,"children":26446},{"id":26445},"some-assembly-required",[26447],{"type":26,"value":26448},"Some Assembly Required",{"type":21,"tag":22,"props":26450,"children":26451},{},[26452],{"type":26,"value":26453},"And there, we're done!",{"type":21,"tag":22,"props":26455,"children":26456},{},[26457,26459,26464],{"type":26,"value":26458},"... for a given value of done. Although we now have something approaching the ",{"type":21,"tag":1084,"props":26460,"children":26461},{},[26462],{"type":26,"value":26463},"bare minimum",{"type":26,"value":26465}," for processing a transaction, what we have doesn't account for recurring subscriptions, storing customer information in the braintree 'vault', sub-merchants, handling refunds, performing authorizations and settling at a future time...",{"type":21,"tag":22,"props":26467,"children":26468},{},[26469,26471,26476],{"type":26,"value":26470},"For more information, I direct you once again to braintree's well-written ",{"type":21,"tag":29,"props":26472,"children":26474},{"href":23257,"rel":26473},[93],[26475],{"type":26,"value":23261},{"type":26,"value":26477},", and I would suggest directing any questions you may have to StackOverflow, where I've noted braintree developers to be fairly quick to respond with assistance.",{"type":21,"tag":22,"props":26479,"children":26480},{},[26481],{"type":26,"value":26482},"At this point, however, you should have the beginnings of a working implementation. Soon, your users will be happily trading in their useless monetary units for the happiness and lasting contentment that only cat pictures can provide. Cheers!",{"type":21,"tag":22,"props":26484,"children":26485},{},[26486],{"type":21,"tag":1084,"props":26487,"children":26488},{},[26489,26491],{"type":26,"value":26490},"Cat image: CC-BY licensed, via ",{"type":21,"tag":29,"props":26492,"children":26495},{"href":26493,"rel":26494},"https://www.flickr.com/photos/53911972@N03/",[93],[26496],{"type":26,"value":26493},{"type":21,"tag":3490,"props":26498,"children":26499},{},[26500],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":26502},[26503,26504,26505,26506,26507],{"id":23341,"depth":244,"text":23344},{"id":24038,"depth":244,"text":24041},{"id":24626,"depth":244,"text":24629},{"id":25398,"depth":244,"text":25401},{"id":26445,"depth":244,"text":26448},"content:ckeefer:2016-2:paymentprocessing.md","ckeefer/2016-2/paymentprocessing.md","ckeefer/2016-2/paymentprocessing",{"user":3518,"name":3519},{"_path":26513,"_dir":26514,"_draft":7,"_partial":7,"_locale":8,"title":26515,"description":26516,"publishDate":26517,"tags":26518,"excerpt":26516,"body":26519,"_type":3511,"_id":32567,"_source":3513,"_file":32568,"_stem":32569,"_extension":3516,"author":32570},"/ckeefer/2016-1/ajaxbinarycaching","2016-1","Caching Binary Data With jQuery Ajax and IndexedDB","After long, grueling months (years? or does it only feel like years?), your web application nears completion. It is tightly coded, well documented, works across all modern browsers, and is well received by your beta testers. It's nearly time to go live, and a smile of pure relief plays upon your lips... and freezes into a rictus grin when your client turns to you, and asks, \"so, hey, can we speed up the dynamic cat pic loading? Especially when I close the browser and come back to it later. I think that's really key to the whole application.\"","2016-04-25",[12,13804],{"type":18,"children":26520,"toc":32560},[26521,26525,26560,26565,26577,26583,26589,26628,26642,26653,26658,26696,26702,26742,26770,26776,26788,26817,26830,29680,29690,29695,29709,32506,32519,32525,32544,32556],{"type":21,"tag":22,"props":26522,"children":26523},{},[26524],{"type":26,"value":26516},{"type":21,"tag":22,"props":26526,"children":26527},{},[26528,26534,26536,26542,26544,26551,26553,26559],{"type":21,"tag":29,"props":26529,"children":26531},{"href":26530},"/search/ajax/upload/user:ckeefer",[26532],{"type":26,"value":26533},"Long, long ago",{"type":26,"value":26535}," we discussed our ",{"type":21,"tag":29,"props":26537,"children":26539},{"href":13912,"rel":26538},[93],[26540],{"type":26,"value":26541},"jQuery plugin",{"type":26,"value":26543}," that will allow you to cache responses of ajax queries in ",{"type":21,"tag":29,"props":26545,"children":26548},{"href":26546,"rel":26547},"https://developer.mozilla.org/en/docs/Web/API/Window/localStorage",[93],[26549],{"type":26,"value":26550},"Local Storage",{"type":26,"value":26552},", so long as they're strings, or something that can be coerced to a string (objects as JSON, numbers). We also previously discussed adding an ajax transport to allow us to handle ",{"type":21,"tag":29,"props":26554,"children":26556},{"href":26555},"/search/user:ckeefer/ajax/blobs",[26557],{"type":26,"value":26558},"sending and receiving binary blobs and array buffers via jQuery ajax",{"type":26,"value":378},{"type":21,"tag":22,"props":26561,"children":26562},{},[26563],{"type":26,"value":26564},"But what if we need to cache binary blobs or arraybuffers? Say, we need those cat pics on the double - we could convert them to and from base64, but not only is that slow, but we're certain to run up against the 5MB limit of local storage in short order. No, what we need is some way to cache binary data in some sort of client-side database...",{"type":21,"tag":22,"props":26566,"children":26567},{},[26568,26575],{"type":21,"tag":29,"props":26569,"children":26572},{"href":26570,"rel":26571},"https://github.com/SaneMethod/jalic",[93],[26573],{"type":26,"value":26574},"Want to get straight to the goods? Here's the link to the Github repo",{"type":26,"value":26576}," - keep reading for the details.",{"type":21,"tag":51,"props":26578,"children":26580},{"id":26579},"picking-the-appropriate-tool-for-the-job",[26581],{"type":26,"value":26582},"Picking the appropriate tool for the job",{"type":21,"tag":17597,"props":26584,"children":26586},{"id":26585},"or-any-tool-really",[26587],{"type":26,"value":26588},"Or any tool, really",{"type":21,"tag":22,"props":26590,"children":26591},{},[26592,26594,26600,26602,26609,26611,26617,26619,26626],{"type":26,"value":26593},"There are a number of candidates that could (or once could have) provided our solution. If we knew exactly what resources would be needed on first visit (and, as an added bonus, wanted at least some part of the web application available offline), we could have used ",{"type":21,"tag":29,"props":26595,"children":26597},{"href":8732,"rel":26596},[93],[26598],{"type":26,"value":26599},"Application Cache",{"type":26,"value":26601},". I say could have, because ",{"type":21,"tag":29,"props":26603,"children":26606},{"href":26604,"rel":26605},"http://caniuse.com/#feat=offline-apps",[93],[26607],{"type":26,"value":26608},"Application Cache is dead",{"type":26,"value":26610}," (long live ",{"type":21,"tag":29,"props":26612,"children":26615},{"href":26613,"rel":26614},"https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers",[93],[26616],{"type":26,"value":9665},{"type":26,"value":26618},"). Its replacement, Service Workers, ",{"type":21,"tag":29,"props":26620,"children":26623},{"href":26621,"rel":26622},"http://caniuse.com/#feat=serviceworkers",[93],[26624],{"type":26,"value":26625},"isn't widely supported yet",{"type":26,"value":26627},", and this doesn't really fit our use case that well anyways.",{"type":21,"tag":22,"props":26629,"children":26630},{},[26631,26633,26640],{"type":26,"value":26632},"Well, what we really need is on-demand file storage. Hey, I remember reading about a ",{"type":21,"tag":29,"props":26634,"children":26637},{"href":26635,"rel":26636},"https://developer.mozilla.org/en-US/docs/Web/API/File_System_API",[93],[26638],{"type":26,"value":26639},"File System API",{"type":26,"value":26641}," once, whatever happened to that?",{"type":21,"tag":22,"props":26643,"children":26644},{},[26645,26652],{"type":21,"tag":29,"props":26646,"children":26649},{"href":26647,"rel":26648},"http://caniuse.com/#feat=filesystem",[93],[26650],{"type":26,"value":26651},"Also dead",{"type":26,"value":378},{"type":21,"tag":22,"props":26654,"children":26655},{},[26656],{"type":26,"value":26657},"Our options are looking a little thinner on the ground, now. But wait! If you're also familiar with the server-side of web development, you're probably thinking (a little guiltily) of the last time you couldn't use the file system but needed to store files. If we can't use the file system - how about the database?",{"type":21,"tag":22,"props":26659,"children":26660},{},[26661,26668,26670,26677,26679,26686,26688,26695],{"type":21,"tag":29,"props":26662,"children":26665},{"href":26663,"rel":26664},"https://developer.mozilla.org/en/docs/Web/API/IndexedDB_API",[93],[26666],{"type":26,"value":26667},"IndexedDB",{"type":26,"value":26669}," to the rescue! (Not WebSQL, that's ",{"type":21,"tag":29,"props":26671,"children":26674},{"href":26672,"rel":26673},"http://caniuse.com/#feat=sql-storage",[93],[26675],{"type":26,"value":26676},"also dead",{"type":26,"value":26678},".) IndexedDB is fairly ",{"type":21,"tag":29,"props":26680,"children":26683},{"href":26681,"rel":26682},"http://caniuse.com/#feat=indexeddb",[93],[26684],{"type":26,"value":26685},"widely-supported by modern browsers",{"type":26,"value":26687},", and we can definitely ",{"type":21,"tag":29,"props":26689,"children":26692},{"href":26690,"rel":26691},"https://msdn.microsoft.com/en-us/library/hh779017%28v=vs.85%29.aspx",[93],[26693],{"type":26,"value":26694},"store binary data in an IndexedDB database",{"type":26,"value":378},{"type":21,"tag":193,"props":26697,"children":26699},{"id":26698},"if-you-pretend-complexity-and-async-operations-arent-there-they-go-away-on-their-own",[26700],{"type":26,"value":26701},"If you pretend complexity and async operations aren't there, they go away on their own",{"type":21,"tag":22,"props":26703,"children":26704},{},[26705,26707,26714,26716,26723,26725,26732,26733,26740],{"type":26,"value":26706},"One issue is that IndexedDB has a reputation for being ",{"type":21,"tag":29,"props":26708,"children":26711},{"href":26709,"rel":26710},"https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB",[93],[26712],{"type":26,"value":26713},"fairly complex",{"type":26,"value":26715},". No worries, some helpful ",{"type":21,"tag":29,"props":26717,"children":26720},{"href":26718,"rel":26719},"https://github.com/SaneMethod",[93],[26721],{"type":26,"value":26722},"open source author",{"type":26,"value":26724}," will help abstract that away for you (see also the excellent ",{"type":21,"tag":29,"props":26726,"children":26729},{"href":26727,"rel":26728},"https://github.com/mozilla/localForage",[93],[26730],{"type":26,"value":26731},"localForage",{"type":26,"value":7274},{"type":21,"tag":29,"props":26734,"children":26737},{"href":26735,"rel":26736},"http://dexie.org/",[93],[26738],{"type":26,"value":26739},"Dexie",{"type":26,"value":26741}," projects if you intend to use IndexedDB for any purpose other than caching ajax requests in your application).",{"type":21,"tag":22,"props":26743,"children":26744},{},[26745,26747,26753,26755,26761,26763,26768],{"type":26,"value":26746},"The other concern for the purpose of our ajax caching is that IndexedDB operates asynchronously (like an XHR - no, I don't want to hear about sync XHR, that's ",{"type":21,"tag":29,"props":26748,"children":26751},{"href":26749,"rel":26750},"https://developers.google.com/web/updates/2012/01/Getting-Rid-of-Synchronous-XHRs?hl=en",[93],[26752],{"type":26,"value":26676},{"type":26,"value":26754},", and good riddance). Our ",{"type":21,"tag":29,"props":26756,"children":26758},{"href":13912,"rel":26757},[93],[26759],{"type":26,"value":26760},"Jalc plugin",{"type":26,"value":26762}," that allows us to cache jquery ajax responses, relies on the ability to specify an ajax transport for a given request - and it needs to respond with a value ",{"type":21,"tag":1084,"props":26764,"children":26765},{},[26766],{"type":26,"value":26767},"synchronously",{"type":26,"value":26769}," if it's going to handle the request instead of simply passing it on to the next transport factory.",{"type":21,"tag":51,"props":26771,"children":26773},{"id":26772},"two-for-the-price-of-one",[26774],{"type":26,"value":26775},"Two for the price of one",{"type":21,"tag":22,"props":26777,"children":26778},{},[26779,26781,26786],{"type":26,"value":26780},"So, what we need to do is store and retrieve a cached value asychronously, but know whether the value ",{"type":21,"tag":1084,"props":26782,"children":26783},{},[26784],{"type":26,"value":26785},"exists",{"type":26,"value":26787}," sychronously. Thus, the solution - use both LocalStorage and IndexedDB. So, we extend our JALC plugin - first, we add the ability to send and receive binary data in the form of blobs and array buffers, and then we set up an indexeddb database for storing our values.",{"type":21,"tag":22,"props":26789,"children":26790},{},[26791,26793,26800,26802,26808,26810,26815],{"type":26,"value":26792},"I'll skip over the code for the binary sending and receiving, since we've mostly seen it before (you can ",{"type":21,"tag":29,"props":26794,"children":26797},{"href":26795,"rel":26796},"https://github.com/SaneMethod/jalic/blob/master/jquery-ajax-binary-patch.js",[93],[26798],{"type":26,"value":26799},"view it in the Github repo",{"type":26,"value":26801},", however). You'll require such a patch, as adding support for binary requests in jQuery is ",{"type":21,"tag":29,"props":26803,"children":26806},{"href":26804,"rel":26805},"https://github.com/jquery/jquery/pull/1525",[93],[26807],{"type":26,"value":26676},{"type":26,"value":26809},", and $.xhr and the ",{"type":21,"tag":29,"props":26811,"children":26813},{"href":17575,"rel":26812},[93],[26814],{"type":26,"value":5199},{"type":26,"value":26816}," isn't ready for prime-time yet.",{"type":21,"tag":22,"props":26818,"children":26819},{},[26820,26822,26829],{"type":26,"value":26821},"Let's take a quick walk through what we're doing to support IndexedDB, however (",{"type":21,"tag":29,"props":26823,"children":26826},{"href":26824,"rel":26825},"https://github.com/SaneMethod/jalic/blob/master/indexeddb-setup.js",[93],[26827],{"type":26,"value":26828},"see the up-to-date version on Github",{"type":26,"value":2699},{"type":21,"tag":200,"props":26831,"children":26833},{"className":9044,"code":26832,"language":9046,"meta":8,"style":8},"(function($, window){\n    var idb = window.indexedDB,\n        dbReady = $.Deferred(),\n        db;\n\n    /**\n     * At this point, we'll only support unprefixed, non-experimental versions of IndexedDB, to simplify our\n     * lives - there are a number of differences we would need to account for if we were to attempt to support\n     * early attempts at IndexedDB implementations, some of which you can read about in the excellent MDN\n     * documentation at\n     * https://developer.mozilla.org/en/docs/Web/API/IndexedDB_API and\n     * https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API/Using_IndexedDB.\n     */\n    if (!window.indexedDB) throw new Error(\"Expecting unprefixed IndexedDB support on window object.\");\n\n    /**\n     * Create the 'jalic' IndexedDB db.\n     * For now, we handle errors merely by logging them and rejecting the associated Deferred object with the\n     * error event. This should be replaced by something more robust in the future...\n     *\n     * @param idb\n     * @returns {*}\n     */\n    function createDatabase(idb){\n        var dbreq = idb.open(\"jalic\", 1);\n\n        /**\n         * Something went wrong when opening our db. This could range from the user refusing the\n         * request to allow this site to store data, to the current version of the db being higher\n         * than the one we requested, to storage issues or lacking implementation.\n         * @param event\n         */\n        dbreq.onerror = function(event){\n            console.log(event);\n            dbReady.reject(event);\n        };\n\n        /**\n         * The on upgrade needed event is called whenever we're opening a database with a version number\n         * higher than the currently existing version number, which includes when the database doesn't\n         * currently exist. Within this function we define the structure of the db.\n         * @param event\n         */\n        dbreq.onupgradeneeded = function(event){\n            var objectStore;\n\n            db = event.target.result;\n            db.onerror = function(event){\n                console.log(event);\n            };\n\n            objectStore = db.createObjectStore(\"jalicData\", {keyPath:\"jdName\"});\n            objectStore.createIndex(\"storedAt\", \"storedAt\", {unique:false});\n\n            objectStore.transaction.oncomplete = function(event){\n                dbReady.resolve();\n            };\n        };\n\n        /**\n         * DB was opened successfully, with no upgrade needed.\n         * @param event\n         */\n        dbreq.onsuccess = function(event){\n            db = event.target.result;\n            dbReady.resolve();\n        };\n\n        return dbReady.promise();\n    }\n\n    createDatabase(idb);\n\n    /**\n     * Define a simple interface mimicking the Storage interface on the jQuery object, with the major difference being\n     * everything executes asynchronously, and returns a $.Deferred object to account for that.\n     */\n    $.jidb = {\n        /**\n         * Set an item within the jalicData objectStore, using the given jdName and data, with optionally\n         * a dataType parameter to store alongside the data. If dataType is not provided, it is the result of\n         * typeof data.\n         * Notice that we 'put' data, rather than add it - that means we will always overwrite data with an\n         * identical key (jdName), if it already exists.\n         * @param jdName\n         * @param data\n         * @param dataType\n         * @returns {$.Deferred} Returns a jQuery Deferred object, which resolves with an empty body on success,\n         * or else resolves with the transaction or request error on failure.\n         */\n        setItem:function(jdName, data, dataType){\n            var defer = $.Deferred(),\n                transaction = db.transaction([\"jalicData\"], \"readwrite\"),\n                objectStore = transaction.objectStore(\"jalicData\"),\n                request;\n\n            dataType = dataType || typeof data;\n\n            transaction.oncomplete = function(){\n                return defer.resolve();\n            };\n\n            transaction.onerror = function(event){\n                console.log(event);\n                return defer.reject(event);\n            };\n\n            request = objectStore.put({jdName:jdName, storedAt:+new Date(), dataType:dataType, data:data});\n\n            request.onerror = function(event){\n                console.log(event);\n                defer.reject(event);\n            };\n\n            return defer.promise();\n        },\n        /**\n         * Retrieve an item from the jalicData objectStore, using the given jdName as the key.\n         * @param jdName\n         * @returns {$.Deferred} Returns a jQuery Deferred object, which resolves with the request result as an object\n         * on success, or else resolves with the transaction or request error on failure.\n         */\n        getItem:function(jdName){\n            var defer = $.Deferred(),\n                transaction = db.transaction([\"jalicData\"], \"readonly\"),\n                objectStore = transaction.objectStore(\"jalicData\"),\n                request = objectStore.get(jdName);\n\n            request.onerror = function(event){\n                console.log(event);\n                defer.reject(event);\n            };\n\n            request.onsuccess = function(event){\n                defer.resolve(request.result);\n            };\n\n            return defer.promise();\n        },\n        /**\n         * Remove an item from the jalicData objectStore, using the given jdName as the key.\n         * @param jdName\n         * @returns {$.Deferred} Returns a jQuery Deferred object, which resolves with an empty body on success,\n         * or else resolves with the transaction or request error on failure.\n         */\n        removeItem:function(jdName){\n            var defer = $.Deferred(),\n                transaction = db.transaction([\"jalicData\"], \"readwrite\"),\n                objectStore = transaction.objectStore(\"jalicData\"),\n                request = objectStore.delete(jdName);\n\n            request.onerror = function(event){\n                console.log(event);\n                defer.reject(event);\n            };\n\n            request.onsuccess = function(){\n                defer.resolve();\n            };\n\n            return defer.promise();\n        },\n        /**\n         * Delete the jalic database and recreate it.\n         * @returns {$.Deferred} Returns a jQuery Deferred object, which resolves with an empty body on success,\n         * or else resolves with the transaction or request error on failure.\n         */\n        clear:function(){\n            var defer = $.Deferred(),\n                request = idb.deleteDatabase(\"jalic\");\n\n            dbReady = $.Deferred();\n\n            request.onerror = function(event){\n                console.log(event);\n                defer.reject(event);\n            };\n\n            request.onsuccess = function(){\n                dbReady.done(function(){\n                    defer.resolve();\n                });\n\n                createDatabase(idb);\n            };\n\n            return defer.promise();\n        }\n    };\n})(jQuery, window);\n",[26834],{"type":21,"tag":63,"props":26835,"children":26836},{"__ignoreMap":8},[26837,26868,26889,26915,26923,26930,26937,26945,26953,26961,26969,26977,26985,26992,27037,27044,27051,27059,27067,27075,27082,27098,27114,27121,27146,27192,27199,27206,27214,27222,27230,27246,27253,27286,27302,27318,27325,27332,27339,27347,27355,27363,27378,27385,27417,27429,27436,27453,27485,27500,27507,27514,27559,27603,27610,27643,27659,27666,27673,27680,27687,27695,27710,27717,27749,27764,27779,27786,27793,27814,27821,27828,27841,27848,27855,27863,27871,27878,27894,27901,27909,27917,27925,27933,27941,27957,27973,27988,28009,28017,28024,28069,28097,28140,28174,28182,28189,28217,28224,28248,28268,28275,28282,28313,28328,28347,28354,28361,28401,28408,28440,28455,28471,28478,28485,28504,28511,28518,28526,28541,28561,28569,28576,28604,28631,28671,28702,28727,28734,28765,28780,28795,28802,28809,28840,28856,28863,28870,28889,28896,28903,28911,28926,28945,28952,28959,28987,29014,29053,29084,29107,29114,29145,29160,29175,29182,29189,29212,29227,29234,29241,29260,29268,29276,29285,29305,29313,29321,29342,29370,29403,29411,29436,29444,29476,29492,29508,29516,29524,29548,29572,29589,29598,29606,29619,29627,29635,29655,29663,29671],{"type":21,"tag":209,"props":26838,"children":26839},{"class":211,"line":212},[26840,26844,26848,26852,26856,26860,26864],{"type":21,"tag":209,"props":26841,"children":26842},{"style":222},[26843],{"type":26,"value":368},{"type":21,"tag":209,"props":26845,"children":26846},{"style":216},[26847],{"type":26,"value":5370},{"type":21,"tag":209,"props":26849,"children":26850},{"style":222},[26851],{"type":26,"value":368},{"type":21,"tag":209,"props":26853,"children":26854},{"style":400},[26855],{"type":26,"value":10250},{"type":21,"tag":209,"props":26857,"children":26858},{"style":222},[26859],{"type":26,"value":408},{"type":21,"tag":209,"props":26861,"children":26862},{"style":400},[26863],{"type":26,"value":10393},{"type":21,"tag":209,"props":26865,"children":26866},{"style":222},[26867],{"type":26,"value":2369},{"type":21,"tag":209,"props":26869,"children":26870},{"class":211,"line":244},[26871,26875,26880,26884],{"type":21,"tag":209,"props":26872,"children":26873},{"style":216},[26874],{"type":26,"value":10405},{"type":21,"tag":209,"props":26876,"children":26877},{"style":222},[26878],{"type":26,"value":26879}," idb ",{"type":21,"tag":209,"props":26881,"children":26882},{"style":216},[26883],{"type":26,"value":1432},{"type":21,"tag":209,"props":26885,"children":26886},{"style":222},[26887],{"type":26,"value":26888}," window.indexedDB,\n",{"type":21,"tag":209,"props":26890,"children":26891},{"class":211,"line":254},[26892,26897,26901,26906,26911],{"type":21,"tag":209,"props":26893,"children":26894},{"style":222},[26895],{"type":26,"value":26896},"        dbReady ",{"type":21,"tag":209,"props":26898,"children":26899},{"style":216},[26900],{"type":26,"value":1432},{"type":21,"tag":209,"props":26902,"children":26903},{"style":222},[26904],{"type":26,"value":26905}," $.",{"type":21,"tag":209,"props":26907,"children":26908},{"style":360},[26909],{"type":26,"value":26910},"Deferred",{"type":21,"tag":209,"props":26912,"children":26913},{"style":222},[26914],{"type":26,"value":5405},{"type":21,"tag":209,"props":26916,"children":26917},{"class":211,"line":279},[26918],{"type":21,"tag":209,"props":26919,"children":26920},{"style":222},[26921],{"type":26,"value":26922},"        db;\n",{"type":21,"tag":209,"props":26924,"children":26925},{"class":211,"line":288},[26926],{"type":21,"tag":209,"props":26927,"children":26928},{"emptyLinePlaceholder":248},[26929],{"type":26,"value":251},{"type":21,"tag":209,"props":26931,"children":26932},{"class":211,"line":307},[26933],{"type":21,"tag":209,"props":26934,"children":26935},{"style":448},[26936],{"type":26,"value":4697},{"type":21,"tag":209,"props":26938,"children":26939},{"class":211,"line":325},[26940],{"type":21,"tag":209,"props":26941,"children":26942},{"style":448},[26943],{"type":26,"value":26944},"     * At this point, we'll only support unprefixed, non-experimental versions of IndexedDB, to simplify our\n",{"type":21,"tag":209,"props":26946,"children":26947},{"class":211,"line":334},[26948],{"type":21,"tag":209,"props":26949,"children":26950},{"style":448},[26951],{"type":26,"value":26952},"     * lives - there are a number of differences we would need to account for if we were to attempt to support\n",{"type":21,"tag":209,"props":26954,"children":26955},{"class":211,"line":343},[26956],{"type":21,"tag":209,"props":26957,"children":26958},{"style":448},[26959],{"type":26,"value":26960},"     * early attempts at IndexedDB implementations, some of which you can read about in the excellent MDN\n",{"type":21,"tag":209,"props":26962,"children":26963},{"class":211,"line":351},[26964],{"type":21,"tag":209,"props":26965,"children":26966},{"style":448},[26967],{"type":26,"value":26968},"     * documentation at\n",{"type":21,"tag":209,"props":26970,"children":26971},{"class":211,"line":444},[26972],{"type":21,"tag":209,"props":26973,"children":26974},{"style":448},[26975],{"type":26,"value":26976},"     * https://developer.mozilla.org/en/docs/Web/API/IndexedDB_API and\n",{"type":21,"tag":209,"props":26978,"children":26979},{"class":211,"line":454},[26980],{"type":21,"tag":209,"props":26981,"children":26982},{"style":448},[26983],{"type":26,"value":26984},"     * https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API/Using_IndexedDB.\n",{"type":21,"tag":209,"props":26986,"children":26987},{"class":211,"line":463},[26988],{"type":21,"tag":209,"props":26989,"children":26990},{"style":448},[26991],{"type":26,"value":4753},{"type":21,"tag":209,"props":26993,"children":26994},{"class":211,"line":472},[26995,26999,27003,27007,27012,27016,27020,27024,27028,27033],{"type":21,"tag":209,"props":26996,"children":26997},{"style":216},[26998],{"type":26,"value":10853},{"type":21,"tag":209,"props":27000,"children":27001},{"style":222},[27002],{"type":26,"value":4776},{"type":21,"tag":209,"props":27004,"children":27005},{"style":216},[27006],{"type":26,"value":15052},{"type":21,"tag":209,"props":27008,"children":27009},{"style":222},[27010],{"type":26,"value":27011},"window.indexedDB) ",{"type":21,"tag":209,"props":27013,"children":27014},{"style":216},[27015],{"type":26,"value":18743},{"type":21,"tag":209,"props":27017,"children":27018},{"style":216},[27019],{"type":26,"value":4667},{"type":21,"tag":209,"props":27021,"children":27022},{"style":360},[27023],{"type":26,"value":18752},{"type":21,"tag":209,"props":27025,"children":27026},{"style":222},[27027],{"type":26,"value":368},{"type":21,"tag":209,"props":27029,"children":27030},{"style":233},[27031],{"type":26,"value":27032},"\"Expecting unprefixed IndexedDB support on window object.\"",{"type":21,"tag":209,"props":27034,"children":27035},{"style":222},[27036],{"type":26,"value":2608},{"type":21,"tag":209,"props":27038,"children":27039},{"class":211,"line":480},[27040],{"type":21,"tag":209,"props":27041,"children":27042},{"emptyLinePlaceholder":248},[27043],{"type":26,"value":251},{"type":21,"tag":209,"props":27045,"children":27046},{"class":211,"line":489},[27047],{"type":21,"tag":209,"props":27048,"children":27049},{"style":448},[27050],{"type":26,"value":4697},{"type":21,"tag":209,"props":27052,"children":27053},{"class":211,"line":847},[27054],{"type":21,"tag":209,"props":27055,"children":27056},{"style":448},[27057],{"type":26,"value":27058},"     * Create the 'jalic' IndexedDB db.\n",{"type":21,"tag":209,"props":27060,"children":27061},{"class":211,"line":860},[27062],{"type":21,"tag":209,"props":27063,"children":27064},{"style":448},[27065],{"type":26,"value":27066},"     * For now, we handle errors merely by logging them and rejecting the associated Deferred object with the\n",{"type":21,"tag":209,"props":27068,"children":27069},{"class":211,"line":877},[27070],{"type":21,"tag":209,"props":27071,"children":27072},{"style":448},[27073],{"type":26,"value":27074},"     * error event. This should be replaced by something more robust in the future...\n",{"type":21,"tag":209,"props":27076,"children":27077},{"class":211,"line":889},[27078],{"type":21,"tag":209,"props":27079,"children":27080},{"style":448},[27081],{"type":26,"value":15103},{"type":21,"tag":209,"props":27083,"children":27084},{"class":211,"line":902},[27085,27089,27093],{"type":21,"tag":209,"props":27086,"children":27087},{"style":448},[27088],{"type":26,"value":4713},{"type":21,"tag":209,"props":27090,"children":27091},{"style":216},[27092],{"type":26,"value":4718},{"type":21,"tag":209,"props":27094,"children":27095},{"style":222},[27096],{"type":26,"value":27097}," idb\n",{"type":21,"tag":209,"props":27099,"children":27100},{"class":211,"line":914},[27101,27105,27109],{"type":21,"tag":209,"props":27102,"children":27103},{"style":448},[27104],{"type":26,"value":4713},{"type":21,"tag":209,"props":27106,"children":27107},{"style":216},[27108],{"type":26,"value":4740},{"type":21,"tag":209,"props":27110,"children":27111},{"style":360},[27112],{"type":26,"value":27113}," {*}\n",{"type":21,"tag":209,"props":27115,"children":27116},{"class":211,"line":922},[27117],{"type":21,"tag":209,"props":27118,"children":27119},{"style":448},[27120],{"type":26,"value":4753},{"type":21,"tag":209,"props":27122,"children":27123},{"class":211,"line":2312},[27124,27128,27133,27137,27142],{"type":21,"tag":209,"props":27125,"children":27126},{"style":216},[27127],{"type":26,"value":2981},{"type":21,"tag":209,"props":27129,"children":27130},{"style":360},[27131],{"type":26,"value":27132}," createDatabase",{"type":21,"tag":209,"props":27134,"children":27135},{"style":222},[27136],{"type":26,"value":368},{"type":21,"tag":209,"props":27138,"children":27139},{"style":400},[27140],{"type":26,"value":27141},"idb",{"type":21,"tag":209,"props":27143,"children":27144},{"style":222},[27145],{"type":26,"value":2369},{"type":21,"tag":209,"props":27147,"children":27148},{"class":211,"line":2321},[27149,27153,27158,27162,27167,27171,27175,27180,27184,27188],{"type":21,"tag":209,"props":27150,"children":27151},{"style":216},[27152],{"type":26,"value":5925},{"type":21,"tag":209,"props":27154,"children":27155},{"style":222},[27156],{"type":26,"value":27157}," dbreq ",{"type":21,"tag":209,"props":27159,"children":27160},{"style":216},[27161],{"type":26,"value":1432},{"type":21,"tag":209,"props":27163,"children":27164},{"style":222},[27165],{"type":26,"value":27166}," idb.",{"type":21,"tag":209,"props":27168,"children":27169},{"style":360},[27170],{"type":26,"value":11610},{"type":21,"tag":209,"props":27172,"children":27173},{"style":222},[27174],{"type":26,"value":368},{"type":21,"tag":209,"props":27176,"children":27177},{"style":233},[27178],{"type":26,"value":27179},"\"jalic\"",{"type":21,"tag":209,"props":27181,"children":27182},{"style":222},[27183],{"type":26,"value":408},{"type":21,"tag":209,"props":27185,"children":27186},{"style":263},[27187],{"type":26,"value":3224},{"type":21,"tag":209,"props":27189,"children":27190},{"style":222},[27191],{"type":26,"value":2608},{"type":21,"tag":209,"props":27193,"children":27194},{"class":211,"line":2372},[27195],{"type":21,"tag":209,"props":27196,"children":27197},{"emptyLinePlaceholder":248},[27198],{"type":26,"value":251},{"type":21,"tag":209,"props":27200,"children":27201},{"class":211,"line":2381},[27202],{"type":21,"tag":209,"props":27203,"children":27204},{"style":448},[27205],{"type":26,"value":2412},{"type":21,"tag":209,"props":27207,"children":27208},{"class":211,"line":2389},[27209],{"type":21,"tag":209,"props":27210,"children":27211},{"style":448},[27212],{"type":26,"value":27213},"         * Something went wrong when opening our db. This could range from the user refusing the\n",{"type":21,"tag":209,"props":27215,"children":27216},{"class":211,"line":2397},[27217],{"type":21,"tag":209,"props":27218,"children":27219},{"style":448},[27220],{"type":26,"value":27221},"         * request to allow this site to store data, to the current version of the db being higher\n",{"type":21,"tag":209,"props":27223,"children":27224},{"class":211,"line":2406},[27225],{"type":21,"tag":209,"props":27226,"children":27227},{"style":448},[27228],{"type":26,"value":27229},"         * than the one we requested, to storage issues or lacking implementation.\n",{"type":21,"tag":209,"props":27231,"children":27232},{"class":211,"line":2415},[27233,27238,27242],{"type":21,"tag":209,"props":27234,"children":27235},{"style":448},[27236],{"type":26,"value":27237},"         * ",{"type":21,"tag":209,"props":27239,"children":27240},{"style":216},[27241],{"type":26,"value":4718},{"type":21,"tag":209,"props":27243,"children":27244},{"style":222},[27245],{"type":26,"value":10766},{"type":21,"tag":209,"props":27247,"children":27248},{"class":211,"line":2424},[27249],{"type":21,"tag":209,"props":27250,"children":27251},{"style":448},[27252],{"type":26,"value":2439},{"type":21,"tag":209,"props":27254,"children":27255},{"class":211,"line":2433},[27256,27261,27266,27270,27274,27278,27282],{"type":21,"tag":209,"props":27257,"children":27258},{"style":222},[27259],{"type":26,"value":27260},"        dbreq.",{"type":21,"tag":209,"props":27262,"children":27263},{"style":360},[27264],{"type":26,"value":27265},"onerror",{"type":21,"tag":209,"props":27267,"children":27268},{"style":216},[27269],{"type":26,"value":271},{"type":21,"tag":209,"props":27271,"children":27272},{"style":216},[27273],{"type":26,"value":4766},{"type":21,"tag":209,"props":27275,"children":27276},{"style":222},[27277],{"type":26,"value":368},{"type":21,"tag":209,"props":27279,"children":27280},{"style":400},[27281],{"type":26,"value":10794},{"type":21,"tag":209,"props":27283,"children":27284},{"style":222},[27285],{"type":26,"value":2369},{"type":21,"tag":209,"props":27287,"children":27288},{"class":211,"line":2442},[27289,27293,27297],{"type":21,"tag":209,"props":27290,"children":27291},{"style":222},[27292],{"type":26,"value":2495},{"type":21,"tag":209,"props":27294,"children":27295},{"style":360},[27296],{"type":26,"value":1059},{"type":21,"tag":209,"props":27298,"children":27299},{"style":222},[27300],{"type":26,"value":27301},"(event);\n",{"type":21,"tag":209,"props":27303,"children":27304},{"class":211,"line":2471},[27305,27310,27314],{"type":21,"tag":209,"props":27306,"children":27307},{"style":222},[27308],{"type":26,"value":27309},"            dbReady.",{"type":21,"tag":209,"props":27311,"children":27312},{"style":360},[27313],{"type":26,"value":5599},{"type":21,"tag":209,"props":27315,"children":27316},{"style":222},[27317],{"type":26,"value":27301},{"type":21,"tag":209,"props":27319,"children":27320},{"class":211,"line":2480},[27321],{"type":21,"tag":209,"props":27322,"children":27323},{"style":222},[27324],{"type":26,"value":6384},{"type":21,"tag":209,"props":27326,"children":27327},{"class":211,"line":2489},[27328],{"type":21,"tag":209,"props":27329,"children":27330},{"emptyLinePlaceholder":248},[27331],{"type":26,"value":251},{"type":21,"tag":209,"props":27333,"children":27334},{"class":211,"line":2516},[27335],{"type":21,"tag":209,"props":27336,"children":27337},{"style":448},[27338],{"type":26,"value":2412},{"type":21,"tag":209,"props":27340,"children":27341},{"class":211,"line":2525},[27342],{"type":21,"tag":209,"props":27343,"children":27344},{"style":448},[27345],{"type":26,"value":27346},"         * The on upgrade needed event is called whenever we're opening a database with a version number\n",{"type":21,"tag":209,"props":27348,"children":27349},{"class":211,"line":2533},[27350],{"type":21,"tag":209,"props":27351,"children":27352},{"style":448},[27353],{"type":26,"value":27354},"         * higher than the currently existing version number, which includes when the database doesn't\n",{"type":21,"tag":209,"props":27356,"children":27357},{"class":211,"line":2542},[27358],{"type":21,"tag":209,"props":27359,"children":27360},{"style":448},[27361],{"type":26,"value":27362},"         * currently exist. Within this function we define the structure of the db.\n",{"type":21,"tag":209,"props":27364,"children":27365},{"class":211,"line":2550},[27366,27370,27374],{"type":21,"tag":209,"props":27367,"children":27368},{"style":448},[27369],{"type":26,"value":27237},{"type":21,"tag":209,"props":27371,"children":27372},{"style":216},[27373],{"type":26,"value":4718},{"type":21,"tag":209,"props":27375,"children":27376},{"style":222},[27377],{"type":26,"value":10766},{"type":21,"tag":209,"props":27379,"children":27380},{"class":211,"line":2564},[27381],{"type":21,"tag":209,"props":27382,"children":27383},{"style":448},[27384],{"type":26,"value":2439},{"type":21,"tag":209,"props":27386,"children":27387},{"class":211,"line":2611},[27388,27392,27397,27401,27405,27409,27413],{"type":21,"tag":209,"props":27389,"children":27390},{"style":222},[27391],{"type":26,"value":27260},{"type":21,"tag":209,"props":27393,"children":27394},{"style":360},[27395],{"type":26,"value":27396},"onupgradeneeded",{"type":21,"tag":209,"props":27398,"children":27399},{"style":216},[27400],{"type":26,"value":271},{"type":21,"tag":209,"props":27402,"children":27403},{"style":216},[27404],{"type":26,"value":4766},{"type":21,"tag":209,"props":27406,"children":27407},{"style":222},[27408],{"type":26,"value":368},{"type":21,"tag":209,"props":27410,"children":27411},{"style":400},[27412],{"type":26,"value":10794},{"type":21,"tag":209,"props":27414,"children":27415},{"style":222},[27416],{"type":26,"value":2369},{"type":21,"tag":209,"props":27418,"children":27419},{"class":211,"line":2619},[27420,27424],{"type":21,"tag":209,"props":27421,"children":27422},{"style":216},[27423],{"type":26,"value":5959},{"type":21,"tag":209,"props":27425,"children":27426},{"style":222},[27427],{"type":26,"value":27428}," objectStore;\n",{"type":21,"tag":209,"props":27430,"children":27431},{"class":211,"line":2627},[27432],{"type":21,"tag":209,"props":27433,"children":27434},{"emptyLinePlaceholder":248},[27435],{"type":26,"value":251},{"type":21,"tag":209,"props":27437,"children":27438},{"class":211,"line":2636},[27439,27444,27448],{"type":21,"tag":209,"props":27440,"children":27441},{"style":222},[27442],{"type":26,"value":27443},"            db ",{"type":21,"tag":209,"props":27445,"children":27446},{"style":216},[27447],{"type":26,"value":1432},{"type":21,"tag":209,"props":27449,"children":27450},{"style":222},[27451],{"type":26,"value":27452}," event.target.result;\n",{"type":21,"tag":209,"props":27454,"children":27455},{"class":211,"line":2644},[27456,27461,27465,27469,27473,27477,27481],{"type":21,"tag":209,"props":27457,"children":27458},{"style":222},[27459],{"type":26,"value":27460},"            db.",{"type":21,"tag":209,"props":27462,"children":27463},{"style":360},[27464],{"type":26,"value":27265},{"type":21,"tag":209,"props":27466,"children":27467},{"style":216},[27468],{"type":26,"value":271},{"type":21,"tag":209,"props":27470,"children":27471},{"style":216},[27472],{"type":26,"value":4766},{"type":21,"tag":209,"props":27474,"children":27475},{"style":222},[27476],{"type":26,"value":368},{"type":21,"tag":209,"props":27478,"children":27479},{"style":400},[27480],{"type":26,"value":10794},{"type":21,"tag":209,"props":27482,"children":27483},{"style":222},[27484],{"type":26,"value":2369},{"type":21,"tag":209,"props":27486,"children":27487},{"class":211,"line":2657},[27488,27492,27496],{"type":21,"tag":209,"props":27489,"children":27490},{"style":222},[27491],{"type":26,"value":2764},{"type":21,"tag":209,"props":27493,"children":27494},{"style":360},[27495],{"type":26,"value":1059},{"type":21,"tag":209,"props":27497,"children":27498},{"style":222},[27499],{"type":26,"value":27301},{"type":21,"tag":209,"props":27501,"children":27502},{"class":211,"line":2728},[27503],{"type":21,"tag":209,"props":27504,"children":27505},{"style":222},[27506],{"type":26,"value":6375},{"type":21,"tag":209,"props":27508,"children":27509},{"class":211,"line":2758},[27510],{"type":21,"tag":209,"props":27511,"children":27512},{"emptyLinePlaceholder":248},[27513],{"type":26,"value":251},{"type":21,"tag":209,"props":27515,"children":27516},{"class":211,"line":2776},[27517,27522,27526,27531,27536,27540,27545,27550,27555],{"type":21,"tag":209,"props":27518,"children":27519},{"style":222},[27520],{"type":26,"value":27521},"            objectStore ",{"type":21,"tag":209,"props":27523,"children":27524},{"style":216},[27525],{"type":26,"value":1432},{"type":21,"tag":209,"props":27527,"children":27528},{"style":222},[27529],{"type":26,"value":27530}," db.",{"type":21,"tag":209,"props":27532,"children":27533},{"style":360},[27534],{"type":26,"value":27535},"createObjectStore",{"type":21,"tag":209,"props":27537,"children":27538},{"style":222},[27539],{"type":26,"value":368},{"type":21,"tag":209,"props":27541,"children":27542},{"style":233},[27543],{"type":26,"value":27544},"\"jalicData\"",{"type":21,"tag":209,"props":27546,"children":27547},{"style":222},[27548],{"type":26,"value":27549},", {keyPath:",{"type":21,"tag":209,"props":27551,"children":27552},{"style":233},[27553],{"type":26,"value":27554},"\"jdName\"",{"type":21,"tag":209,"props":27556,"children":27557},{"style":222},[27558],{"type":26,"value":469},{"type":21,"tag":209,"props":27560,"children":27561},{"class":211,"line":2785},[27562,27567,27572,27576,27581,27585,27589,27594,27599],{"type":21,"tag":209,"props":27563,"children":27564},{"style":222},[27565],{"type":26,"value":27566},"            objectStore.",{"type":21,"tag":209,"props":27568,"children":27569},{"style":360},[27570],{"type":26,"value":27571},"createIndex",{"type":21,"tag":209,"props":27573,"children":27574},{"style":222},[27575],{"type":26,"value":368},{"type":21,"tag":209,"props":27577,"children":27578},{"style":233},[27579],{"type":26,"value":27580},"\"storedAt\"",{"type":21,"tag":209,"props":27582,"children":27583},{"style":222},[27584],{"type":26,"value":408},{"type":21,"tag":209,"props":27586,"children":27587},{"style":233},[27588],{"type":26,"value":27580},{"type":21,"tag":209,"props":27590,"children":27591},{"style":222},[27592],{"type":26,"value":27593},", {unique:",{"type":21,"tag":209,"props":27595,"children":27596},{"style":263},[27597],{"type":26,"value":27598},"false",{"type":21,"tag":209,"props":27600,"children":27601},{"style":222},[27602],{"type":26,"value":469},{"type":21,"tag":209,"props":27604,"children":27605},{"class":211,"line":2793},[27606],{"type":21,"tag":209,"props":27607,"children":27608},{"emptyLinePlaceholder":248},[27609],{"type":26,"value":251},{"type":21,"tag":209,"props":27611,"children":27612},{"class":211,"line":2801},[27613,27618,27623,27627,27631,27635,27639],{"type":21,"tag":209,"props":27614,"children":27615},{"style":222},[27616],{"type":26,"value":27617},"            objectStore.transaction.",{"type":21,"tag":209,"props":27619,"children":27620},{"style":360},[27621],{"type":26,"value":27622},"oncomplete",{"type":21,"tag":209,"props":27624,"children":27625},{"style":216},[27626],{"type":26,"value":271},{"type":21,"tag":209,"props":27628,"children":27629},{"style":216},[27630],{"type":26,"value":4766},{"type":21,"tag":209,"props":27632,"children":27633},{"style":222},[27634],{"type":26,"value":368},{"type":21,"tag":209,"props":27636,"children":27637},{"style":400},[27638],{"type":26,"value":10794},{"type":21,"tag":209,"props":27640,"children":27641},{"style":222},[27642],{"type":26,"value":2369},{"type":21,"tag":209,"props":27644,"children":27645},{"class":211,"line":2809},[27646,27651,27655],{"type":21,"tag":209,"props":27647,"children":27648},{"style":222},[27649],{"type":26,"value":27650},"                dbReady.",{"type":21,"tag":209,"props":27652,"children":27653},{"style":360},[27654],{"type":26,"value":5590},{"type":21,"tag":209,"props":27656,"children":27657},{"style":222},[27658],{"type":26,"value":4842},{"type":21,"tag":209,"props":27660,"children":27661},{"class":211,"line":6219},[27662],{"type":21,"tag":209,"props":27663,"children":27664},{"style":222},[27665],{"type":26,"value":6375},{"type":21,"tag":209,"props":27667,"children":27668},{"class":211,"line":6228},[27669],{"type":21,"tag":209,"props":27670,"children":27671},{"style":222},[27672],{"type":26,"value":6384},{"type":21,"tag":209,"props":27674,"children":27675},{"class":211,"line":6250},[27676],{"type":21,"tag":209,"props":27677,"children":27678},{"emptyLinePlaceholder":248},[27679],{"type":26,"value":251},{"type":21,"tag":209,"props":27681,"children":27682},{"class":211,"line":6258},[27683],{"type":21,"tag":209,"props":27684,"children":27685},{"style":448},[27686],{"type":26,"value":2412},{"type":21,"tag":209,"props":27688,"children":27689},{"class":211,"line":6267},[27690],{"type":21,"tag":209,"props":27691,"children":27692},{"style":448},[27693],{"type":26,"value":27694},"         * DB was opened successfully, with no upgrade needed.\n",{"type":21,"tag":209,"props":27696,"children":27697},{"class":211,"line":6303},[27698,27702,27706],{"type":21,"tag":209,"props":27699,"children":27700},{"style":448},[27701],{"type":26,"value":27237},{"type":21,"tag":209,"props":27703,"children":27704},{"style":216},[27705],{"type":26,"value":4718},{"type":21,"tag":209,"props":27707,"children":27708},{"style":222},[27709],{"type":26,"value":10766},{"type":21,"tag":209,"props":27711,"children":27712},{"class":211,"line":6336},[27713],{"type":21,"tag":209,"props":27714,"children":27715},{"style":448},[27716],{"type":26,"value":2439},{"type":21,"tag":209,"props":27718,"children":27719},{"class":211,"line":6369},[27720,27724,27729,27733,27737,27741,27745],{"type":21,"tag":209,"props":27721,"children":27722},{"style":222},[27723],{"type":26,"value":27260},{"type":21,"tag":209,"props":27725,"children":27726},{"style":360},[27727],{"type":26,"value":27728},"onsuccess",{"type":21,"tag":209,"props":27730,"children":27731},{"style":216},[27732],{"type":26,"value":271},{"type":21,"tag":209,"props":27734,"children":27735},{"style":216},[27736],{"type":26,"value":4766},{"type":21,"tag":209,"props":27738,"children":27739},{"style":222},[27740],{"type":26,"value":368},{"type":21,"tag":209,"props":27742,"children":27743},{"style":400},[27744],{"type":26,"value":10794},{"type":21,"tag":209,"props":27746,"children":27747},{"style":222},[27748],{"type":26,"value":2369},{"type":21,"tag":209,"props":27750,"children":27751},{"class":211,"line":6378},[27752,27756,27760],{"type":21,"tag":209,"props":27753,"children":27754},{"style":222},[27755],{"type":26,"value":27443},{"type":21,"tag":209,"props":27757,"children":27758},{"style":216},[27759],{"type":26,"value":1432},{"type":21,"tag":209,"props":27761,"children":27762},{"style":222},[27763],{"type":26,"value":27452},{"type":21,"tag":209,"props":27765,"children":27766},{"class":211,"line":6387},[27767,27771,27775],{"type":21,"tag":209,"props":27768,"children":27769},{"style":222},[27770],{"type":26,"value":27309},{"type":21,"tag":209,"props":27772,"children":27773},{"style":360},[27774],{"type":26,"value":5590},{"type":21,"tag":209,"props":27776,"children":27777},{"style":222},[27778],{"type":26,"value":4842},{"type":21,"tag":209,"props":27780,"children":27781},{"class":211,"line":6395},[27782],{"type":21,"tag":209,"props":27783,"children":27784},{"style":222},[27785],{"type":26,"value":6384},{"type":21,"tag":209,"props":27787,"children":27788},{"class":211,"line":6404},[27789],{"type":21,"tag":209,"props":27790,"children":27791},{"emptyLinePlaceholder":248},[27792],{"type":26,"value":251},{"type":21,"tag":209,"props":27794,"children":27795},{"class":211,"line":6413},[27796,27800,27805,27810],{"type":21,"tag":209,"props":27797,"children":27798},{"style":216},[27799],{"type":26,"value":3069},{"type":21,"tag":209,"props":27801,"children":27802},{"style":222},[27803],{"type":26,"value":27804}," dbReady.",{"type":21,"tag":209,"props":27806,"children":27807},{"style":360},[27808],{"type":26,"value":27809},"promise",{"type":21,"tag":209,"props":27811,"children":27812},{"style":222},[27813],{"type":26,"value":4842},{"type":21,"tag":209,"props":27815,"children":27816},{"class":211,"line":6447},[27817],{"type":21,"tag":209,"props":27818,"children":27819},{"style":222},[27820],{"type":26,"value":331},{"type":21,"tag":209,"props":27822,"children":27823},{"class":211,"line":6479},[27824],{"type":21,"tag":209,"props":27825,"children":27826},{"emptyLinePlaceholder":248},[27827],{"type":26,"value":251},{"type":21,"tag":209,"props":27829,"children":27830},{"class":211,"line":6511},[27831,27836],{"type":21,"tag":209,"props":27832,"children":27833},{"style":360},[27834],{"type":26,"value":27835},"    createDatabase",{"type":21,"tag":209,"props":27837,"children":27838},{"style":222},[27839],{"type":26,"value":27840},"(idb);\n",{"type":21,"tag":209,"props":27842,"children":27843},{"class":211,"line":6519},[27844],{"type":21,"tag":209,"props":27845,"children":27846},{"emptyLinePlaceholder":248},[27847],{"type":26,"value":251},{"type":21,"tag":209,"props":27849,"children":27850},{"class":211,"line":6527},[27851],{"type":21,"tag":209,"props":27852,"children":27853},{"style":448},[27854],{"type":26,"value":4697},{"type":21,"tag":209,"props":27856,"children":27857},{"class":211,"line":6535},[27858],{"type":21,"tag":209,"props":27859,"children":27860},{"style":448},[27861],{"type":26,"value":27862},"     * Define a simple interface mimicking the Storage interface on the jQuery object, with the major difference being\n",{"type":21,"tag":209,"props":27864,"children":27865},{"class":211,"line":6543},[27866],{"type":21,"tag":209,"props":27867,"children":27868},{"style":448},[27869],{"type":26,"value":27870},"     * everything executes asynchronously, and returns a $.Deferred object to account for that.\n",{"type":21,"tag":209,"props":27872,"children":27873},{"class":211,"line":6552},[27874],{"type":21,"tag":209,"props":27875,"children":27876},{"style":448},[27877],{"type":26,"value":4753},{"type":21,"tag":209,"props":27879,"children":27880},{"class":211,"line":6572},[27881,27886,27890],{"type":21,"tag":209,"props":27882,"children":27883},{"style":222},[27884],{"type":26,"value":27885},"    $.jidb ",{"type":21,"tag":209,"props":27887,"children":27888},{"style":216},[27889],{"type":26,"value":1432},{"type":21,"tag":209,"props":27891,"children":27892},{"style":222},[27893],{"type":26,"value":276},{"type":21,"tag":209,"props":27895,"children":27896},{"class":211,"line":6589},[27897],{"type":21,"tag":209,"props":27898,"children":27899},{"style":448},[27900],{"type":26,"value":2412},{"type":21,"tag":209,"props":27902,"children":27903},{"class":211,"line":6597},[27904],{"type":21,"tag":209,"props":27905,"children":27906},{"style":448},[27907],{"type":26,"value":27908},"         * Set an item within the jalicData objectStore, using the given jdName and data, with optionally\n",{"type":21,"tag":209,"props":27910,"children":27911},{"class":211,"line":6625},[27912],{"type":21,"tag":209,"props":27913,"children":27914},{"style":448},[27915],{"type":26,"value":27916},"         * a dataType parameter to store alongside the data. If dataType is not provided, it is the result of\n",{"type":21,"tag":209,"props":27918,"children":27919},{"class":211,"line":6648},[27920],{"type":21,"tag":209,"props":27921,"children":27922},{"style":448},[27923],{"type":26,"value":27924},"         * typeof data.\n",{"type":21,"tag":209,"props":27926,"children":27927},{"class":211,"line":6670},[27928],{"type":21,"tag":209,"props":27929,"children":27930},{"style":448},[27931],{"type":26,"value":27932},"         * Notice that we 'put' data, rather than add it - that means we will always overwrite data with an\n",{"type":21,"tag":209,"props":27934,"children":27935},{"class":211,"line":6678},[27936],{"type":21,"tag":209,"props":27937,"children":27938},{"style":448},[27939],{"type":26,"value":27940},"         * identical key (jdName), if it already exists.\n",{"type":21,"tag":209,"props":27942,"children":27943},{"class":211,"line":6686},[27944,27948,27952],{"type":21,"tag":209,"props":27945,"children":27946},{"style":448},[27947],{"type":26,"value":27237},{"type":21,"tag":209,"props":27949,"children":27950},{"style":216},[27951],{"type":26,"value":4718},{"type":21,"tag":209,"props":27953,"children":27954},{"style":222},[27955],{"type":26,"value":27956}," jdName\n",{"type":21,"tag":209,"props":27958,"children":27959},{"class":211,"line":6714},[27960,27964,27968],{"type":21,"tag":209,"props":27961,"children":27962},{"style":448},[27963],{"type":26,"value":27237},{"type":21,"tag":209,"props":27965,"children":27966},{"style":216},[27967],{"type":26,"value":4718},{"type":21,"tag":209,"props":27969,"children":27970},{"style":222},[27971],{"type":26,"value":27972}," data\n",{"type":21,"tag":209,"props":27974,"children":27975},{"class":211,"line":6747},[27976,27980,27984],{"type":21,"tag":209,"props":27977,"children":27978},{"style":448},[27979],{"type":26,"value":27237},{"type":21,"tag":209,"props":27981,"children":27982},{"style":216},[27983],{"type":26,"value":4718},{"type":21,"tag":209,"props":27985,"children":27986},{"style":222},[27987],{"type":26,"value":14651},{"type":21,"tag":209,"props":27989,"children":27990},{"class":211,"line":6761},[27991,27995,27999,28004],{"type":21,"tag":209,"props":27992,"children":27993},{"style":448},[27994],{"type":26,"value":27237},{"type":21,"tag":209,"props":27996,"children":27997},{"style":216},[27998],{"type":26,"value":4740},{"type":21,"tag":209,"props":28000,"children":28001},{"style":360},[28002],{"type":26,"value":28003}," {$.Deferred}",{"type":21,"tag":209,"props":28005,"children":28006},{"style":448},[28007],{"type":26,"value":28008}," Returns a jQuery Deferred object, which resolves with an empty body on success,\n",{"type":21,"tag":209,"props":28010,"children":28011},{"class":211,"line":6769},[28012],{"type":21,"tag":209,"props":28013,"children":28014},{"style":448},[28015],{"type":26,"value":28016},"         * or else resolves with the transaction or request error on failure.\n",{"type":21,"tag":209,"props":28018,"children":28019},{"class":211,"line":6782},[28020],{"type":21,"tag":209,"props":28021,"children":28022},{"style":448},[28023],{"type":26,"value":2439},{"type":21,"tag":209,"props":28025,"children":28026},{"class":211,"line":6812},[28027,28032,28036,28040,28044,28049,28053,28057,28061,28065],{"type":21,"tag":209,"props":28028,"children":28029},{"style":360},[28030],{"type":26,"value":28031},"        setItem",{"type":21,"tag":209,"props":28033,"children":28034},{"style":222},[28035],{"type":26,"value":191},{"type":21,"tag":209,"props":28037,"children":28038},{"style":216},[28039],{"type":26,"value":5370},{"type":21,"tag":209,"props":28041,"children":28042},{"style":222},[28043],{"type":26,"value":368},{"type":21,"tag":209,"props":28045,"children":28046},{"style":400},[28047],{"type":26,"value":28048},"jdName",{"type":21,"tag":209,"props":28050,"children":28051},{"style":222},[28052],{"type":26,"value":408},{"type":21,"tag":209,"props":28054,"children":28055},{"style":400},[28056],{"type":26,"value":2863},{"type":21,"tag":209,"props":28058,"children":28059},{"style":222},[28060],{"type":26,"value":408},{"type":21,"tag":209,"props":28062,"children":28063},{"style":400},[28064],{"type":26,"value":14704},{"type":21,"tag":209,"props":28066,"children":28067},{"style":222},[28068],{"type":26,"value":2369},{"type":21,"tag":209,"props":28070,"children":28071},{"class":211,"line":6831},[28072,28076,28081,28085,28089,28093],{"type":21,"tag":209,"props":28073,"children":28074},{"style":216},[28075],{"type":26,"value":5959},{"type":21,"tag":209,"props":28077,"children":28078},{"style":222},[28079],{"type":26,"value":28080}," defer ",{"type":21,"tag":209,"props":28082,"children":28083},{"style":216},[28084],{"type":26,"value":1432},{"type":21,"tag":209,"props":28086,"children":28087},{"style":222},[28088],{"type":26,"value":26905},{"type":21,"tag":209,"props":28090,"children":28091},{"style":360},[28092],{"type":26,"value":26910},{"type":21,"tag":209,"props":28094,"children":28095},{"style":222},[28096],{"type":26,"value":5405},{"type":21,"tag":209,"props":28098,"children":28099},{"class":211,"line":6840},[28100,28105,28109,28113,28118,28122,28126,28131,28136],{"type":21,"tag":209,"props":28101,"children":28102},{"style":222},[28103],{"type":26,"value":28104},"                transaction ",{"type":21,"tag":209,"props":28106,"children":28107},{"style":216},[28108],{"type":26,"value":1432},{"type":21,"tag":209,"props":28110,"children":28111},{"style":222},[28112],{"type":26,"value":27530},{"type":21,"tag":209,"props":28114,"children":28115},{"style":360},[28116],{"type":26,"value":28117},"transaction",{"type":21,"tag":209,"props":28119,"children":28120},{"style":222},[28121],{"type":26,"value":23626},{"type":21,"tag":209,"props":28123,"children":28124},{"style":233},[28125],{"type":26,"value":27544},{"type":21,"tag":209,"props":28127,"children":28128},{"style":222},[28129],{"type":26,"value":28130},"], ",{"type":21,"tag":209,"props":28132,"children":28133},{"style":233},[28134],{"type":26,"value":28135},"\"readwrite\"",{"type":21,"tag":209,"props":28137,"children":28138},{"style":222},[28139],{"type":26,"value":10277},{"type":21,"tag":209,"props":28141,"children":28142},{"class":211,"line":6864},[28143,28148,28152,28157,28162,28166,28170],{"type":21,"tag":209,"props":28144,"children":28145},{"style":222},[28146],{"type":26,"value":28147},"                objectStore ",{"type":21,"tag":209,"props":28149,"children":28150},{"style":216},[28151],{"type":26,"value":1432},{"type":21,"tag":209,"props":28153,"children":28154},{"style":222},[28155],{"type":26,"value":28156}," transaction.",{"type":21,"tag":209,"props":28158,"children":28159},{"style":360},[28160],{"type":26,"value":28161},"objectStore",{"type":21,"tag":209,"props":28163,"children":28164},{"style":222},[28165],{"type":26,"value":368},{"type":21,"tag":209,"props":28167,"children":28168},{"style":233},[28169],{"type":26,"value":27544},{"type":21,"tag":209,"props":28171,"children":28172},{"style":222},[28173],{"type":26,"value":10277},{"type":21,"tag":209,"props":28175,"children":28176},{"class":211,"line":6872},[28177],{"type":21,"tag":209,"props":28178,"children":28179},{"style":222},[28180],{"type":26,"value":28181},"                request;\n",{"type":21,"tag":209,"props":28183,"children":28184},{"class":211,"line":6880},[28185],{"type":21,"tag":209,"props":28186,"children":28187},{"emptyLinePlaceholder":248},[28188],{"type":26,"value":251},{"type":21,"tag":209,"props":28190,"children":28191},{"class":211,"line":6899},[28192,28196,28200,28205,28209,28213],{"type":21,"tag":209,"props":28193,"children":28194},{"style":222},[28195],{"type":26,"value":16094},{"type":21,"tag":209,"props":28197,"children":28198},{"style":216},[28199],{"type":26,"value":1432},{"type":21,"tag":209,"props":28201,"children":28202},{"style":222},[28203],{"type":26,"value":28204}," dataType ",{"type":21,"tag":209,"props":28206,"children":28207},{"style":216},[28208],{"type":26,"value":4677},{"type":21,"tag":209,"props":28210,"children":28211},{"style":216},[28212],{"type":26,"value":17135},{"type":21,"tag":209,"props":28214,"children":28215},{"style":222},[28216],{"type":26,"value":1303},{"type":21,"tag":209,"props":28218,"children":28219},{"class":211,"line":6907},[28220],{"type":21,"tag":209,"props":28221,"children":28222},{"emptyLinePlaceholder":248},[28223],{"type":26,"value":251},{"type":21,"tag":209,"props":28225,"children":28226},{"class":211,"line":6919},[28227,28232,28236,28240,28244],{"type":21,"tag":209,"props":28228,"children":28229},{"style":222},[28230],{"type":26,"value":28231},"            transaction.",{"type":21,"tag":209,"props":28233,"children":28234},{"style":360},[28235],{"type":26,"value":27622},{"type":21,"tag":209,"props":28237,"children":28238},{"style":216},[28239],{"type":26,"value":271},{"type":21,"tag":209,"props":28241,"children":28242},{"style":216},[28243],{"type":26,"value":4766},{"type":21,"tag":209,"props":28245,"children":28246},{"style":222},[28247],{"type":26,"value":2561},{"type":21,"tag":209,"props":28249,"children":28250},{"class":211,"line":6927},[28251,28255,28260,28264],{"type":21,"tag":209,"props":28252,"children":28253},{"style":216},[28254],{"type":26,"value":5653},{"type":21,"tag":209,"props":28256,"children":28257},{"style":222},[28258],{"type":26,"value":28259}," defer.",{"type":21,"tag":209,"props":28261,"children":28262},{"style":360},[28263],{"type":26,"value":5590},{"type":21,"tag":209,"props":28265,"children":28266},{"style":222},[28267],{"type":26,"value":4842},{"type":21,"tag":209,"props":28269,"children":28270},{"class":211,"line":6935},[28271],{"type":21,"tag":209,"props":28272,"children":28273},{"style":222},[28274],{"type":26,"value":6375},{"type":21,"tag":209,"props":28276,"children":28277},{"class":211,"line":6943},[28278],{"type":21,"tag":209,"props":28279,"children":28280},{"emptyLinePlaceholder":248},[28281],{"type":26,"value":251},{"type":21,"tag":209,"props":28283,"children":28284},{"class":211,"line":6952},[28285,28289,28293,28297,28301,28305,28309],{"type":21,"tag":209,"props":28286,"children":28287},{"style":222},[28288],{"type":26,"value":28231},{"type":21,"tag":209,"props":28290,"children":28291},{"style":360},[28292],{"type":26,"value":27265},{"type":21,"tag":209,"props":28294,"children":28295},{"style":216},[28296],{"type":26,"value":271},{"type":21,"tag":209,"props":28298,"children":28299},{"style":216},[28300],{"type":26,"value":4766},{"type":21,"tag":209,"props":28302,"children":28303},{"style":222},[28304],{"type":26,"value":368},{"type":21,"tag":209,"props":28306,"children":28307},{"style":400},[28308],{"type":26,"value":10794},{"type":21,"tag":209,"props":28310,"children":28311},{"style":222},[28312],{"type":26,"value":2369},{"type":21,"tag":209,"props":28314,"children":28315},{"class":211,"line":6961},[28316,28320,28324],{"type":21,"tag":209,"props":28317,"children":28318},{"style":222},[28319],{"type":26,"value":2764},{"type":21,"tag":209,"props":28321,"children":28322},{"style":360},[28323],{"type":26,"value":1059},{"type":21,"tag":209,"props":28325,"children":28326},{"style":222},[28327],{"type":26,"value":27301},{"type":21,"tag":209,"props":28329,"children":28330},{"class":211,"line":6977},[28331,28335,28339,28343],{"type":21,"tag":209,"props":28332,"children":28333},{"style":216},[28334],{"type":26,"value":5653},{"type":21,"tag":209,"props":28336,"children":28337},{"style":222},[28338],{"type":26,"value":28259},{"type":21,"tag":209,"props":28340,"children":28341},{"style":360},[28342],{"type":26,"value":5599},{"type":21,"tag":209,"props":28344,"children":28345},{"style":222},[28346],{"type":26,"value":27301},{"type":21,"tag":209,"props":28348,"children":28349},{"class":211,"line":6993},[28350],{"type":21,"tag":209,"props":28351,"children":28352},{"style":222},[28353],{"type":26,"value":6375},{"type":21,"tag":209,"props":28355,"children":28356},{"class":211,"line":7001},[28357],{"type":21,"tag":209,"props":28358,"children":28359},{"emptyLinePlaceholder":248},[28360],{"type":26,"value":251},{"type":21,"tag":209,"props":28362,"children":28363},{"class":211,"line":7025},[28364,28369,28373,28378,28383,28388,28392,28396],{"type":21,"tag":209,"props":28365,"children":28366},{"style":222},[28367],{"type":26,"value":28368},"            request ",{"type":21,"tag":209,"props":28370,"children":28371},{"style":216},[28372],{"type":26,"value":1432},{"type":21,"tag":209,"props":28374,"children":28375},{"style":222},[28376],{"type":26,"value":28377}," objectStore.",{"type":21,"tag":209,"props":28379,"children":28380},{"style":360},[28381],{"type":26,"value":28382},"put",{"type":21,"tag":209,"props":28384,"children":28385},{"style":222},[28386],{"type":26,"value":28387},"({jdName:jdName, storedAt:",{"type":21,"tag":209,"props":28389,"children":28390},{"style":216},[28391],{"type":26,"value":14383},{"type":21,"tag":209,"props":28393,"children":28394},{"style":360},[28395],{"type":26,"value":14388},{"type":21,"tag":209,"props":28397,"children":28398},{"style":222},[28399],{"type":26,"value":28400},"(), dataType:dataType, data:data});\n",{"type":21,"tag":209,"props":28402,"children":28403},{"class":211,"line":7066},[28404],{"type":21,"tag":209,"props":28405,"children":28406},{"emptyLinePlaceholder":248},[28407],{"type":26,"value":251},{"type":21,"tag":209,"props":28409,"children":28410},{"class":211,"line":7094},[28411,28416,28420,28424,28428,28432,28436],{"type":21,"tag":209,"props":28412,"children":28413},{"style":222},[28414],{"type":26,"value":28415},"            request.",{"type":21,"tag":209,"props":28417,"children":28418},{"style":360},[28419],{"type":26,"value":27265},{"type":21,"tag":209,"props":28421,"children":28422},{"style":216},[28423],{"type":26,"value":271},{"type":21,"tag":209,"props":28425,"children":28426},{"style":216},[28427],{"type":26,"value":4766},{"type":21,"tag":209,"props":28429,"children":28430},{"style":222},[28431],{"type":26,"value":368},{"type":21,"tag":209,"props":28433,"children":28434},{"style":400},[28435],{"type":26,"value":10794},{"type":21,"tag":209,"props":28437,"children":28438},{"style":222},[28439],{"type":26,"value":2369},{"type":21,"tag":209,"props":28441,"children":28442},{"class":211,"line":7110},[28443,28447,28451],{"type":21,"tag":209,"props":28444,"children":28445},{"style":222},[28446],{"type":26,"value":2764},{"type":21,"tag":209,"props":28448,"children":28449},{"style":360},[28450],{"type":26,"value":1059},{"type":21,"tag":209,"props":28452,"children":28453},{"style":222},[28454],{"type":26,"value":27301},{"type":21,"tag":209,"props":28456,"children":28457},{"class":211,"line":7126},[28458,28463,28467],{"type":21,"tag":209,"props":28459,"children":28460},{"style":222},[28461],{"type":26,"value":28462},"                defer.",{"type":21,"tag":209,"props":28464,"children":28465},{"style":360},[28466],{"type":26,"value":5599},{"type":21,"tag":209,"props":28468,"children":28469},{"style":222},[28470],{"type":26,"value":27301},{"type":21,"tag":209,"props":28472,"children":28473},{"class":211,"line":7142},[28474],{"type":21,"tag":209,"props":28475,"children":28476},{"style":222},[28477],{"type":26,"value":6375},{"type":21,"tag":209,"props":28479,"children":28480},{"class":211,"line":7150},[28481],{"type":21,"tag":209,"props":28482,"children":28483},{"emptyLinePlaceholder":248},[28484],{"type":26,"value":251},{"type":21,"tag":209,"props":28486,"children":28487},{"class":211,"line":7162},[28488,28492,28496,28500],{"type":21,"tag":209,"props":28489,"children":28490},{"style":216},[28491],{"type":26,"value":5101},{"type":21,"tag":209,"props":28493,"children":28494},{"style":222},[28495],{"type":26,"value":28259},{"type":21,"tag":209,"props":28497,"children":28498},{"style":360},[28499],{"type":26,"value":27809},{"type":21,"tag":209,"props":28501,"children":28502},{"style":222},[28503],{"type":26,"value":4842},{"type":21,"tag":209,"props":28505,"children":28506},{"class":211,"line":7170},[28507],{"type":21,"tag":209,"props":28508,"children":28509},{"style":222},[28510],{"type":26,"value":2522},{"type":21,"tag":209,"props":28512,"children":28513},{"class":211,"line":7178},[28514],{"type":21,"tag":209,"props":28515,"children":28516},{"style":448},[28517],{"type":26,"value":2412},{"type":21,"tag":209,"props":28519,"children":28520},{"class":211,"line":7186},[28521],{"type":21,"tag":209,"props":28522,"children":28523},{"style":448},[28524],{"type":26,"value":28525},"         * Retrieve an item from the jalicData objectStore, using the given jdName as the key.\n",{"type":21,"tag":209,"props":28527,"children":28528},{"class":211,"line":7199},[28529,28533,28537],{"type":21,"tag":209,"props":28530,"children":28531},{"style":448},[28532],{"type":26,"value":27237},{"type":21,"tag":209,"props":28534,"children":28535},{"style":216},[28536],{"type":26,"value":4718},{"type":21,"tag":209,"props":28538,"children":28539},{"style":222},[28540],{"type":26,"value":27956},{"type":21,"tag":209,"props":28542,"children":28543},{"class":211,"line":16789},[28544,28548,28552,28556],{"type":21,"tag":209,"props":28545,"children":28546},{"style":448},[28547],{"type":26,"value":27237},{"type":21,"tag":209,"props":28549,"children":28550},{"style":216},[28551],{"type":26,"value":4740},{"type":21,"tag":209,"props":28553,"children":28554},{"style":360},[28555],{"type":26,"value":28003},{"type":21,"tag":209,"props":28557,"children":28558},{"style":448},[28559],{"type":26,"value":28560}," Returns a jQuery Deferred object, which resolves with the request result as an object\n",{"type":21,"tag":209,"props":28562,"children":28563},{"class":211,"line":16798},[28564],{"type":21,"tag":209,"props":28565,"children":28566},{"style":448},[28567],{"type":26,"value":28568},"         * on success, or else resolves with the transaction or request error on failure.\n",{"type":21,"tag":209,"props":28570,"children":28571},{"class":211,"line":16812},[28572],{"type":21,"tag":209,"props":28573,"children":28574},{"style":448},[28575],{"type":26,"value":2439},{"type":21,"tag":209,"props":28577,"children":28578},{"class":211,"line":16821},[28579,28584,28588,28592,28596,28600],{"type":21,"tag":209,"props":28580,"children":28581},{"style":360},[28582],{"type":26,"value":28583},"        getItem",{"type":21,"tag":209,"props":28585,"children":28586},{"style":222},[28587],{"type":26,"value":191},{"type":21,"tag":209,"props":28589,"children":28590},{"style":216},[28591],{"type":26,"value":5370},{"type":21,"tag":209,"props":28593,"children":28594},{"style":222},[28595],{"type":26,"value":368},{"type":21,"tag":209,"props":28597,"children":28598},{"style":400},[28599],{"type":26,"value":28048},{"type":21,"tag":209,"props":28601,"children":28602},{"style":222},[28603],{"type":26,"value":2369},{"type":21,"tag":209,"props":28605,"children":28606},{"class":211,"line":16835},[28607,28611,28615,28619,28623,28627],{"type":21,"tag":209,"props":28608,"children":28609},{"style":216},[28610],{"type":26,"value":5959},{"type":21,"tag":209,"props":28612,"children":28613},{"style":222},[28614],{"type":26,"value":28080},{"type":21,"tag":209,"props":28616,"children":28617},{"style":216},[28618],{"type":26,"value":1432},{"type":21,"tag":209,"props":28620,"children":28621},{"style":222},[28622],{"type":26,"value":26905},{"type":21,"tag":209,"props":28624,"children":28625},{"style":360},[28626],{"type":26,"value":26910},{"type":21,"tag":209,"props":28628,"children":28629},{"style":222},[28630],{"type":26,"value":5405},{"type":21,"tag":209,"props":28632,"children":28633},{"class":211,"line":16849},[28634,28638,28642,28646,28650,28654,28658,28662,28667],{"type":21,"tag":209,"props":28635,"children":28636},{"style":222},[28637],{"type":26,"value":28104},{"type":21,"tag":209,"props":28639,"children":28640},{"style":216},[28641],{"type":26,"value":1432},{"type":21,"tag":209,"props":28643,"children":28644},{"style":222},[28645],{"type":26,"value":27530},{"type":21,"tag":209,"props":28647,"children":28648},{"style":360},[28649],{"type":26,"value":28117},{"type":21,"tag":209,"props":28651,"children":28652},{"style":222},[28653],{"type":26,"value":23626},{"type":21,"tag":209,"props":28655,"children":28656},{"style":233},[28657],{"type":26,"value":27544},{"type":21,"tag":209,"props":28659,"children":28660},{"style":222},[28661],{"type":26,"value":28130},{"type":21,"tag":209,"props":28663,"children":28664},{"style":233},[28665],{"type":26,"value":28666},"\"readonly\"",{"type":21,"tag":209,"props":28668,"children":28669},{"style":222},[28670],{"type":26,"value":10277},{"type":21,"tag":209,"props":28672,"children":28673},{"class":211,"line":16857},[28674,28678,28682,28686,28690,28694,28698],{"type":21,"tag":209,"props":28675,"children":28676},{"style":222},[28677],{"type":26,"value":28147},{"type":21,"tag":209,"props":28679,"children":28680},{"style":216},[28681],{"type":26,"value":1432},{"type":21,"tag":209,"props":28683,"children":28684},{"style":222},[28685],{"type":26,"value":28156},{"type":21,"tag":209,"props":28687,"children":28688},{"style":360},[28689],{"type":26,"value":28161},{"type":21,"tag":209,"props":28691,"children":28692},{"style":222},[28693],{"type":26,"value":368},{"type":21,"tag":209,"props":28695,"children":28696},{"style":233},[28697],{"type":26,"value":27544},{"type":21,"tag":209,"props":28699,"children":28700},{"style":222},[28701],{"type":26,"value":10277},{"type":21,"tag":209,"props":28703,"children":28704},{"class":211,"line":16898},[28705,28710,28714,28718,28722],{"type":21,"tag":209,"props":28706,"children":28707},{"style":222},[28708],{"type":26,"value":28709},"                request ",{"type":21,"tag":209,"props":28711,"children":28712},{"style":216},[28713],{"type":26,"value":1432},{"type":21,"tag":209,"props":28715,"children":28716},{"style":222},[28717],{"type":26,"value":28377},{"type":21,"tag":209,"props":28719,"children":28720},{"style":360},[28721],{"type":26,"value":6663},{"type":21,"tag":209,"props":28723,"children":28724},{"style":222},[28725],{"type":26,"value":28726},"(jdName);\n",{"type":21,"tag":209,"props":28728,"children":28729},{"class":211,"line":16923},[28730],{"type":21,"tag":209,"props":28731,"children":28732},{"emptyLinePlaceholder":248},[28733],{"type":26,"value":251},{"type":21,"tag":209,"props":28735,"children":28736},{"class":211,"line":16954},[28737,28741,28745,28749,28753,28757,28761],{"type":21,"tag":209,"props":28738,"children":28739},{"style":222},[28740],{"type":26,"value":28415},{"type":21,"tag":209,"props":28742,"children":28743},{"style":360},[28744],{"type":26,"value":27265},{"type":21,"tag":209,"props":28746,"children":28747},{"style":216},[28748],{"type":26,"value":271},{"type":21,"tag":209,"props":28750,"children":28751},{"style":216},[28752],{"type":26,"value":4766},{"type":21,"tag":209,"props":28754,"children":28755},{"style":222},[28756],{"type":26,"value":368},{"type":21,"tag":209,"props":28758,"children":28759},{"style":400},[28760],{"type":26,"value":10794},{"type":21,"tag":209,"props":28762,"children":28763},{"style":222},[28764],{"type":26,"value":2369},{"type":21,"tag":209,"props":28766,"children":28767},{"class":211,"line":16976},[28768,28772,28776],{"type":21,"tag":209,"props":28769,"children":28770},{"style":222},[28771],{"type":26,"value":2764},{"type":21,"tag":209,"props":28773,"children":28774},{"style":360},[28775],{"type":26,"value":1059},{"type":21,"tag":209,"props":28777,"children":28778},{"style":222},[28779],{"type":26,"value":27301},{"type":21,"tag":209,"props":28781,"children":28782},{"class":211,"line":16994},[28783,28787,28791],{"type":21,"tag":209,"props":28784,"children":28785},{"style":222},[28786],{"type":26,"value":28462},{"type":21,"tag":209,"props":28788,"children":28789},{"style":360},[28790],{"type":26,"value":5599},{"type":21,"tag":209,"props":28792,"children":28793},{"style":222},[28794],{"type":26,"value":27301},{"type":21,"tag":209,"props":28796,"children":28797},{"class":211,"line":17003},[28798],{"type":21,"tag":209,"props":28799,"children":28800},{"style":222},[28801],{"type":26,"value":6375},{"type":21,"tag":209,"props":28803,"children":28804},{"class":211,"line":17011},[28805],{"type":21,"tag":209,"props":28806,"children":28807},{"emptyLinePlaceholder":248},[28808],{"type":26,"value":251},{"type":21,"tag":209,"props":28810,"children":28811},{"class":211,"line":17020},[28812,28816,28820,28824,28828,28832,28836],{"type":21,"tag":209,"props":28813,"children":28814},{"style":222},[28815],{"type":26,"value":28415},{"type":21,"tag":209,"props":28817,"children":28818},{"style":360},[28819],{"type":26,"value":27728},{"type":21,"tag":209,"props":28821,"children":28822},{"style":216},[28823],{"type":26,"value":271},{"type":21,"tag":209,"props":28825,"children":28826},{"style":216},[28827],{"type":26,"value":4766},{"type":21,"tag":209,"props":28829,"children":28830},{"style":222},[28831],{"type":26,"value":368},{"type":21,"tag":209,"props":28833,"children":28834},{"style":400},[28835],{"type":26,"value":10794},{"type":21,"tag":209,"props":28837,"children":28838},{"style":222},[28839],{"type":26,"value":2369},{"type":21,"tag":209,"props":28841,"children":28842},{"class":211,"line":17028},[28843,28847,28851],{"type":21,"tag":209,"props":28844,"children":28845},{"style":222},[28846],{"type":26,"value":28462},{"type":21,"tag":209,"props":28848,"children":28849},{"style":360},[28850],{"type":26,"value":5590},{"type":21,"tag":209,"props":28852,"children":28853},{"style":222},[28854],{"type":26,"value":28855},"(request.result);\n",{"type":21,"tag":209,"props":28857,"children":28858},{"class":211,"line":17061},[28859],{"type":21,"tag":209,"props":28860,"children":28861},{"style":222},[28862],{"type":26,"value":6375},{"type":21,"tag":209,"props":28864,"children":28865},{"class":211,"line":17069},[28866],{"type":21,"tag":209,"props":28867,"children":28868},{"emptyLinePlaceholder":248},[28869],{"type":26,"value":251},{"type":21,"tag":209,"props":28871,"children":28872},{"class":211,"line":17108},[28873,28877,28881,28885],{"type":21,"tag":209,"props":28874,"children":28875},{"style":216},[28876],{"type":26,"value":5101},{"type":21,"tag":209,"props":28878,"children":28879},{"style":222},[28880],{"type":26,"value":28259},{"type":21,"tag":209,"props":28882,"children":28883},{"style":360},[28884],{"type":26,"value":27809},{"type":21,"tag":209,"props":28886,"children":28887},{"style":222},[28888],{"type":26,"value":4842},{"type":21,"tag":209,"props":28890,"children":28891},{"class":211,"line":17116},[28892],{"type":21,"tag":209,"props":28893,"children":28894},{"style":222},[28895],{"type":26,"value":2522},{"type":21,"tag":209,"props":28897,"children":28898},{"class":211,"line":17170},[28899],{"type":21,"tag":209,"props":28900,"children":28901},{"style":448},[28902],{"type":26,"value":2412},{"type":21,"tag":209,"props":28904,"children":28905},{"class":211,"line":17182},[28906],{"type":21,"tag":209,"props":28907,"children":28908},{"style":448},[28909],{"type":26,"value":28910},"         * Remove an item from the jalicData objectStore, using the given jdName as the key.\n",{"type":21,"tag":209,"props":28912,"children":28913},{"class":211,"line":17204},[28914,28918,28922],{"type":21,"tag":209,"props":28915,"children":28916},{"style":448},[28917],{"type":26,"value":27237},{"type":21,"tag":209,"props":28919,"children":28920},{"style":216},[28921],{"type":26,"value":4718},{"type":21,"tag":209,"props":28923,"children":28924},{"style":222},[28925],{"type":26,"value":27956},{"type":21,"tag":209,"props":28927,"children":28928},{"class":211,"line":17212},[28929,28933,28937,28941],{"type":21,"tag":209,"props":28930,"children":28931},{"style":448},[28932],{"type":26,"value":27237},{"type":21,"tag":209,"props":28934,"children":28935},{"style":216},[28936],{"type":26,"value":4740},{"type":21,"tag":209,"props":28938,"children":28939},{"style":360},[28940],{"type":26,"value":28003},{"type":21,"tag":209,"props":28942,"children":28943},{"style":448},[28944],{"type":26,"value":28008},{"type":21,"tag":209,"props":28946,"children":28947},{"class":211,"line":17220},[28948],{"type":21,"tag":209,"props":28949,"children":28950},{"style":448},[28951],{"type":26,"value":28016},{"type":21,"tag":209,"props":28953,"children":28954},{"class":211,"line":17259},[28955],{"type":21,"tag":209,"props":28956,"children":28957},{"style":448},[28958],{"type":26,"value":2439},{"type":21,"tag":209,"props":28960,"children":28961},{"class":211,"line":17271},[28962,28967,28971,28975,28979,28983],{"type":21,"tag":209,"props":28963,"children":28964},{"style":360},[28965],{"type":26,"value":28966},"        removeItem",{"type":21,"tag":209,"props":28968,"children":28969},{"style":222},[28970],{"type":26,"value":191},{"type":21,"tag":209,"props":28972,"children":28973},{"style":216},[28974],{"type":26,"value":5370},{"type":21,"tag":209,"props":28976,"children":28977},{"style":222},[28978],{"type":26,"value":368},{"type":21,"tag":209,"props":28980,"children":28981},{"style":400},[28982],{"type":26,"value":28048},{"type":21,"tag":209,"props":28984,"children":28985},{"style":222},[28986],{"type":26,"value":2369},{"type":21,"tag":209,"props":28988,"children":28989},{"class":211,"line":17279},[28990,28994,28998,29002,29006,29010],{"type":21,"tag":209,"props":28991,"children":28992},{"style":216},[28993],{"type":26,"value":5959},{"type":21,"tag":209,"props":28995,"children":28996},{"style":222},[28997],{"type":26,"value":28080},{"type":21,"tag":209,"props":28999,"children":29000},{"style":216},[29001],{"type":26,"value":1432},{"type":21,"tag":209,"props":29003,"children":29004},{"style":222},[29005],{"type":26,"value":26905},{"type":21,"tag":209,"props":29007,"children":29008},{"style":360},[29009],{"type":26,"value":26910},{"type":21,"tag":209,"props":29011,"children":29012},{"style":222},[29013],{"type":26,"value":5405},{"type":21,"tag":209,"props":29015,"children":29016},{"class":211,"line":17287},[29017,29021,29025,29029,29033,29037,29041,29045,29049],{"type":21,"tag":209,"props":29018,"children":29019},{"style":222},[29020],{"type":26,"value":28104},{"type":21,"tag":209,"props":29022,"children":29023},{"style":216},[29024],{"type":26,"value":1432},{"type":21,"tag":209,"props":29026,"children":29027},{"style":222},[29028],{"type":26,"value":27530},{"type":21,"tag":209,"props":29030,"children":29031},{"style":360},[29032],{"type":26,"value":28117},{"type":21,"tag":209,"props":29034,"children":29035},{"style":222},[29036],{"type":26,"value":23626},{"type":21,"tag":209,"props":29038,"children":29039},{"style":233},[29040],{"type":26,"value":27544},{"type":21,"tag":209,"props":29042,"children":29043},{"style":222},[29044],{"type":26,"value":28130},{"type":21,"tag":209,"props":29046,"children":29047},{"style":233},[29048],{"type":26,"value":28135},{"type":21,"tag":209,"props":29050,"children":29051},{"style":222},[29052],{"type":26,"value":10277},{"type":21,"tag":209,"props":29054,"children":29055},{"class":211,"line":17312},[29056,29060,29064,29068,29072,29076,29080],{"type":21,"tag":209,"props":29057,"children":29058},{"style":222},[29059],{"type":26,"value":28147},{"type":21,"tag":209,"props":29061,"children":29062},{"style":216},[29063],{"type":26,"value":1432},{"type":21,"tag":209,"props":29065,"children":29066},{"style":222},[29067],{"type":26,"value":28156},{"type":21,"tag":209,"props":29069,"children":29070},{"style":360},[29071],{"type":26,"value":28161},{"type":21,"tag":209,"props":29073,"children":29074},{"style":222},[29075],{"type":26,"value":368},{"type":21,"tag":209,"props":29077,"children":29078},{"style":233},[29079],{"type":26,"value":27544},{"type":21,"tag":209,"props":29081,"children":29082},{"style":222},[29083],{"type":26,"value":10277},{"type":21,"tag":209,"props":29085,"children":29086},{"class":211,"line":17320},[29087,29091,29095,29099,29103],{"type":21,"tag":209,"props":29088,"children":29089},{"style":222},[29090],{"type":26,"value":28709},{"type":21,"tag":209,"props":29092,"children":29093},{"style":216},[29094],{"type":26,"value":1432},{"type":21,"tag":209,"props":29096,"children":29097},{"style":222},[29098],{"type":26,"value":28377},{"type":21,"tag":209,"props":29100,"children":29101},{"style":360},[29102],{"type":26,"value":12034},{"type":21,"tag":209,"props":29104,"children":29105},{"style":222},[29106],{"type":26,"value":28726},{"type":21,"tag":209,"props":29108,"children":29109},{"class":211,"line":17341},[29110],{"type":21,"tag":209,"props":29111,"children":29112},{"emptyLinePlaceholder":248},[29113],{"type":26,"value":251},{"type":21,"tag":209,"props":29115,"children":29116},{"class":211,"line":17350},[29117,29121,29125,29129,29133,29137,29141],{"type":21,"tag":209,"props":29118,"children":29119},{"style":222},[29120],{"type":26,"value":28415},{"type":21,"tag":209,"props":29122,"children":29123},{"style":360},[29124],{"type":26,"value":27265},{"type":21,"tag":209,"props":29126,"children":29127},{"style":216},[29128],{"type":26,"value":271},{"type":21,"tag":209,"props":29130,"children":29131},{"style":216},[29132],{"type":26,"value":4766},{"type":21,"tag":209,"props":29134,"children":29135},{"style":222},[29136],{"type":26,"value":368},{"type":21,"tag":209,"props":29138,"children":29139},{"style":400},[29140],{"type":26,"value":10794},{"type":21,"tag":209,"props":29142,"children":29143},{"style":222},[29144],{"type":26,"value":2369},{"type":21,"tag":209,"props":29146,"children":29147},{"class":211,"line":17359},[29148,29152,29156],{"type":21,"tag":209,"props":29149,"children":29150},{"style":222},[29151],{"type":26,"value":2764},{"type":21,"tag":209,"props":29153,"children":29154},{"style":360},[29155],{"type":26,"value":1059},{"type":21,"tag":209,"props":29157,"children":29158},{"style":222},[29159],{"type":26,"value":27301},{"type":21,"tag":209,"props":29161,"children":29162},{"class":211,"line":17404},[29163,29167,29171],{"type":21,"tag":209,"props":29164,"children":29165},{"style":222},[29166],{"type":26,"value":28462},{"type":21,"tag":209,"props":29168,"children":29169},{"style":360},[29170],{"type":26,"value":5599},{"type":21,"tag":209,"props":29172,"children":29173},{"style":222},[29174],{"type":26,"value":27301},{"type":21,"tag":209,"props":29176,"children":29177},{"class":211,"line":17412},[29178],{"type":21,"tag":209,"props":29179,"children":29180},{"style":222},[29181],{"type":26,"value":6375},{"type":21,"tag":209,"props":29183,"children":29184},{"class":211,"line":17420},[29185],{"type":21,"tag":209,"props":29186,"children":29187},{"emptyLinePlaceholder":248},[29188],{"type":26,"value":251},{"type":21,"tag":209,"props":29190,"children":29191},{"class":211,"line":17429},[29192,29196,29200,29204,29208],{"type":21,"tag":209,"props":29193,"children":29194},{"style":222},[29195],{"type":26,"value":28415},{"type":21,"tag":209,"props":29197,"children":29198},{"style":360},[29199],{"type":26,"value":27728},{"type":21,"tag":209,"props":29201,"children":29202},{"style":216},[29203],{"type":26,"value":271},{"type":21,"tag":209,"props":29205,"children":29206},{"style":216},[29207],{"type":26,"value":4766},{"type":21,"tag":209,"props":29209,"children":29210},{"style":222},[29211],{"type":26,"value":2561},{"type":21,"tag":209,"props":29213,"children":29214},{"class":211,"line":17438},[29215,29219,29223],{"type":21,"tag":209,"props":29216,"children":29217},{"style":222},[29218],{"type":26,"value":28462},{"type":21,"tag":209,"props":29220,"children":29221},{"style":360},[29222],{"type":26,"value":5590},{"type":21,"tag":209,"props":29224,"children":29225},{"style":222},[29226],{"type":26,"value":4842},{"type":21,"tag":209,"props":29228,"children":29229},{"class":211,"line":17486},[29230],{"type":21,"tag":209,"props":29231,"children":29232},{"style":222},[29233],{"type":26,"value":6375},{"type":21,"tag":209,"props":29235,"children":29236},{"class":211,"line":17503},[29237],{"type":21,"tag":209,"props":29238,"children":29239},{"emptyLinePlaceholder":248},[29240],{"type":26,"value":251},{"type":21,"tag":209,"props":29242,"children":29243},{"class":211,"line":17511},[29244,29248,29252,29256],{"type":21,"tag":209,"props":29245,"children":29246},{"style":216},[29247],{"type":26,"value":5101},{"type":21,"tag":209,"props":29249,"children":29250},{"style":222},[29251],{"type":26,"value":28259},{"type":21,"tag":209,"props":29253,"children":29254},{"style":360},[29255],{"type":26,"value":27809},{"type":21,"tag":209,"props":29257,"children":29258},{"style":222},[29259],{"type":26,"value":4842},{"type":21,"tag":209,"props":29261,"children":29263},{"class":211,"line":29262},162,[29264],{"type":21,"tag":209,"props":29265,"children":29266},{"style":222},[29267],{"type":26,"value":2522},{"type":21,"tag":209,"props":29269,"children":29271},{"class":211,"line":29270},163,[29272],{"type":21,"tag":209,"props":29273,"children":29274},{"style":448},[29275],{"type":26,"value":2412},{"type":21,"tag":209,"props":29277,"children":29279},{"class":211,"line":29278},164,[29280],{"type":21,"tag":209,"props":29281,"children":29282},{"style":448},[29283],{"type":26,"value":29284},"         * Delete the jalic database and recreate it.\n",{"type":21,"tag":209,"props":29286,"children":29288},{"class":211,"line":29287},165,[29289,29293,29297,29301],{"type":21,"tag":209,"props":29290,"children":29291},{"style":448},[29292],{"type":26,"value":27237},{"type":21,"tag":209,"props":29294,"children":29295},{"style":216},[29296],{"type":26,"value":4740},{"type":21,"tag":209,"props":29298,"children":29299},{"style":360},[29300],{"type":26,"value":28003},{"type":21,"tag":209,"props":29302,"children":29303},{"style":448},[29304],{"type":26,"value":28008},{"type":21,"tag":209,"props":29306,"children":29308},{"class":211,"line":29307},166,[29309],{"type":21,"tag":209,"props":29310,"children":29311},{"style":448},[29312],{"type":26,"value":28016},{"type":21,"tag":209,"props":29314,"children":29316},{"class":211,"line":29315},167,[29317],{"type":21,"tag":209,"props":29318,"children":29319},{"style":448},[29320],{"type":26,"value":2439},{"type":21,"tag":209,"props":29322,"children":29324},{"class":211,"line":29323},168,[29325,29330,29334,29338],{"type":21,"tag":209,"props":29326,"children":29327},{"style":360},[29328],{"type":26,"value":29329},"        clear",{"type":21,"tag":209,"props":29331,"children":29332},{"style":222},[29333],{"type":26,"value":191},{"type":21,"tag":209,"props":29335,"children":29336},{"style":216},[29337],{"type":26,"value":5370},{"type":21,"tag":209,"props":29339,"children":29340},{"style":222},[29341],{"type":26,"value":2561},{"type":21,"tag":209,"props":29343,"children":29345},{"class":211,"line":29344},169,[29346,29350,29354,29358,29362,29366],{"type":21,"tag":209,"props":29347,"children":29348},{"style":216},[29349],{"type":26,"value":5959},{"type":21,"tag":209,"props":29351,"children":29352},{"style":222},[29353],{"type":26,"value":28080},{"type":21,"tag":209,"props":29355,"children":29356},{"style":216},[29357],{"type":26,"value":1432},{"type":21,"tag":209,"props":29359,"children":29360},{"style":222},[29361],{"type":26,"value":26905},{"type":21,"tag":209,"props":29363,"children":29364},{"style":360},[29365],{"type":26,"value":26910},{"type":21,"tag":209,"props":29367,"children":29368},{"style":222},[29369],{"type":26,"value":5405},{"type":21,"tag":209,"props":29371,"children":29373},{"class":211,"line":29372},170,[29374,29378,29382,29386,29391,29395,29399],{"type":21,"tag":209,"props":29375,"children":29376},{"style":222},[29377],{"type":26,"value":28709},{"type":21,"tag":209,"props":29379,"children":29380},{"style":216},[29381],{"type":26,"value":1432},{"type":21,"tag":209,"props":29383,"children":29384},{"style":222},[29385],{"type":26,"value":27166},{"type":21,"tag":209,"props":29387,"children":29388},{"style":360},[29389],{"type":26,"value":29390},"deleteDatabase",{"type":21,"tag":209,"props":29392,"children":29393},{"style":222},[29394],{"type":26,"value":368},{"type":21,"tag":209,"props":29396,"children":29397},{"style":233},[29398],{"type":26,"value":27179},{"type":21,"tag":209,"props":29400,"children":29401},{"style":222},[29402],{"type":26,"value":2608},{"type":21,"tag":209,"props":29404,"children":29406},{"class":211,"line":29405},171,[29407],{"type":21,"tag":209,"props":29408,"children":29409},{"emptyLinePlaceholder":248},[29410],{"type":26,"value":251},{"type":21,"tag":209,"props":29412,"children":29414},{"class":211,"line":29413},172,[29415,29420,29424,29428,29432],{"type":21,"tag":209,"props":29416,"children":29417},{"style":222},[29418],{"type":26,"value":29419},"            dbReady ",{"type":21,"tag":209,"props":29421,"children":29422},{"style":216},[29423],{"type":26,"value":1432},{"type":21,"tag":209,"props":29425,"children":29426},{"style":222},[29427],{"type":26,"value":26905},{"type":21,"tag":209,"props":29429,"children":29430},{"style":360},[29431],{"type":26,"value":26910},{"type":21,"tag":209,"props":29433,"children":29434},{"style":222},[29435],{"type":26,"value":4842},{"type":21,"tag":209,"props":29437,"children":29439},{"class":211,"line":29438},173,[29440],{"type":21,"tag":209,"props":29441,"children":29442},{"emptyLinePlaceholder":248},[29443],{"type":26,"value":251},{"type":21,"tag":209,"props":29445,"children":29447},{"class":211,"line":29446},174,[29448,29452,29456,29460,29464,29468,29472],{"type":21,"tag":209,"props":29449,"children":29450},{"style":222},[29451],{"type":26,"value":28415},{"type":21,"tag":209,"props":29453,"children":29454},{"style":360},[29455],{"type":26,"value":27265},{"type":21,"tag":209,"props":29457,"children":29458},{"style":216},[29459],{"type":26,"value":271},{"type":21,"tag":209,"props":29461,"children":29462},{"style":216},[29463],{"type":26,"value":4766},{"type":21,"tag":209,"props":29465,"children":29466},{"style":222},[29467],{"type":26,"value":368},{"type":21,"tag":209,"props":29469,"children":29470},{"style":400},[29471],{"type":26,"value":10794},{"type":21,"tag":209,"props":29473,"children":29474},{"style":222},[29475],{"type":26,"value":2369},{"type":21,"tag":209,"props":29477,"children":29479},{"class":211,"line":29478},175,[29480,29484,29488],{"type":21,"tag":209,"props":29481,"children":29482},{"style":222},[29483],{"type":26,"value":2764},{"type":21,"tag":209,"props":29485,"children":29486},{"style":360},[29487],{"type":26,"value":1059},{"type":21,"tag":209,"props":29489,"children":29490},{"style":222},[29491],{"type":26,"value":27301},{"type":21,"tag":209,"props":29493,"children":29495},{"class":211,"line":29494},176,[29496,29500,29504],{"type":21,"tag":209,"props":29497,"children":29498},{"style":222},[29499],{"type":26,"value":28462},{"type":21,"tag":209,"props":29501,"children":29502},{"style":360},[29503],{"type":26,"value":5599},{"type":21,"tag":209,"props":29505,"children":29506},{"style":222},[29507],{"type":26,"value":27301},{"type":21,"tag":209,"props":29509,"children":29511},{"class":211,"line":29510},177,[29512],{"type":21,"tag":209,"props":29513,"children":29514},{"style":222},[29515],{"type":26,"value":6375},{"type":21,"tag":209,"props":29517,"children":29519},{"class":211,"line":29518},178,[29520],{"type":21,"tag":209,"props":29521,"children":29522},{"emptyLinePlaceholder":248},[29523],{"type":26,"value":251},{"type":21,"tag":209,"props":29525,"children":29527},{"class":211,"line":29526},179,[29528,29532,29536,29540,29544],{"type":21,"tag":209,"props":29529,"children":29530},{"style":222},[29531],{"type":26,"value":28415},{"type":21,"tag":209,"props":29533,"children":29534},{"style":360},[29535],{"type":26,"value":27728},{"type":21,"tag":209,"props":29537,"children":29538},{"style":216},[29539],{"type":26,"value":271},{"type":21,"tag":209,"props":29541,"children":29542},{"style":216},[29543],{"type":26,"value":4766},{"type":21,"tag":209,"props":29545,"children":29546},{"style":222},[29547],{"type":26,"value":2561},{"type":21,"tag":209,"props":29549,"children":29551},{"class":211,"line":29550},180,[29552,29556,29560,29564,29568],{"type":21,"tag":209,"props":29553,"children":29554},{"style":222},[29555],{"type":26,"value":27650},{"type":21,"tag":209,"props":29557,"children":29558},{"style":360},[29559],{"type":26,"value":18042},{"type":21,"tag":209,"props":29561,"children":29562},{"style":222},[29563],{"type":26,"value":368},{"type":21,"tag":209,"props":29565,"children":29566},{"style":216},[29567],{"type":26,"value":5370},{"type":21,"tag":209,"props":29569,"children":29570},{"style":222},[29571],{"type":26,"value":2561},{"type":21,"tag":209,"props":29573,"children":29575},{"class":211,"line":29574},181,[29576,29581,29585],{"type":21,"tag":209,"props":29577,"children":29578},{"style":222},[29579],{"type":26,"value":29580},"                    defer.",{"type":21,"tag":209,"props":29582,"children":29583},{"style":360},[29584],{"type":26,"value":5590},{"type":21,"tag":209,"props":29586,"children":29587},{"style":222},[29588],{"type":26,"value":4842},{"type":21,"tag":209,"props":29590,"children":29592},{"class":211,"line":29591},182,[29593],{"type":21,"tag":209,"props":29594,"children":29595},{"style":222},[29596],{"type":26,"value":29597},"                });\n",{"type":21,"tag":209,"props":29599,"children":29601},{"class":211,"line":29600},183,[29602],{"type":21,"tag":209,"props":29603,"children":29604},{"emptyLinePlaceholder":248},[29605],{"type":26,"value":251},{"type":21,"tag":209,"props":29607,"children":29609},{"class":211,"line":29608},184,[29610,29615],{"type":21,"tag":209,"props":29611,"children":29612},{"style":360},[29613],{"type":26,"value":29614},"                createDatabase",{"type":21,"tag":209,"props":29616,"children":29617},{"style":222},[29618],{"type":26,"value":27840},{"type":21,"tag":209,"props":29620,"children":29622},{"class":211,"line":29621},185,[29623],{"type":21,"tag":209,"props":29624,"children":29625},{"style":222},[29626],{"type":26,"value":6375},{"type":21,"tag":209,"props":29628,"children":29630},{"class":211,"line":29629},186,[29631],{"type":21,"tag":209,"props":29632,"children":29633},{"emptyLinePlaceholder":248},[29634],{"type":26,"value":251},{"type":21,"tag":209,"props":29636,"children":29638},{"class":211,"line":29637},187,[29639,29643,29647,29651],{"type":21,"tag":209,"props":29640,"children":29641},{"style":216},[29642],{"type":26,"value":5101},{"type":21,"tag":209,"props":29644,"children":29645},{"style":222},[29646],{"type":26,"value":28259},{"type":21,"tag":209,"props":29648,"children":29649},{"style":360},[29650],{"type":26,"value":27809},{"type":21,"tag":209,"props":29652,"children":29653},{"style":222},[29654],{"type":26,"value":4842},{"type":21,"tag":209,"props":29656,"children":29658},{"class":211,"line":29657},188,[29659],{"type":21,"tag":209,"props":29660,"children":29661},{"style":222},[29662],{"type":26,"value":2235},{"type":21,"tag":209,"props":29664,"children":29666},{"class":211,"line":29665},189,[29667],{"type":21,"tag":209,"props":29668,"children":29669},{"style":222},[29670],{"type":26,"value":4850},{"type":21,"tag":209,"props":29672,"children":29674},{"class":211,"line":29673},190,[29675],{"type":21,"tag":209,"props":29676,"children":29677},{"style":222},[29678],{"type":26,"value":29679},"})(jQuery, window);\n",{"type":21,"tag":22,"props":29681,"children":29682},{},[29683,29685],{"type":26,"value":29684},"The code and comments should give you a fair idea of what we're doing here - unlike the previously mentioned localForage or Dexie, we don't attempt to account for older, experimental versions of IndexedDB, or fallback to something like WebSQL. IndexedDB is the future! Maybe, probably, unless it also gets killed at some point. ",{"type":21,"tag":1084,"props":29686,"children":29687},{},[29688],{"type":26,"value":29689},"Knocks on wood",{"type":21,"tag":22,"props":29691,"children":29692},{},[29693],{"type":26,"value":29694},"We also aren't attempting to wrap everything IndexedDB can do - instead, we have a single database and objectStore into which we'll be shoving everything we intend to cache, and providing a simple wrapper around it that superficially resembles the Storage interface, with the exception that everything is asynchronous and returns a $.Deferred object.",{"type":21,"tag":22,"props":29696,"children":29697},{},[29698,29700,29707],{"type":26,"value":29699},"As a result of this setup, our actual caching logic can remain mostly the same - let's take a look and discuss what's changed (",{"type":21,"tag":29,"props":29701,"children":29704},{"href":29702,"rel":29703},"https://github.com/SaneMethod/jalic/blob/master/jquery-ajax-localstorage-indexeddb-cache.js",[93],[29705],{"type":26,"value":29706},"see the up-to-date code on Github",{"type":26,"value":29708},"):",{"type":21,"tag":200,"props":29710,"children":29712},{"className":9044,"code":29711,"language":9046,"meta":8,"style":8},"/**\n * https://github.com/SaneMethod/jalic\n */\n(function($, window){\n    /**\n     * Generate the cache key under which to store the local data - either the cache key supplied,\n     * or one generated from the url, the type and, if present, the data.\n     */\n    var genCacheKey = function (options) {\n        var url = options.url.replace(/jQuery.*/, '');\n\n        // Strip _={timestamp}, if cache is set to false\n        if (options.cache === false) {\n            url = url.replace(/([?&])_=[^&]*/, '');\n        }\n\n        return options.cacheKey || url + options.type + (options.data || '');\n    };\n\n    /**\n     * Determine whether we're using localStorage or, if the user has specified something other than a boolean\n     * value for options.localCache, whether the value appears to satisfy the plugin's requirements.\n     * Otherwise, throw a new TypeError indicating what type of value we expect.\n     * @param {boolean|object} storage\n     * @returns {boolean|object}\n     */\n    var getStorage = function(storage){\n        if (!storage) return false;\n        if (storage === true) return window.localStorage;\n        if (typeof storage === \"object\" && 'getItem' in storage &&\n            'removeItem' in storage && 'setItem' in storage)\n        {\n            return storage;\n        }\n        throw new TypeError(\"localCache must either be a boolean value, \" +\n            \"or an object which implements the Storage interface.\");\n    };\n\n    /**\n     * Remove the item specified by cacheKey from local storage (but not from the IndexedDB, as in all usages\n     * of this function we expect to overwrite the value with addToStorage shortly).\n     * @param {Storage|object} storage\n     * @param {string} cacheKey\n     */\n    var removeFromStorage = function(storage, cacheKey){\n        storage.removeItem(cacheKey);\n        storage.removeItem(cacheKey + 'cachettl');\n    };\n\n    /**\n     * Add an item to local storage and IndexedDB storage. We use local storage to satisfy our\n     * need to synchronously determine whether we have a value stored for a given key (and whether it is\n     * within the cachettl), and use IndexedDB to store the actual value associated with the key.\n     * @param {Storage|object} storage\n     * @param {string} cacheKey\n     * @param {number} ttl\n     * @param {*} data\n     * @param {string} dataType\n     * @returns {$.Deferred}\n     */\n    var addToStorage = function(storage, cacheKey, ttl, data, dataType){\n        var defer = $.Deferred();\n\n        try{\n            storage.setItem(cacheKey, 1);\n            storage.setItem(cacheKey + 'cachettl', ttl);\n        }catch(e){\n            removeFromStorage(storage, cacheKey);\n            defer.reject(e);\n\n            return defer.promise();\n        }\n\n        return $.jidb.setItem(cacheKey, data, dataType);\n    };\n\n    /**\n     * Prefilter for caching ajax calls.\n     * See also $.ajaxTransport for the elements that make this compatible with jQuery Deferred.\n     * New parameters available on the ajax call:\n     * localCache   : true              - required - either a boolean (in which case localStorage is used),\n     * or an object implementing the Storage interface, in which case that object is used instead.\n     * cacheTTL     : 5,                - optional - cache time in hours, default is 5.\n     * cacheKey     : 'myCacheKey',     - optional - key under which cached string will be stored\n     * isCacheValid : function          - optional - return true for valid, false for invalid\n     * @method $.ajaxPrefilter\n     * @param options {Object} Options for the ajax call, modified with ajax standard settings\n     */\n    $.ajaxPrefilter(function(options){\n        var storage = getStorage(options.localCache),\n            hourstl = +new Date() + 1000 * 60 * 60 * (options.cacheTTL || 5),\n            cacheKey = genCacheKey(options),\n            cacheValid = options.isCacheValid,\n            ttl,\n            value;\n\n        if (!storage) return;\n        ttl = storage.getItem(cacheKey + 'cachettl');\n\n        if (cacheValid && typeof cacheValid === 'function' && !cacheValid()){\n            removeFromStorage(storage, cacheKey);\n            ttl = 0;\n        }\n\n        if (ttl && ttl \u003C +new Date()){\n            removeFromStorage(storage, cacheKey);\n            ttl = 0;\n        }\n\n        value = storage.getItem(cacheKey);\n        if (!value){\n            // If it not in the cache, we store the data, add success callback - normal callback will proceed\n            if (options.success) {\n                options.realsuccess = options.success;\n            }\n            options.success = function(data, status, jqXHR) {\n                var dataType = this.dataType || jqXHR.getResponseHeader('Content-Type');\n\n                // Save the data to storage, catching Storage exception and IndexedDB exceptions alike\n                // and reject the returned promise as a result.\n                addToStorage(storage, cacheKey, hourstl, data, dataType).done(function(){\n                    if (options.realsuccess) options.realsuccess(data, status, jqXHR);\n                }).fail(function(event){\n                    console.log(event);\n                });\n            };\n        }\n    });\n\n    /**\n     * This function performs the fetch from cache portion of the functionality needed to cache ajax\n     * calls and still fulfill the jqXHR Deferred Promise interface.\n     * See also $.ajaxPrefilter\n     * @method $.ajaxTransport\n     * @params options {Object} Options for the ajax call, modified with ajax standard settings\n     */\n    $.ajaxTransport(\"+*\", function(options){\n        if (options.localCache)\n        {\n            var cacheKey = genCacheKey(options),\n                storage = getStorage(options.localCache),\n                value = (storage) ? storage.getItem(cacheKey) : false;\n\n            if (value){\n                /**\n                 * If the key is in the Storage-based cache, indicate that we want to handle this ajax request\n                 * (by returning a value), and use the cache key to retrieve the value from the IndexedDB. Then,\n                 * call the completeCallback with the fetched value.\n                 */\n                return {\n                    send:function(headers, completeCallback) {\n                        $.jidb.getItem(cacheKey).done(function(result){\n                            var response = {};\n                            response[result.dataType] = result.data;\n                            completeCallback(200, 'success', response, '');\n                        }).fail(function(){\n                            completeCallback(500, 'cache failure', void 0, '');\n                        });\n                    },\n                    abort:function() {\n                        console.log(\"Aborted ajax transport for caching.\");\n                    }\n                };\n            }\n        }\n    });\n})(jQuery, window);\n",[29713],{"type":21,"tag":63,"props":29714,"children":29715},{"__ignoreMap":8},[29716,29723,29731,29738,29769,29776,29783,29791,29798,29830,29891,29898,29906,29930,30007,30014,30021,30071,30078,30085,30092,30099,30106,30113,30132,30147,30154,30185,30216,30248,30295,30327,30334,30345,30352,30379,30390,30397,30404,30411,30419,30427,30446,30465,30472,30511,30526,30553,30560,30567,30574,30582,30590,30598,30617,30636,30657,30677,30696,30712,30719,30784,30811,30818,30829,30853,30881,30898,30909,30926,30933,30952,30959,30966,30987,30994,31001,31008,31016,31024,31032,31040,31048,31056,31064,31072,31089,31110,31117,31150,31174,31242,31262,31278,31285,31293,31300,31327,31362,31369,31417,31428,31447,31454,31461,31496,31507,31526,31533,31540,31563,31583,31591,31603,31620,31627,31676,31727,31734,31742,31750,31779,31801,31833,31849,31856,31863,31870,31877,31884,31891,31899,31907,31915,31931,31948,31955,31996,32008,32015,32039,32059,32105,32112,32124,32132,32140,32148,32156,32164,32175,32212,32254,32275,32292,32329,32353,32402,32410,32418,32438,32463,32470,32478,32485,32492,32499],{"type":21,"tag":209,"props":29717,"children":29718},{"class":211,"line":212},[29719],{"type":21,"tag":209,"props":29720,"children":29721},{"style":448},[29722],{"type":26,"value":731},{"type":21,"tag":209,"props":29724,"children":29725},{"class":211,"line":244},[29726],{"type":21,"tag":209,"props":29727,"children":29728},{"style":448},[29729],{"type":26,"value":29730}," * https://github.com/SaneMethod/jalic\n",{"type":21,"tag":209,"props":29732,"children":29733},{"class":211,"line":254},[29734],{"type":21,"tag":209,"props":29735,"children":29736},{"style":448},[29737],{"type":26,"value":755},{"type":21,"tag":209,"props":29739,"children":29740},{"class":211,"line":279},[29741,29745,29749,29753,29757,29761,29765],{"type":21,"tag":209,"props":29742,"children":29743},{"style":222},[29744],{"type":26,"value":368},{"type":21,"tag":209,"props":29746,"children":29747},{"style":216},[29748],{"type":26,"value":5370},{"type":21,"tag":209,"props":29750,"children":29751},{"style":222},[29752],{"type":26,"value":368},{"type":21,"tag":209,"props":29754,"children":29755},{"style":400},[29756],{"type":26,"value":10250},{"type":21,"tag":209,"props":29758,"children":29759},{"style":222},[29760],{"type":26,"value":408},{"type":21,"tag":209,"props":29762,"children":29763},{"style":400},[29764],{"type":26,"value":10393},{"type":21,"tag":209,"props":29766,"children":29767},{"style":222},[29768],{"type":26,"value":2369},{"type":21,"tag":209,"props":29770,"children":29771},{"class":211,"line":288},[29772],{"type":21,"tag":209,"props":29773,"children":29774},{"style":448},[29775],{"type":26,"value":4697},{"type":21,"tag":209,"props":29777,"children":29778},{"class":211,"line":307},[29779],{"type":21,"tag":209,"props":29780,"children":29781},{"style":448},[29782],{"type":26,"value":15087},{"type":21,"tag":209,"props":29784,"children":29785},{"class":211,"line":325},[29786],{"type":21,"tag":209,"props":29787,"children":29788},{"style":448},[29789],{"type":26,"value":29790},"     * or one generated from the url, the type and, if present, the data.\n",{"type":21,"tag":209,"props":29792,"children":29793},{"class":211,"line":334},[29794],{"type":21,"tag":209,"props":29795,"children":29796},{"style":448},[29797],{"type":26,"value":4753},{"type":21,"tag":209,"props":29799,"children":29800},{"class":211,"line":343},[29801,29805,29809,29813,29817,29821,29826],{"type":21,"tag":209,"props":29802,"children":29803},{"style":216},[29804],{"type":26,"value":10405},{"type":21,"tag":209,"props":29806,"children":29807},{"style":360},[29808],{"type":26,"value":15138},{"type":21,"tag":209,"props":29810,"children":29811},{"style":216},[29812],{"type":26,"value":271},{"type":21,"tag":209,"props":29814,"children":29815},{"style":216},[29816],{"type":26,"value":4766},{"type":21,"tag":209,"props":29818,"children":29819},{"style":222},[29820],{"type":26,"value":4776},{"type":21,"tag":209,"props":29822,"children":29823},{"style":400},[29824],{"type":26,"value":29825},"options",{"type":21,"tag":209,"props":29827,"children":29828},{"style":222},[29829],{"type":26,"value":4786},{"type":21,"tag":209,"props":29831,"children":29832},{"class":211,"line":351},[29833,29837,29841,29845,29850,29855,29859,29863,29867,29871,29875,29879,29883,29887],{"type":21,"tag":209,"props":29834,"children":29835},{"style":216},[29836],{"type":26,"value":5925},{"type":21,"tag":209,"props":29838,"children":29839},{"style":222},[29840],{"type":26,"value":15277},{"type":21,"tag":209,"props":29842,"children":29843},{"style":216},[29844],{"type":26,"value":1432},{"type":21,"tag":209,"props":29846,"children":29847},{"style":222},[29848],{"type":26,"value":29849}," options.url.",{"type":21,"tag":209,"props":29851,"children":29852},{"style":360},[29853],{"type":26,"value":29854},"replace",{"type":21,"tag":209,"props":29856,"children":29857},{"style":222},[29858],{"type":26,"value":368},{"type":21,"tag":209,"props":29860,"children":29861},{"style":233},[29862],{"type":26,"value":9749},{"type":21,"tag":209,"props":29864,"children":29865},{"style":10204},[29866],{"type":26,"value":17958},{"type":21,"tag":209,"props":29868,"children":29869},{"style":263},[29870],{"type":26,"value":378},{"type":21,"tag":209,"props":29872,"children":29873},{"style":216},[29874],{"type":26,"value":944},{"type":21,"tag":209,"props":29876,"children":29877},{"style":233},[29878],{"type":26,"value":9749},{"type":21,"tag":209,"props":29880,"children":29881},{"style":222},[29882],{"type":26,"value":408},{"type":21,"tag":209,"props":29884,"children":29885},{"style":233},[29886],{"type":26,"value":20111},{"type":21,"tag":209,"props":29888,"children":29889},{"style":222},[29890],{"type":26,"value":2608},{"type":21,"tag":209,"props":29892,"children":29893},{"class":211,"line":444},[29894],{"type":21,"tag":209,"props":29895,"children":29896},{"emptyLinePlaceholder":248},[29897],{"type":26,"value":251},{"type":21,"tag":209,"props":29899,"children":29900},{"class":211,"line":454},[29901],{"type":21,"tag":209,"props":29902,"children":29903},{"style":448},[29904],{"type":26,"value":29905},"        // Strip _={timestamp}, if cache is set to false\n",{"type":21,"tag":209,"props":29907,"children":29908},{"class":211,"line":463},[29909,29913,29918,29922,29926],{"type":21,"tag":209,"props":29910,"children":29911},{"style":216},[29912],{"type":26,"value":5803},{"type":21,"tag":209,"props":29914,"children":29915},{"style":222},[29916],{"type":26,"value":29917}," (options.cache ",{"type":21,"tag":209,"props":29919,"children":29920},{"style":216},[29921],{"type":26,"value":6102},{"type":21,"tag":209,"props":29923,"children":29924},{"style":263},[29925],{"type":26,"value":5455},{"type":21,"tag":209,"props":29927,"children":29928},{"style":222},[29929],{"type":26,"value":4786},{"type":21,"tag":209,"props":29931,"children":29932},{"class":211,"line":472},[29933,29938,29942,29947,29951,29955,29959,29963,29968,29973,29978,29982,29987,29991,29995,29999,30003],{"type":21,"tag":209,"props":29934,"children":29935},{"style":222},[29936],{"type":26,"value":29937},"            url ",{"type":21,"tag":209,"props":29939,"children":29940},{"style":216},[29941],{"type":26,"value":1432},{"type":21,"tag":209,"props":29943,"children":29944},{"style":222},[29945],{"type":26,"value":29946}," url.",{"type":21,"tag":209,"props":29948,"children":29949},{"style":360},[29950],{"type":26,"value":29854},{"type":21,"tag":209,"props":29952,"children":29953},{"style":222},[29954],{"type":26,"value":368},{"type":21,"tag":209,"props":29956,"children":29957},{"style":233},[29958],{"type":26,"value":9749},{"type":21,"tag":209,"props":29960,"children":29961},{"style":10204},[29962],{"type":26,"value":368},{"type":21,"tag":209,"props":29964,"children":29965},{"style":263},[29966],{"type":26,"value":29967},"[?&]",{"type":21,"tag":209,"props":29969,"children":29970},{"style":10204},[29971],{"type":26,"value":29972},")_=",{"type":21,"tag":209,"props":29974,"children":29975},{"style":263},[29976],{"type":26,"value":29977},"[",{"type":21,"tag":209,"props":29979,"children":29980},{"style":216},[29981],{"type":26,"value":10201},{"type":21,"tag":209,"props":29983,"children":29984},{"style":263},[29985],{"type":26,"value":29986},"&]",{"type":21,"tag":209,"props":29988,"children":29989},{"style":216},[29990],{"type":26,"value":944},{"type":21,"tag":209,"props":29992,"children":29993},{"style":233},[29994],{"type":26,"value":9749},{"type":21,"tag":209,"props":29996,"children":29997},{"style":222},[29998],{"type":26,"value":408},{"type":21,"tag":209,"props":30000,"children":30001},{"style":233},[30002],{"type":26,"value":20111},{"type":21,"tag":209,"props":30004,"children":30005},{"style":222},[30006],{"type":26,"value":2608},{"type":21,"tag":209,"props":30008,"children":30009},{"class":211,"line":480},[30010],{"type":21,"tag":209,"props":30011,"children":30012},{"style":222},[30013],{"type":26,"value":2235},{"type":21,"tag":209,"props":30015,"children":30016},{"class":211,"line":489},[30017],{"type":21,"tag":209,"props":30018,"children":30019},{"emptyLinePlaceholder":248},[30020],{"type":26,"value":251},{"type":21,"tag":209,"props":30022,"children":30023},{"class":211,"line":847},[30024,30028,30033,30037,30041,30045,30050,30054,30059,30063,30067],{"type":21,"tag":209,"props":30025,"children":30026},{"style":216},[30027],{"type":26,"value":3069},{"type":21,"tag":209,"props":30029,"children":30030},{"style":222},[30031],{"type":26,"value":30032}," options.cacheKey ",{"type":21,"tag":209,"props":30034,"children":30035},{"style":216},[30036],{"type":26,"value":4677},{"type":21,"tag":209,"props":30038,"children":30039},{"style":222},[30040],{"type":26,"value":15277},{"type":21,"tag":209,"props":30042,"children":30043},{"style":216},[30044],{"type":26,"value":10237},{"type":21,"tag":209,"props":30046,"children":30047},{"style":222},[30048],{"type":26,"value":30049}," options.type ",{"type":21,"tag":209,"props":30051,"children":30052},{"style":216},[30053],{"type":26,"value":10237},{"type":21,"tag":209,"props":30055,"children":30056},{"style":222},[30057],{"type":26,"value":30058}," (options.data ",{"type":21,"tag":209,"props":30060,"children":30061},{"style":216},[30062],{"type":26,"value":4677},{"type":21,"tag":209,"props":30064,"children":30065},{"style":233},[30066],{"type":26,"value":15295},{"type":21,"tag":209,"props":30068,"children":30069},{"style":222},[30070],{"type":26,"value":2608},{"type":21,"tag":209,"props":30072,"children":30073},{"class":211,"line":860},[30074],{"type":21,"tag":209,"props":30075,"children":30076},{"style":222},[30077],{"type":26,"value":4850},{"type":21,"tag":209,"props":30079,"children":30080},{"class":211,"line":877},[30081],{"type":21,"tag":209,"props":30082,"children":30083},{"emptyLinePlaceholder":248},[30084],{"type":26,"value":251},{"type":21,"tag":209,"props":30086,"children":30087},{"class":211,"line":889},[30088],{"type":21,"tag":209,"props":30089,"children":30090},{"style":448},[30091],{"type":26,"value":4697},{"type":21,"tag":209,"props":30093,"children":30094},{"class":211,"line":902},[30095],{"type":21,"tag":209,"props":30096,"children":30097},{"style":448},[30098],{"type":26,"value":15349},{"type":21,"tag":209,"props":30100,"children":30101},{"class":211,"line":914},[30102],{"type":21,"tag":209,"props":30103,"children":30104},{"style":448},[30105],{"type":26,"value":15357},{"type":21,"tag":209,"props":30107,"children":30108},{"class":211,"line":922},[30109],{"type":21,"tag":209,"props":30110,"children":30111},{"style":448},[30112],{"type":26,"value":15365},{"type":21,"tag":209,"props":30114,"children":30115},{"class":211,"line":2312},[30116,30120,30124,30128],{"type":21,"tag":209,"props":30117,"children":30118},{"style":448},[30119],{"type":26,"value":4713},{"type":21,"tag":209,"props":30121,"children":30122},{"style":216},[30123],{"type":26,"value":4718},{"type":21,"tag":209,"props":30125,"children":30126},{"style":360},[30127],{"type":26,"value":15388},{"type":21,"tag":209,"props":30129,"children":30130},{"style":222},[30131],{"type":26,"value":15393},{"type":21,"tag":209,"props":30133,"children":30134},{"class":211,"line":2321},[30135,30139,30143],{"type":21,"tag":209,"props":30136,"children":30137},{"style":448},[30138],{"type":26,"value":4713},{"type":21,"tag":209,"props":30140,"children":30141},{"style":216},[30142],{"type":26,"value":4740},{"type":21,"tag":209,"props":30144,"children":30145},{"style":360},[30146],{"type":26,"value":15409},{"type":21,"tag":209,"props":30148,"children":30149},{"class":211,"line":2372},[30150],{"type":21,"tag":209,"props":30151,"children":30152},{"style":448},[30153],{"type":26,"value":4753},{"type":21,"tag":209,"props":30155,"children":30156},{"class":211,"line":2381},[30157,30161,30165,30169,30173,30177,30181],{"type":21,"tag":209,"props":30158,"children":30159},{"style":216},[30160],{"type":26,"value":10405},{"type":21,"tag":209,"props":30162,"children":30163},{"style":360},[30164],{"type":26,"value":15428},{"type":21,"tag":209,"props":30166,"children":30167},{"style":216},[30168],{"type":26,"value":271},{"type":21,"tag":209,"props":30170,"children":30171},{"style":216},[30172],{"type":26,"value":4766},{"type":21,"tag":209,"props":30174,"children":30175},{"style":222},[30176],{"type":26,"value":368},{"type":21,"tag":209,"props":30178,"children":30179},{"style":400},[30180],{"type":26,"value":14166},{"type":21,"tag":209,"props":30182,"children":30183},{"style":222},[30184],{"type":26,"value":2369},{"type":21,"tag":209,"props":30186,"children":30187},{"class":211,"line":2389},[30188,30192,30196,30200,30204,30208,30212],{"type":21,"tag":209,"props":30189,"children":30190},{"style":216},[30191],{"type":26,"value":5803},{"type":21,"tag":209,"props":30193,"children":30194},{"style":222},[30195],{"type":26,"value":4776},{"type":21,"tag":209,"props":30197,"children":30198},{"style":216},[30199],{"type":26,"value":15052},{"type":21,"tag":209,"props":30201,"children":30202},{"style":222},[30203],{"type":26,"value":15460},{"type":21,"tag":209,"props":30205,"children":30206},{"style":216},[30207],{"type":26,"value":5813},{"type":21,"tag":209,"props":30209,"children":30210},{"style":263},[30211],{"type":26,"value":5455},{"type":21,"tag":209,"props":30213,"children":30214},{"style":222},[30215],{"type":26,"value":241},{"type":21,"tag":209,"props":30217,"children":30218},{"class":211,"line":2397},[30219,30223,30227,30231,30235,30239,30243],{"type":21,"tag":209,"props":30220,"children":30221},{"style":216},[30222],{"type":26,"value":5803},{"type":21,"tag":209,"props":30224,"children":30225},{"style":222},[30226],{"type":26,"value":15484},{"type":21,"tag":209,"props":30228,"children":30229},{"style":216},[30230],{"type":26,"value":6102},{"type":21,"tag":209,"props":30232,"children":30233},{"style":263},[30234],{"type":26,"value":6243},{"type":21,"tag":209,"props":30236,"children":30237},{"style":222},[30238],{"type":26,"value":432},{"type":21,"tag":209,"props":30240,"children":30241},{"style":216},[30242],{"type":26,"value":5813},{"type":21,"tag":209,"props":30244,"children":30245},{"style":222},[30246],{"type":26,"value":30247}," window.localStorage;\n",{"type":21,"tag":209,"props":30249,"children":30250},{"class":211,"line":2406},[30251,30255,30259,30263,30267,30271,30275,30279,30283,30287,30291],{"type":21,"tag":209,"props":30252,"children":30253},{"style":216},[30254],{"type":26,"value":5803},{"type":21,"tag":209,"props":30256,"children":30257},{"style":222},[30258],{"type":26,"value":4776},{"type":21,"tag":209,"props":30260,"children":30261},{"style":216},[30262],{"type":26,"value":6092},{"type":21,"tag":209,"props":30264,"children":30265},{"style":222},[30266],{"type":26,"value":15525},{"type":21,"tag":209,"props":30268,"children":30269},{"style":216},[30270],{"type":26,"value":6102},{"type":21,"tag":209,"props":30272,"children":30273},{"style":233},[30274],{"type":26,"value":15534},{"type":21,"tag":209,"props":30276,"children":30277},{"style":216},[30278],{"type":26,"value":15539},{"type":21,"tag":209,"props":30280,"children":30281},{"style":233},[30282],{"type":26,"value":15544},{"type":21,"tag":209,"props":30284,"children":30285},{"style":216},[30286],{"type":26,"value":10867},{"type":21,"tag":209,"props":30288,"children":30289},{"style":222},[30290],{"type":26,"value":15525},{"type":21,"tag":209,"props":30292,"children":30293},{"style":216},[30294],{"type":26,"value":15557},{"type":21,"tag":209,"props":30296,"children":30297},{"class":211,"line":2415},[30298,30302,30306,30310,30314,30318,30322],{"type":21,"tag":209,"props":30299,"children":30300},{"style":233},[30301],{"type":26,"value":15565},{"type":21,"tag":209,"props":30303,"children":30304},{"style":216},[30305],{"type":26,"value":10867},{"type":21,"tag":209,"props":30307,"children":30308},{"style":222},[30309],{"type":26,"value":15525},{"type":21,"tag":209,"props":30311,"children":30312},{"style":216},[30313],{"type":26,"value":15578},{"type":21,"tag":209,"props":30315,"children":30316},{"style":233},[30317],{"type":26,"value":15583},{"type":21,"tag":209,"props":30319,"children":30320},{"style":216},[30321],{"type":26,"value":10867},{"type":21,"tag":209,"props":30323,"children":30324},{"style":222},[30325],{"type":26,"value":30326}," storage)\n",{"type":21,"tag":209,"props":30328,"children":30329},{"class":211,"line":2424},[30330],{"type":21,"tag":209,"props":30331,"children":30332},{"style":222},[30333],{"type":26,"value":7561},{"type":21,"tag":209,"props":30335,"children":30336},{"class":211,"line":2433},[30337,30341],{"type":21,"tag":209,"props":30338,"children":30339},{"style":216},[30340],{"type":26,"value":5101},{"type":21,"tag":209,"props":30342,"children":30343},{"style":222},[30344],{"type":26,"value":15604},{"type":21,"tag":209,"props":30346,"children":30347},{"class":211,"line":2442},[30348],{"type":21,"tag":209,"props":30349,"children":30350},{"style":222},[30351],{"type":26,"value":2235},{"type":21,"tag":209,"props":30353,"children":30354},{"class":211,"line":2471},[30355,30359,30363,30367,30371,30375],{"type":21,"tag":209,"props":30356,"children":30357},{"style":216},[30358],{"type":26,"value":15619},{"type":21,"tag":209,"props":30360,"children":30361},{"style":216},[30362],{"type":26,"value":4667},{"type":21,"tag":209,"props":30364,"children":30365},{"style":360},[30366],{"type":26,"value":15628},{"type":21,"tag":209,"props":30368,"children":30369},{"style":222},[30370],{"type":26,"value":368},{"type":21,"tag":209,"props":30372,"children":30373},{"style":233},[30374],{"type":26,"value":15637},{"type":21,"tag":209,"props":30376,"children":30377},{"style":216},[30378],{"type":26,"value":15642},{"type":21,"tag":209,"props":30380,"children":30381},{"class":211,"line":2480},[30382,30386],{"type":21,"tag":209,"props":30383,"children":30384},{"style":233},[30385],{"type":26,"value":15650},{"type":21,"tag":209,"props":30387,"children":30388},{"style":222},[30389],{"type":26,"value":2608},{"type":21,"tag":209,"props":30391,"children":30392},{"class":211,"line":2489},[30393],{"type":21,"tag":209,"props":30394,"children":30395},{"style":222},[30396],{"type":26,"value":4850},{"type":21,"tag":209,"props":30398,"children":30399},{"class":211,"line":2516},[30400],{"type":21,"tag":209,"props":30401,"children":30402},{"emptyLinePlaceholder":248},[30403],{"type":26,"value":251},{"type":21,"tag":209,"props":30405,"children":30406},{"class":211,"line":2525},[30407],{"type":21,"tag":209,"props":30408,"children":30409},{"style":448},[30410],{"type":26,"value":4697},{"type":21,"tag":209,"props":30412,"children":30413},{"class":211,"line":2533},[30414],{"type":21,"tag":209,"props":30415,"children":30416},{"style":448},[30417],{"type":26,"value":30418},"     * Remove the item specified by cacheKey from local storage (but not from the IndexedDB, as in all usages\n",{"type":21,"tag":209,"props":30420,"children":30421},{"class":211,"line":2542},[30422],{"type":21,"tag":209,"props":30423,"children":30424},{"style":448},[30425],{"type":26,"value":30426},"     * of this function we expect to overwrite the value with addToStorage shortly).\n",{"type":21,"tag":209,"props":30428,"children":30429},{"class":211,"line":2550},[30430,30434,30438,30442],{"type":21,"tag":209,"props":30431,"children":30432},{"style":448},[30433],{"type":26,"value":4713},{"type":21,"tag":209,"props":30435,"children":30436},{"style":216},[30437],{"type":26,"value":4718},{"type":21,"tag":209,"props":30439,"children":30440},{"style":360},[30441],{"type":26,"value":15706},{"type":21,"tag":209,"props":30443,"children":30444},{"style":222},[30445],{"type":26,"value":15393},{"type":21,"tag":209,"props":30447,"children":30448},{"class":211,"line":2564},[30449,30453,30457,30461],{"type":21,"tag":209,"props":30450,"children":30451},{"style":448},[30452],{"type":26,"value":4713},{"type":21,"tag":209,"props":30454,"children":30455},{"style":216},[30456],{"type":26,"value":4718},{"type":21,"tag":209,"props":30458,"children":30459},{"style":360},[30460],{"type":26,"value":4723},{"type":21,"tag":209,"props":30462,"children":30463},{"style":222},[30464],{"type":26,"value":15730},{"type":21,"tag":209,"props":30466,"children":30467},{"class":211,"line":2611},[30468],{"type":21,"tag":209,"props":30469,"children":30470},{"style":448},[30471],{"type":26,"value":4753},{"type":21,"tag":209,"props":30473,"children":30474},{"class":211,"line":2619},[30475,30479,30483,30487,30491,30495,30499,30503,30507],{"type":21,"tag":209,"props":30476,"children":30477},{"style":216},[30478],{"type":26,"value":10405},{"type":21,"tag":209,"props":30480,"children":30481},{"style":360},[30482],{"type":26,"value":15749},{"type":21,"tag":209,"props":30484,"children":30485},{"style":216},[30486],{"type":26,"value":271},{"type":21,"tag":209,"props":30488,"children":30489},{"style":216},[30490],{"type":26,"value":4766},{"type":21,"tag":209,"props":30492,"children":30493},{"style":222},[30494],{"type":26,"value":368},{"type":21,"tag":209,"props":30496,"children":30497},{"style":400},[30498],{"type":26,"value":14166},{"type":21,"tag":209,"props":30500,"children":30501},{"style":222},[30502],{"type":26,"value":408},{"type":21,"tag":209,"props":30504,"children":30505},{"style":400},[30506],{"type":26,"value":14157},{"type":21,"tag":209,"props":30508,"children":30509},{"style":222},[30510],{"type":26,"value":2369},{"type":21,"tag":209,"props":30512,"children":30513},{"class":211,"line":2627},[30514,30518,30522],{"type":21,"tag":209,"props":30515,"children":30516},{"style":222},[30517],{"type":26,"value":15777},{"type":21,"tag":209,"props":30519,"children":30520},{"style":360},[30521],{"type":26,"value":15782},{"type":21,"tag":209,"props":30523,"children":30524},{"style":222},[30525],{"type":26,"value":15787},{"type":21,"tag":209,"props":30527,"children":30528},{"class":211,"line":2636},[30529,30533,30537,30541,30545,30549],{"type":21,"tag":209,"props":30530,"children":30531},{"style":222},[30532],{"type":26,"value":15777},{"type":21,"tag":209,"props":30534,"children":30535},{"style":360},[30536],{"type":26,"value":15782},{"type":21,"tag":209,"props":30538,"children":30539},{"style":222},[30540],{"type":26,"value":14365},{"type":21,"tag":209,"props":30542,"children":30543},{"style":216},[30544],{"type":26,"value":10237},{"type":21,"tag":209,"props":30546,"children":30547},{"style":233},[30548],{"type":26,"value":14374},{"type":21,"tag":209,"props":30550,"children":30551},{"style":222},[30552],{"type":26,"value":2608},{"type":21,"tag":209,"props":30554,"children":30555},{"class":211,"line":2644},[30556],{"type":21,"tag":209,"props":30557,"children":30558},{"style":222},[30559],{"type":26,"value":4850},{"type":21,"tag":209,"props":30561,"children":30562},{"class":211,"line":2657},[30563],{"type":21,"tag":209,"props":30564,"children":30565},{"emptyLinePlaceholder":248},[30566],{"type":26,"value":251},{"type":21,"tag":209,"props":30568,"children":30569},{"class":211,"line":2728},[30570],{"type":21,"tag":209,"props":30571,"children":30572},{"style":448},[30573],{"type":26,"value":4697},{"type":21,"tag":209,"props":30575,"children":30576},{"class":211,"line":2758},[30577],{"type":21,"tag":209,"props":30578,"children":30579},{"style":448},[30580],{"type":26,"value":30581},"     * Add an item to local storage and IndexedDB storage. We use local storage to satisfy our\n",{"type":21,"tag":209,"props":30583,"children":30584},{"class":211,"line":2776},[30585],{"type":21,"tag":209,"props":30586,"children":30587},{"style":448},[30588],{"type":26,"value":30589},"     * need to synchronously determine whether we have a value stored for a given key (and whether it is\n",{"type":21,"tag":209,"props":30591,"children":30592},{"class":211,"line":2785},[30593],{"type":21,"tag":209,"props":30594,"children":30595},{"style":448},[30596],{"type":26,"value":30597},"     * within the cachettl), and use IndexedDB to store the actual value associated with the key.\n",{"type":21,"tag":209,"props":30599,"children":30600},{"class":211,"line":2793},[30601,30605,30609,30613],{"type":21,"tag":209,"props":30602,"children":30603},{"style":448},[30604],{"type":26,"value":4713},{"type":21,"tag":209,"props":30606,"children":30607},{"style":216},[30608],{"type":26,"value":4718},{"type":21,"tag":209,"props":30610,"children":30611},{"style":360},[30612],{"type":26,"value":15706},{"type":21,"tag":209,"props":30614,"children":30615},{"style":222},[30616],{"type":26,"value":15393},{"type":21,"tag":209,"props":30618,"children":30619},{"class":211,"line":2801},[30620,30624,30628,30632],{"type":21,"tag":209,"props":30621,"children":30622},{"style":448},[30623],{"type":26,"value":4713},{"type":21,"tag":209,"props":30625,"children":30626},{"style":216},[30627],{"type":26,"value":4718},{"type":21,"tag":209,"props":30629,"children":30630},{"style":360},[30631],{"type":26,"value":4723},{"type":21,"tag":209,"props":30633,"children":30634},{"style":222},[30635],{"type":26,"value":15730},{"type":21,"tag":209,"props":30637,"children":30638},{"class":211,"line":2809},[30639,30643,30647,30652],{"type":21,"tag":209,"props":30640,"children":30641},{"style":448},[30642],{"type":26,"value":4713},{"type":21,"tag":209,"props":30644,"children":30645},{"style":216},[30646],{"type":26,"value":4718},{"type":21,"tag":209,"props":30648,"children":30649},{"style":360},[30650],{"type":26,"value":30651}," {number}",{"type":21,"tag":209,"props":30653,"children":30654},{"style":222},[30655],{"type":26,"value":30656}," ttl\n",{"type":21,"tag":209,"props":30658,"children":30659},{"class":211,"line":6219},[30660,30664,30668,30673],{"type":21,"tag":209,"props":30661,"children":30662},{"style":448},[30663],{"type":26,"value":4713},{"type":21,"tag":209,"props":30665,"children":30666},{"style":216},[30667],{"type":26,"value":4718},{"type":21,"tag":209,"props":30669,"children":30670},{"style":360},[30671],{"type":26,"value":30672}," {*}",{"type":21,"tag":209,"props":30674,"children":30675},{"style":222},[30676],{"type":26,"value":27972},{"type":21,"tag":209,"props":30678,"children":30679},{"class":211,"line":6228},[30680,30684,30688,30692],{"type":21,"tag":209,"props":30681,"children":30682},{"style":448},[30683],{"type":26,"value":4713},{"type":21,"tag":209,"props":30685,"children":30686},{"style":216},[30687],{"type":26,"value":4718},{"type":21,"tag":209,"props":30689,"children":30690},{"style":360},[30691],{"type":26,"value":4723},{"type":21,"tag":209,"props":30693,"children":30694},{"style":222},[30695],{"type":26,"value":14651},{"type":21,"tag":209,"props":30697,"children":30698},{"class":211,"line":6250},[30699,30703,30707],{"type":21,"tag":209,"props":30700,"children":30701},{"style":448},[30702],{"type":26,"value":4713},{"type":21,"tag":209,"props":30704,"children":30705},{"style":216},[30706],{"type":26,"value":4740},{"type":21,"tag":209,"props":30708,"children":30709},{"style":360},[30710],{"type":26,"value":30711}," {$.Deferred}\n",{"type":21,"tag":209,"props":30713,"children":30714},{"class":211,"line":6258},[30715],{"type":21,"tag":209,"props":30716,"children":30717},{"style":448},[30718],{"type":26,"value":4753},{"type":21,"tag":209,"props":30720,"children":30721},{"class":211,"line":6267},[30722,30726,30731,30735,30739,30743,30747,30751,30755,30759,30764,30768,30772,30776,30780],{"type":21,"tag":209,"props":30723,"children":30724},{"style":216},[30725],{"type":26,"value":10405},{"type":21,"tag":209,"props":30727,"children":30728},{"style":360},[30729],{"type":26,"value":30730}," addToStorage",{"type":21,"tag":209,"props":30732,"children":30733},{"style":216},[30734],{"type":26,"value":271},{"type":21,"tag":209,"props":30736,"children":30737},{"style":216},[30738],{"type":26,"value":4766},{"type":21,"tag":209,"props":30740,"children":30741},{"style":222},[30742],{"type":26,"value":368},{"type":21,"tag":209,"props":30744,"children":30745},{"style":400},[30746],{"type":26,"value":14166},{"type":21,"tag":209,"props":30748,"children":30749},{"style":222},[30750],{"type":26,"value":408},{"type":21,"tag":209,"props":30752,"children":30753},{"style":400},[30754],{"type":26,"value":14157},{"type":21,"tag":209,"props":30756,"children":30757},{"style":222},[30758],{"type":26,"value":408},{"type":21,"tag":209,"props":30760,"children":30761},{"style":400},[30762],{"type":26,"value":30763},"ttl",{"type":21,"tag":209,"props":30765,"children":30766},{"style":222},[30767],{"type":26,"value":408},{"type":21,"tag":209,"props":30769,"children":30770},{"style":400},[30771],{"type":26,"value":2863},{"type":21,"tag":209,"props":30773,"children":30774},{"style":222},[30775],{"type":26,"value":408},{"type":21,"tag":209,"props":30777,"children":30778},{"style":400},[30779],{"type":26,"value":14704},{"type":21,"tag":209,"props":30781,"children":30782},{"style":222},[30783],{"type":26,"value":2369},{"type":21,"tag":209,"props":30785,"children":30786},{"class":211,"line":6303},[30787,30791,30795,30799,30803,30807],{"type":21,"tag":209,"props":30788,"children":30789},{"style":216},[30790],{"type":26,"value":5925},{"type":21,"tag":209,"props":30792,"children":30793},{"style":222},[30794],{"type":26,"value":28080},{"type":21,"tag":209,"props":30796,"children":30797},{"style":216},[30798],{"type":26,"value":1432},{"type":21,"tag":209,"props":30800,"children":30801},{"style":222},[30802],{"type":26,"value":26905},{"type":21,"tag":209,"props":30804,"children":30805},{"style":360},[30806],{"type":26,"value":26910},{"type":21,"tag":209,"props":30808,"children":30809},{"style":222},[30810],{"type":26,"value":4842},{"type":21,"tag":209,"props":30812,"children":30813},{"class":211,"line":6336},[30814],{"type":21,"tag":209,"props":30815,"children":30816},{"emptyLinePlaceholder":248},[30817],{"type":26,"value":251},{"type":21,"tag":209,"props":30819,"children":30820},{"class":211,"line":6369},[30821,30825],{"type":21,"tag":209,"props":30822,"children":30823},{"style":216},[30824],{"type":26,"value":6775},{"type":21,"tag":209,"props":30826,"children":30827},{"style":222},[30828],{"type":26,"value":7414},{"type":21,"tag":209,"props":30830,"children":30831},{"class":211,"line":6378},[30832,30836,30840,30845,30849],{"type":21,"tag":209,"props":30833,"children":30834},{"style":222},[30835],{"type":26,"value":14339},{"type":21,"tag":209,"props":30837,"children":30838},{"style":360},[30839],{"type":26,"value":14344},{"type":21,"tag":209,"props":30841,"children":30842},{"style":222},[30843],{"type":26,"value":30844},"(cacheKey, ",{"type":21,"tag":209,"props":30846,"children":30847},{"style":263},[30848],{"type":26,"value":3224},{"type":21,"tag":209,"props":30850,"children":30851},{"style":222},[30852],{"type":26,"value":2608},{"type":21,"tag":209,"props":30854,"children":30855},{"class":211,"line":6387},[30856,30860,30864,30868,30872,30876],{"type":21,"tag":209,"props":30857,"children":30858},{"style":222},[30859],{"type":26,"value":14339},{"type":21,"tag":209,"props":30861,"children":30862},{"style":360},[30863],{"type":26,"value":14344},{"type":21,"tag":209,"props":30865,"children":30866},{"style":222},[30867],{"type":26,"value":14365},{"type":21,"tag":209,"props":30869,"children":30870},{"style":216},[30871],{"type":26,"value":10237},{"type":21,"tag":209,"props":30873,"children":30874},{"style":233},[30875],{"type":26,"value":14374},{"type":21,"tag":209,"props":30877,"children":30878},{"style":222},[30879],{"type":26,"value":30880},", ttl);\n",{"type":21,"tag":209,"props":30882,"children":30883},{"class":211,"line":6395},[30884,30889,30893],{"type":21,"tag":209,"props":30885,"children":30886},{"style":222},[30887],{"type":26,"value":30888},"        }",{"type":21,"tag":209,"props":30890,"children":30891},{"style":216},[30892],{"type":26,"value":6823},{"type":21,"tag":209,"props":30894,"children":30895},{"style":222},[30896],{"type":26,"value":30897},"(e){\n",{"type":21,"tag":209,"props":30899,"children":30900},{"class":211,"line":6404},[30901,30905],{"type":21,"tag":209,"props":30902,"children":30903},{"style":360},[30904],{"type":26,"value":14489},{"type":21,"tag":209,"props":30906,"children":30907},{"style":222},[30908],{"type":26,"value":14494},{"type":21,"tag":209,"props":30910,"children":30911},{"class":211,"line":6413},[30912,30917,30921],{"type":21,"tag":209,"props":30913,"children":30914},{"style":222},[30915],{"type":26,"value":30916},"            defer.",{"type":21,"tag":209,"props":30918,"children":30919},{"style":360},[30920],{"type":26,"value":5599},{"type":21,"tag":209,"props":30922,"children":30923},{"style":222},[30924],{"type":26,"value":30925},"(e);\n",{"type":21,"tag":209,"props":30927,"children":30928},{"class":211,"line":6447},[30929],{"type":21,"tag":209,"props":30930,"children":30931},{"emptyLinePlaceholder":248},[30932],{"type":26,"value":251},{"type":21,"tag":209,"props":30934,"children":30935},{"class":211,"line":6479},[30936,30940,30944,30948],{"type":21,"tag":209,"props":30937,"children":30938},{"style":216},[30939],{"type":26,"value":5101},{"type":21,"tag":209,"props":30941,"children":30942},{"style":222},[30943],{"type":26,"value":28259},{"type":21,"tag":209,"props":30945,"children":30946},{"style":360},[30947],{"type":26,"value":27809},{"type":21,"tag":209,"props":30949,"children":30950},{"style":222},[30951],{"type":26,"value":4842},{"type":21,"tag":209,"props":30953,"children":30954},{"class":211,"line":6511},[30955],{"type":21,"tag":209,"props":30956,"children":30957},{"style":222},[30958],{"type":26,"value":2235},{"type":21,"tag":209,"props":30960,"children":30961},{"class":211,"line":6519},[30962],{"type":21,"tag":209,"props":30963,"children":30964},{"emptyLinePlaceholder":248},[30965],{"type":26,"value":251},{"type":21,"tag":209,"props":30967,"children":30968},{"class":211,"line":6527},[30969,30973,30978,30982],{"type":21,"tag":209,"props":30970,"children":30971},{"style":216},[30972],{"type":26,"value":3069},{"type":21,"tag":209,"props":30974,"children":30975},{"style":222},[30976],{"type":26,"value":30977}," $.jidb.",{"type":21,"tag":209,"props":30979,"children":30980},{"style":360},[30981],{"type":26,"value":14344},{"type":21,"tag":209,"props":30983,"children":30984},{"style":222},[30985],{"type":26,"value":30986},"(cacheKey, data, dataType);\n",{"type":21,"tag":209,"props":30988,"children":30989},{"class":211,"line":6535},[30990],{"type":21,"tag":209,"props":30991,"children":30992},{"style":222},[30993],{"type":26,"value":4850},{"type":21,"tag":209,"props":30995,"children":30996},{"class":211,"line":6543},[30997],{"type":21,"tag":209,"props":30998,"children":30999},{"emptyLinePlaceholder":248},[31000],{"type":26,"value":251},{"type":21,"tag":209,"props":31002,"children":31003},{"class":211,"line":6552},[31004],{"type":21,"tag":209,"props":31005,"children":31006},{"style":448},[31007],{"type":26,"value":4697},{"type":21,"tag":209,"props":31009,"children":31010},{"class":211,"line":6572},[31011],{"type":21,"tag":209,"props":31012,"children":31013},{"style":448},[31014],{"type":26,"value":31015},"     * Prefilter for caching ajax calls.\n",{"type":21,"tag":209,"props":31017,"children":31018},{"class":211,"line":6589},[31019],{"type":21,"tag":209,"props":31020,"children":31021},{"style":448},[31022],{"type":26,"value":31023},"     * See also $.ajaxTransport for the elements that make this compatible with jQuery Deferred.\n",{"type":21,"tag":209,"props":31025,"children":31026},{"class":211,"line":6597},[31027],{"type":21,"tag":209,"props":31028,"children":31029},{"style":448},[31030],{"type":26,"value":31031},"     * New parameters available on the ajax call:\n",{"type":21,"tag":209,"props":31033,"children":31034},{"class":211,"line":6625},[31035],{"type":21,"tag":209,"props":31036,"children":31037},{"style":448},[31038],{"type":26,"value":31039},"     * localCache   : true              - required - either a boolean (in which case localStorage is used),\n",{"type":21,"tag":209,"props":31041,"children":31042},{"class":211,"line":6648},[31043],{"type":21,"tag":209,"props":31044,"children":31045},{"style":448},[31046],{"type":26,"value":31047},"     * or an object implementing the Storage interface, in which case that object is used instead.\n",{"type":21,"tag":209,"props":31049,"children":31050},{"class":211,"line":6670},[31051],{"type":21,"tag":209,"props":31052,"children":31053},{"style":448},[31054],{"type":26,"value":31055},"     * cacheTTL     : 5,                - optional - cache time in hours, default is 5.\n",{"type":21,"tag":209,"props":31057,"children":31058},{"class":211,"line":6678},[31059],{"type":21,"tag":209,"props":31060,"children":31061},{"style":448},[31062],{"type":26,"value":31063},"     * cacheKey     : 'myCacheKey',     - optional - key under which cached string will be stored\n",{"type":21,"tag":209,"props":31065,"children":31066},{"class":211,"line":6686},[31067],{"type":21,"tag":209,"props":31068,"children":31069},{"style":448},[31070],{"type":26,"value":31071},"     * isCacheValid : function          - optional - return true for valid, false for invalid\n",{"type":21,"tag":209,"props":31073,"children":31074},{"class":211,"line":6714},[31075,31079,31084],{"type":21,"tag":209,"props":31076,"children":31077},{"style":448},[31078],{"type":26,"value":4713},{"type":21,"tag":209,"props":31080,"children":31081},{"style":216},[31082],{"type":26,"value":31083},"@method",{"type":21,"tag":209,"props":31085,"children":31086},{"style":360},[31087],{"type":26,"value":31088}," $.ajaxPrefilter\n",{"type":21,"tag":209,"props":31090,"children":31091},{"class":211,"line":6747},[31092,31096,31100,31105],{"type":21,"tag":209,"props":31093,"children":31094},{"style":448},[31095],{"type":26,"value":4713},{"type":21,"tag":209,"props":31097,"children":31098},{"style":216},[31099],{"type":26,"value":4718},{"type":21,"tag":209,"props":31101,"children":31102},{"style":222},[31103],{"type":26,"value":31104}," options",{"type":21,"tag":209,"props":31106,"children":31107},{"style":448},[31108],{"type":26,"value":31109}," {Object} Options for the ajax call, modified with ajax standard settings\n",{"type":21,"tag":209,"props":31111,"children":31112},{"class":211,"line":6761},[31113],{"type":21,"tag":209,"props":31114,"children":31115},{"style":448},[31116],{"type":26,"value":4753},{"type":21,"tag":209,"props":31118,"children":31119},{"class":211,"line":6769},[31120,31125,31130,31134,31138,31142,31146],{"type":21,"tag":209,"props":31121,"children":31122},{"style":222},[31123],{"type":26,"value":31124},"    $.",{"type":21,"tag":209,"props":31126,"children":31127},{"style":360},[31128],{"type":26,"value":31129},"ajaxPrefilter",{"type":21,"tag":209,"props":31131,"children":31132},{"style":222},[31133],{"type":26,"value":368},{"type":21,"tag":209,"props":31135,"children":31136},{"style":216},[31137],{"type":26,"value":5370},{"type":21,"tag":209,"props":31139,"children":31140},{"style":222},[31141],{"type":26,"value":368},{"type":21,"tag":209,"props":31143,"children":31144},{"style":400},[31145],{"type":26,"value":29825},{"type":21,"tag":209,"props":31147,"children":31148},{"style":222},[31149],{"type":26,"value":2369},{"type":21,"tag":209,"props":31151,"children":31152},{"class":211,"line":6782},[31153,31157,31161,31165,31169],{"type":21,"tag":209,"props":31154,"children":31155},{"style":216},[31156],{"type":26,"value":5925},{"type":21,"tag":209,"props":31158,"children":31159},{"style":222},[31160],{"type":26,"value":15525},{"type":21,"tag":209,"props":31162,"children":31163},{"style":216},[31164],{"type":26,"value":1432},{"type":21,"tag":209,"props":31166,"children":31167},{"style":360},[31168],{"type":26,"value":15428},{"type":21,"tag":209,"props":31170,"children":31171},{"style":222},[31172],{"type":26,"value":31173},"(options.localCache),\n",{"type":21,"tag":209,"props":31175,"children":31176},{"class":211,"line":6812},[31177,31181,31185,31189,31193,31197,31201,31205,31209,31213,31217,31221,31225,31230,31234,31238],{"type":21,"tag":209,"props":31178,"children":31179},{"style":222},[31180],{"type":26,"value":16929},{"type":21,"tag":209,"props":31182,"children":31183},{"style":216},[31184],{"type":26,"value":1432},{"type":21,"tag":209,"props":31186,"children":31187},{"style":216},[31188],{"type":26,"value":17248},{"type":21,"tag":209,"props":31190,"children":31191},{"style":360},[31192],{"type":26,"value":14388},{"type":21,"tag":209,"props":31194,"children":31195},{"style":222},[31196],{"type":26,"value":14393},{"type":21,"tag":209,"props":31198,"children":31199},{"style":216},[31200],{"type":26,"value":10237},{"type":21,"tag":209,"props":31202,"children":31203},{"style":263},[31204],{"type":26,"value":14402},{"type":21,"tag":209,"props":31206,"children":31207},{"style":216},[31208],{"type":26,"value":14407},{"type":21,"tag":209,"props":31210,"children":31211},{"style":263},[31212],{"type":26,"value":14412},{"type":21,"tag":209,"props":31214,"children":31215},{"style":216},[31216],{"type":26,"value":14407},{"type":21,"tag":209,"props":31218,"children":31219},{"style":263},[31220],{"type":26,"value":14412},{"type":21,"tag":209,"props":31222,"children":31223},{"style":216},[31224],{"type":26,"value":14407},{"type":21,"tag":209,"props":31226,"children":31227},{"style":222},[31228],{"type":26,"value":31229}," (options.cacheTTL ",{"type":21,"tag":209,"props":31231,"children":31232},{"style":216},[31233],{"type":26,"value":4677},{"type":21,"tag":209,"props":31235,"children":31236},{"style":263},[31237],{"type":26,"value":16947},{"type":21,"tag":209,"props":31239,"children":31240},{"style":222},[31241],{"type":26,"value":10277},{"type":21,"tag":209,"props":31243,"children":31244},{"class":211,"line":6831},[31245,31249,31253,31257],{"type":21,"tag":209,"props":31246,"children":31247},{"style":222},[31248],{"type":26,"value":16960},{"type":21,"tag":209,"props":31250,"children":31251},{"style":216},[31252],{"type":26,"value":1432},{"type":21,"tag":209,"props":31254,"children":31255},{"style":360},[31256],{"type":26,"value":15138},{"type":21,"tag":209,"props":31258,"children":31259},{"style":222},[31260],{"type":26,"value":31261},"(options),\n",{"type":21,"tag":209,"props":31263,"children":31264},{"class":211,"line":6840},[31265,31269,31273],{"type":21,"tag":209,"props":31266,"children":31267},{"style":222},[31268],{"type":26,"value":16982},{"type":21,"tag":209,"props":31270,"children":31271},{"style":216},[31272],{"type":26,"value":1432},{"type":21,"tag":209,"props":31274,"children":31275},{"style":222},[31276],{"type":26,"value":31277}," options.isCacheValid,\n",{"type":21,"tag":209,"props":31279,"children":31280},{"class":211,"line":6864},[31281],{"type":21,"tag":209,"props":31282,"children":31283},{"style":222},[31284],{"type":26,"value":17000},{"type":21,"tag":209,"props":31286,"children":31287},{"class":211,"line":6872},[31288],{"type":21,"tag":209,"props":31289,"children":31290},{"style":222},[31291],{"type":26,"value":31292},"            value;\n",{"type":21,"tag":209,"props":31294,"children":31295},{"class":211,"line":6880},[31296],{"type":21,"tag":209,"props":31297,"children":31298},{"emptyLinePlaceholder":248},[31299],{"type":26,"value":251},{"type":21,"tag":209,"props":31301,"children":31302},{"class":211,"line":6899},[31303,31307,31311,31315,31319,31323],{"type":21,"tag":209,"props":31304,"children":31305},{"style":216},[31306],{"type":26,"value":5803},{"type":21,"tag":209,"props":31308,"children":31309},{"style":222},[31310],{"type":26,"value":4776},{"type":21,"tag":209,"props":31312,"children":31313},{"style":216},[31314],{"type":26,"value":15052},{"type":21,"tag":209,"props":31316,"children":31317},{"style":222},[31318],{"type":26,"value":15460},{"type":21,"tag":209,"props":31320,"children":31321},{"style":216},[31322],{"type":26,"value":5813},{"type":21,"tag":209,"props":31324,"children":31325},{"style":222},[31326],{"type":26,"value":241},{"type":21,"tag":209,"props":31328,"children":31329},{"class":211,"line":6907},[31330,31334,31338,31342,31346,31350,31354,31358],{"type":21,"tag":209,"props":31331,"children":31332},{"style":222},[31333],{"type":26,"value":17075},{"type":21,"tag":209,"props":31335,"children":31336},{"style":216},[31337],{"type":26,"value":1432},{"type":21,"tag":209,"props":31339,"children":31340},{"style":222},[31341],{"type":26,"value":17084},{"type":21,"tag":209,"props":31343,"children":31344},{"style":360},[31345],{"type":26,"value":17089},{"type":21,"tag":209,"props":31347,"children":31348},{"style":222},[31349],{"type":26,"value":14365},{"type":21,"tag":209,"props":31351,"children":31352},{"style":216},[31353],{"type":26,"value":10237},{"type":21,"tag":209,"props":31355,"children":31356},{"style":233},[31357],{"type":26,"value":14374},{"type":21,"tag":209,"props":31359,"children":31360},{"style":222},[31361],{"type":26,"value":2608},{"type":21,"tag":209,"props":31363,"children":31364},{"class":211,"line":6919},[31365],{"type":21,"tag":209,"props":31366,"children":31367},{"emptyLinePlaceholder":248},[31368],{"type":26,"value":251},{"type":21,"tag":209,"props":31370,"children":31371},{"class":211,"line":6927},[31372,31376,31380,31384,31388,31392,31396,31400,31404,31408,31412],{"type":21,"tag":209,"props":31373,"children":31374},{"style":216},[31375],{"type":26,"value":5803},{"type":21,"tag":209,"props":31377,"children":31378},{"style":222},[31379],{"type":26,"value":17126},{"type":21,"tag":209,"props":31381,"children":31382},{"style":216},[31383],{"type":26,"value":15578},{"type":21,"tag":209,"props":31385,"children":31386},{"style":216},[31387],{"type":26,"value":17135},{"type":21,"tag":209,"props":31389,"children":31390},{"style":222},[31391],{"type":26,"value":17140},{"type":21,"tag":209,"props":31393,"children":31394},{"style":216},[31395],{"type":26,"value":6102},{"type":21,"tag":209,"props":31397,"children":31398},{"style":233},[31399],{"type":26,"value":6107},{"type":21,"tag":209,"props":31401,"children":31402},{"style":216},[31403],{"type":26,"value":15539},{"type":21,"tag":209,"props":31405,"children":31406},{"style":216},[31407],{"type":26,"value":17157},{"type":21,"tag":209,"props":31409,"children":31410},{"style":360},[31411],{"type":26,"value":17162},{"type":21,"tag":209,"props":31413,"children":31414},{"style":222},[31415],{"type":26,"value":31416},"()){\n",{"type":21,"tag":209,"props":31418,"children":31419},{"class":211,"line":6935},[31420,31424],{"type":21,"tag":209,"props":31421,"children":31422},{"style":360},[31423],{"type":26,"value":14489},{"type":21,"tag":209,"props":31425,"children":31426},{"style":222},[31427],{"type":26,"value":14494},{"type":21,"tag":209,"props":31429,"children":31430},{"class":211,"line":6943},[31431,31435,31439,31443],{"type":21,"tag":209,"props":31432,"children":31433},{"style":222},[31434],{"type":26,"value":17188},{"type":21,"tag":209,"props":31436,"children":31437},{"style":216},[31438],{"type":26,"value":1432},{"type":21,"tag":209,"props":31440,"children":31441},{"style":263},[31442],{"type":26,"value":17197},{"type":21,"tag":209,"props":31444,"children":31445},{"style":222},[31446],{"type":26,"value":241},{"type":21,"tag":209,"props":31448,"children":31449},{"class":211,"line":6952},[31450],{"type":21,"tag":209,"props":31451,"children":31452},{"style":222},[31453],{"type":26,"value":2235},{"type":21,"tag":209,"props":31455,"children":31456},{"class":211,"line":6961},[31457],{"type":21,"tag":209,"props":31458,"children":31459},{"emptyLinePlaceholder":248},[31460],{"type":26,"value":251},{"type":21,"tag":209,"props":31462,"children":31463},{"class":211,"line":6977},[31464,31468,31472,31476,31480,31484,31488,31492],{"type":21,"tag":209,"props":31465,"children":31466},{"style":216},[31467],{"type":26,"value":5803},{"type":21,"tag":209,"props":31469,"children":31470},{"style":222},[31471],{"type":26,"value":17230},{"type":21,"tag":209,"props":31473,"children":31474},{"style":216},[31475],{"type":26,"value":15578},{"type":21,"tag":209,"props":31477,"children":31478},{"style":222},[31479],{"type":26,"value":17239},{"type":21,"tag":209,"props":31481,"children":31482},{"style":216},[31483],{"type":26,"value":1985},{"type":21,"tag":209,"props":31485,"children":31486},{"style":216},[31487],{"type":26,"value":17248},{"type":21,"tag":209,"props":31489,"children":31490},{"style":360},[31491],{"type":26,"value":14388},{"type":21,"tag":209,"props":31493,"children":31494},{"style":222},[31495],{"type":26,"value":31416},{"type":21,"tag":209,"props":31497,"children":31498},{"class":211,"line":6993},[31499,31503],{"type":21,"tag":209,"props":31500,"children":31501},{"style":360},[31502],{"type":26,"value":14489},{"type":21,"tag":209,"props":31504,"children":31505},{"style":222},[31506],{"type":26,"value":14494},{"type":21,"tag":209,"props":31508,"children":31509},{"class":211,"line":7001},[31510,31514,31518,31522],{"type":21,"tag":209,"props":31511,"children":31512},{"style":222},[31513],{"type":26,"value":17188},{"type":21,"tag":209,"props":31515,"children":31516},{"style":216},[31517],{"type":26,"value":1432},{"type":21,"tag":209,"props":31519,"children":31520},{"style":263},[31521],{"type":26,"value":17197},{"type":21,"tag":209,"props":31523,"children":31524},{"style":222},[31525],{"type":26,"value":241},{"type":21,"tag":209,"props":31527,"children":31528},{"class":211,"line":7025},[31529],{"type":21,"tag":209,"props":31530,"children":31531},{"style":222},[31532],{"type":26,"value":2235},{"type":21,"tag":209,"props":31534,"children":31535},{"class":211,"line":7066},[31536],{"type":21,"tag":209,"props":31537,"children":31538},{"emptyLinePlaceholder":248},[31539],{"type":26,"value":251},{"type":21,"tag":209,"props":31541,"children":31542},{"class":211,"line":7094},[31543,31547,31551,31555,31559],{"type":21,"tag":209,"props":31544,"children":31545},{"style":222},[31546],{"type":26,"value":17293},{"type":21,"tag":209,"props":31548,"children":31549},{"style":216},[31550],{"type":26,"value":1432},{"type":21,"tag":209,"props":31552,"children":31553},{"style":222},[31554],{"type":26,"value":17084},{"type":21,"tag":209,"props":31556,"children":31557},{"style":360},[31558],{"type":26,"value":17089},{"type":21,"tag":209,"props":31560,"children":31561},{"style":222},[31562],{"type":26,"value":15787},{"type":21,"tag":209,"props":31564,"children":31565},{"class":211,"line":7110},[31566,31570,31574,31578],{"type":21,"tag":209,"props":31567,"children":31568},{"style":216},[31569],{"type":26,"value":5803},{"type":21,"tag":209,"props":31571,"children":31572},{"style":222},[31573],{"type":26,"value":4776},{"type":21,"tag":209,"props":31575,"children":31576},{"style":216},[31577],{"type":26,"value":15052},{"type":21,"tag":209,"props":31579,"children":31580},{"style":222},[31581],{"type":26,"value":31582},"value){\n",{"type":21,"tag":209,"props":31584,"children":31585},{"class":211,"line":7126},[31586],{"type":21,"tag":209,"props":31587,"children":31588},{"style":448},[31589],{"type":26,"value":31590},"            // If it not in the cache, we store the data, add success callback - normal callback will proceed\n",{"type":21,"tag":209,"props":31592,"children":31593},{"class":211,"line":7142},[31594,31598],{"type":21,"tag":209,"props":31595,"children":31596},{"style":216},[31597],{"type":26,"value":6083},{"type":21,"tag":209,"props":31599,"children":31600},{"style":222},[31601],{"type":26,"value":31602}," (options.success) {\n",{"type":21,"tag":209,"props":31604,"children":31605},{"class":211,"line":7150},[31606,31611,31615],{"type":21,"tag":209,"props":31607,"children":31608},{"style":222},[31609],{"type":26,"value":31610},"                options.realsuccess ",{"type":21,"tag":209,"props":31612,"children":31613},{"style":216},[31614],{"type":26,"value":1432},{"type":21,"tag":209,"props":31616,"children":31617},{"style":222},[31618],{"type":26,"value":31619}," options.success;\n",{"type":21,"tag":209,"props":31621,"children":31622},{"class":211,"line":7162},[31623],{"type":21,"tag":209,"props":31624,"children":31625},{"style":222},[31626],{"type":26,"value":6136},{"type":21,"tag":209,"props":31628,"children":31629},{"class":211,"line":7170},[31630,31635,31640,31644,31648,31652,31656,31660,31664,31668,31672],{"type":21,"tag":209,"props":31631,"children":31632},{"style":222},[31633],{"type":26,"value":31634},"            options.",{"type":21,"tag":209,"props":31636,"children":31637},{"style":360},[31638],{"type":26,"value":31639},"success",{"type":21,"tag":209,"props":31641,"children":31642},{"style":216},[31643],{"type":26,"value":271},{"type":21,"tag":209,"props":31645,"children":31646},{"style":216},[31647],{"type":26,"value":4766},{"type":21,"tag":209,"props":31649,"children":31650},{"style":222},[31651],{"type":26,"value":368},{"type":21,"tag":209,"props":31653,"children":31654},{"style":400},[31655],{"type":26,"value":2863},{"type":21,"tag":209,"props":31657,"children":31658},{"style":222},[31659],{"type":26,"value":408},{"type":21,"tag":209,"props":31661,"children":31662},{"style":400},[31663],{"type":26,"value":23750},{"type":21,"tag":209,"props":31665,"children":31666},{"style":222},[31667],{"type":26,"value":408},{"type":21,"tag":209,"props":31669,"children":31670},{"style":400},[31671],{"type":26,"value":18108},{"type":21,"tag":209,"props":31673,"children":31674},{"style":222},[31675],{"type":26,"value":4786},{"type":21,"tag":209,"props":31677,"children":31678},{"class":211,"line":7178},[31679,31684,31688,31692,31696,31701,31705,31710,31715,31719,31723],{"type":21,"tag":209,"props":31680,"children":31681},{"style":216},[31682],{"type":26,"value":31683},"                var",{"type":21,"tag":209,"props":31685,"children":31686},{"style":222},[31687],{"type":26,"value":28204},{"type":21,"tag":209,"props":31689,"children":31690},{"style":216},[31691],{"type":26,"value":1432},{"type":21,"tag":209,"props":31693,"children":31694},{"style":263},[31695],{"type":26,"value":17698},{"type":21,"tag":209,"props":31697,"children":31698},{"style":222},[31699],{"type":26,"value":31700},".dataType ",{"type":21,"tag":209,"props":31702,"children":31703},{"style":216},[31704],{"type":26,"value":4677},{"type":21,"tag":209,"props":31706,"children":31707},{"style":222},[31708],{"type":26,"value":31709}," jqXHR.",{"type":21,"tag":209,"props":31711,"children":31712},{"style":360},[31713],{"type":26,"value":31714},"getResponseHeader",{"type":21,"tag":209,"props":31716,"children":31717},{"style":222},[31718],{"type":26,"value":368},{"type":21,"tag":209,"props":31720,"children":31721},{"style":233},[31722],{"type":26,"value":14247},{"type":21,"tag":209,"props":31724,"children":31725},{"style":222},[31726],{"type":26,"value":2608},{"type":21,"tag":209,"props":31728,"children":31729},{"class":211,"line":7186},[31730],{"type":21,"tag":209,"props":31731,"children":31732},{"emptyLinePlaceholder":248},[31733],{"type":26,"value":251},{"type":21,"tag":209,"props":31735,"children":31736},{"class":211,"line":7199},[31737],{"type":21,"tag":209,"props":31738,"children":31739},{"style":448},[31740],{"type":26,"value":31741},"                // Save the data to storage, catching Storage exception and IndexedDB exceptions alike\n",{"type":21,"tag":209,"props":31743,"children":31744},{"class":211,"line":16789},[31745],{"type":21,"tag":209,"props":31746,"children":31747},{"style":448},[31748],{"type":26,"value":31749},"                // and reject the returned promise as a result.\n",{"type":21,"tag":209,"props":31751,"children":31752},{"class":211,"line":16798},[31753,31758,31763,31767,31771,31775],{"type":21,"tag":209,"props":31754,"children":31755},{"style":360},[31756],{"type":26,"value":31757},"                addToStorage",{"type":21,"tag":209,"props":31759,"children":31760},{"style":222},[31761],{"type":26,"value":31762},"(storage, cacheKey, hourstl, data, dataType).",{"type":21,"tag":209,"props":31764,"children":31765},{"style":360},[31766],{"type":26,"value":18042},{"type":21,"tag":209,"props":31768,"children":31769},{"style":222},[31770],{"type":26,"value":368},{"type":21,"tag":209,"props":31772,"children":31773},{"style":216},[31774],{"type":26,"value":5370},{"type":21,"tag":209,"props":31776,"children":31777},{"style":222},[31778],{"type":26,"value":2561},{"type":21,"tag":209,"props":31780,"children":31781},{"class":211,"line":16812},[31782,31786,31791,31796],{"type":21,"tag":209,"props":31783,"children":31784},{"style":216},[31785],{"type":26,"value":12001},{"type":21,"tag":209,"props":31787,"children":31788},{"style":222},[31789],{"type":26,"value":31790}," (options.realsuccess) options.",{"type":21,"tag":209,"props":31792,"children":31793},{"style":360},[31794],{"type":26,"value":31795},"realsuccess",{"type":21,"tag":209,"props":31797,"children":31798},{"style":222},[31799],{"type":26,"value":31800},"(data, status, jqXHR);\n",{"type":21,"tag":209,"props":31802,"children":31803},{"class":211,"line":16821},[31804,31809,31813,31817,31821,31825,31829],{"type":21,"tag":209,"props":31805,"children":31806},{"style":222},[31807],{"type":26,"value":31808},"                }).",{"type":21,"tag":209,"props":31810,"children":31811},{"style":360},[31812],{"type":26,"value":18091},{"type":21,"tag":209,"props":31814,"children":31815},{"style":222},[31816],{"type":26,"value":368},{"type":21,"tag":209,"props":31818,"children":31819},{"style":216},[31820],{"type":26,"value":5370},{"type":21,"tag":209,"props":31822,"children":31823},{"style":222},[31824],{"type":26,"value":368},{"type":21,"tag":209,"props":31826,"children":31827},{"style":400},[31828],{"type":26,"value":10794},{"type":21,"tag":209,"props":31830,"children":31831},{"style":222},[31832],{"type":26,"value":2369},{"type":21,"tag":209,"props":31834,"children":31835},{"class":211,"line":16835},[31836,31841,31845],{"type":21,"tag":209,"props":31837,"children":31838},{"style":222},[31839],{"type":26,"value":31840},"                    console.",{"type":21,"tag":209,"props":31842,"children":31843},{"style":360},[31844],{"type":26,"value":1059},{"type":21,"tag":209,"props":31846,"children":31847},{"style":222},[31848],{"type":26,"value":27301},{"type":21,"tag":209,"props":31850,"children":31851},{"class":211,"line":16849},[31852],{"type":21,"tag":209,"props":31853,"children":31854},{"style":222},[31855],{"type":26,"value":29597},{"type":21,"tag":209,"props":31857,"children":31858},{"class":211,"line":16857},[31859],{"type":21,"tag":209,"props":31860,"children":31861},{"style":222},[31862],{"type":26,"value":6375},{"type":21,"tag":209,"props":31864,"children":31865},{"class":211,"line":16898},[31866],{"type":21,"tag":209,"props":31867,"children":31868},{"style":222},[31869],{"type":26,"value":2235},{"type":21,"tag":209,"props":31871,"children":31872},{"class":211,"line":16923},[31873],{"type":21,"tag":209,"props":31874,"children":31875},{"style":222},[31876],{"type":26,"value":3391},{"type":21,"tag":209,"props":31878,"children":31879},{"class":211,"line":16954},[31880],{"type":21,"tag":209,"props":31881,"children":31882},{"emptyLinePlaceholder":248},[31883],{"type":26,"value":251},{"type":21,"tag":209,"props":31885,"children":31886},{"class":211,"line":16976},[31887],{"type":21,"tag":209,"props":31888,"children":31889},{"style":448},[31890],{"type":26,"value":4697},{"type":21,"tag":209,"props":31892,"children":31893},{"class":211,"line":16994},[31894],{"type":21,"tag":209,"props":31895,"children":31896},{"style":448},[31897],{"type":26,"value":31898},"     * This function performs the fetch from cache portion of the functionality needed to cache ajax\n",{"type":21,"tag":209,"props":31900,"children":31901},{"class":211,"line":17003},[31902],{"type":21,"tag":209,"props":31903,"children":31904},{"style":448},[31905],{"type":26,"value":31906},"     * calls and still fulfill the jqXHR Deferred Promise interface.\n",{"type":21,"tag":209,"props":31908,"children":31909},{"class":211,"line":17011},[31910],{"type":21,"tag":209,"props":31911,"children":31912},{"style":448},[31913],{"type":26,"value":31914},"     * See also $.ajaxPrefilter\n",{"type":21,"tag":209,"props":31916,"children":31917},{"class":211,"line":17020},[31918,31922,31926],{"type":21,"tag":209,"props":31919,"children":31920},{"style":448},[31921],{"type":26,"value":4713},{"type":21,"tag":209,"props":31923,"children":31924},{"style":216},[31925],{"type":26,"value":31083},{"type":21,"tag":209,"props":31927,"children":31928},{"style":360},[31929],{"type":26,"value":31930}," $.ajaxTransport\n",{"type":21,"tag":209,"props":31932,"children":31933},{"class":211,"line":17028},[31934,31938,31943],{"type":21,"tag":209,"props":31935,"children":31936},{"style":448},[31937],{"type":26,"value":4713},{"type":21,"tag":209,"props":31939,"children":31940},{"style":216},[31941],{"type":26,"value":31942},"@params",{"type":21,"tag":209,"props":31944,"children":31945},{"style":448},[31946],{"type":26,"value":31947}," options {Object} Options for the ajax call, modified with ajax standard settings\n",{"type":21,"tag":209,"props":31949,"children":31950},{"class":211,"line":17061},[31951],{"type":21,"tag":209,"props":31952,"children":31953},{"style":448},[31954],{"type":26,"value":4753},{"type":21,"tag":209,"props":31956,"children":31957},{"class":211,"line":17069},[31958,31962,31967,31971,31976,31980,31984,31988,31992],{"type":21,"tag":209,"props":31959,"children":31960},{"style":222},[31961],{"type":26,"value":31124},{"type":21,"tag":209,"props":31963,"children":31964},{"style":360},[31965],{"type":26,"value":31966},"ajaxTransport",{"type":21,"tag":209,"props":31968,"children":31969},{"style":222},[31970],{"type":26,"value":368},{"type":21,"tag":209,"props":31972,"children":31973},{"style":233},[31974],{"type":26,"value":31975},"\"+*\"",{"type":21,"tag":209,"props":31977,"children":31978},{"style":222},[31979],{"type":26,"value":408},{"type":21,"tag":209,"props":31981,"children":31982},{"style":216},[31983],{"type":26,"value":5370},{"type":21,"tag":209,"props":31985,"children":31986},{"style":222},[31987],{"type":26,"value":368},{"type":21,"tag":209,"props":31989,"children":31990},{"style":400},[31991],{"type":26,"value":29825},{"type":21,"tag":209,"props":31993,"children":31994},{"style":222},[31995],{"type":26,"value":2369},{"type":21,"tag":209,"props":31997,"children":31998},{"class":211,"line":17108},[31999,32003],{"type":21,"tag":209,"props":32000,"children":32001},{"style":216},[32002],{"type":26,"value":5803},{"type":21,"tag":209,"props":32004,"children":32005},{"style":222},[32006],{"type":26,"value":32007}," (options.localCache)\n",{"type":21,"tag":209,"props":32009,"children":32010},{"class":211,"line":17116},[32011],{"type":21,"tag":209,"props":32012,"children":32013},{"style":222},[32014],{"type":26,"value":7561},{"type":21,"tag":209,"props":32016,"children":32017},{"class":211,"line":17170},[32018,32022,32027,32031,32035],{"type":21,"tag":209,"props":32019,"children":32020},{"style":216},[32021],{"type":26,"value":5959},{"type":21,"tag":209,"props":32023,"children":32024},{"style":222},[32025],{"type":26,"value":32026}," cacheKey ",{"type":21,"tag":209,"props":32028,"children":32029},{"style":216},[32030],{"type":26,"value":1432},{"type":21,"tag":209,"props":32032,"children":32033},{"style":360},[32034],{"type":26,"value":15138},{"type":21,"tag":209,"props":32036,"children":32037},{"style":222},[32038],{"type":26,"value":31261},{"type":21,"tag":209,"props":32040,"children":32041},{"class":211,"line":17182},[32042,32047,32051,32055],{"type":21,"tag":209,"props":32043,"children":32044},{"style":222},[32045],{"type":26,"value":32046},"                storage ",{"type":21,"tag":209,"props":32048,"children":32049},{"style":216},[32050],{"type":26,"value":1432},{"type":21,"tag":209,"props":32052,"children":32053},{"style":360},[32054],{"type":26,"value":15428},{"type":21,"tag":209,"props":32056,"children":32057},{"style":222},[32058],{"type":26,"value":31173},{"type":21,"tag":209,"props":32060,"children":32061},{"class":211,"line":17204},[32062,32067,32071,32076,32080,32084,32088,32093,32097,32101],{"type":21,"tag":209,"props":32063,"children":32064},{"style":222},[32065],{"type":26,"value":32066},"                value ",{"type":21,"tag":209,"props":32068,"children":32069},{"style":216},[32070],{"type":26,"value":1432},{"type":21,"tag":209,"props":32072,"children":32073},{"style":222},[32074],{"type":26,"value":32075}," (storage) ",{"type":21,"tag":209,"props":32077,"children":32078},{"style":216},[32079],{"type":26,"value":15218},{"type":21,"tag":209,"props":32081,"children":32082},{"style":222},[32083],{"type":26,"value":17084},{"type":21,"tag":209,"props":32085,"children":32086},{"style":360},[32087],{"type":26,"value":17089},{"type":21,"tag":209,"props":32089,"children":32090},{"style":222},[32091],{"type":26,"value":32092},"(cacheKey) ",{"type":21,"tag":209,"props":32094,"children":32095},{"style":216},[32096],{"type":26,"value":191},{"type":21,"tag":209,"props":32098,"children":32099},{"style":263},[32100],{"type":26,"value":5455},{"type":21,"tag":209,"props":32102,"children":32103},{"style":222},[32104],{"type":26,"value":241},{"type":21,"tag":209,"props":32106,"children":32107},{"class":211,"line":17212},[32108],{"type":21,"tag":209,"props":32109,"children":32110},{"emptyLinePlaceholder":248},[32111],{"type":26,"value":251},{"type":21,"tag":209,"props":32113,"children":32114},{"class":211,"line":17220},[32115,32119],{"type":21,"tag":209,"props":32116,"children":32117},{"style":216},[32118],{"type":26,"value":6083},{"type":21,"tag":209,"props":32120,"children":32121},{"style":222},[32122],{"type":26,"value":32123}," (value){\n",{"type":21,"tag":209,"props":32125,"children":32126},{"class":211,"line":17259},[32127],{"type":21,"tag":209,"props":32128,"children":32129},{"style":448},[32130],{"type":26,"value":32131},"                /**\n",{"type":21,"tag":209,"props":32133,"children":32134},{"class":211,"line":17271},[32135],{"type":21,"tag":209,"props":32136,"children":32137},{"style":448},[32138],{"type":26,"value":32139},"                 * If the key is in the Storage-based cache, indicate that we want to handle this ajax request\n",{"type":21,"tag":209,"props":32141,"children":32142},{"class":211,"line":17279},[32143],{"type":21,"tag":209,"props":32144,"children":32145},{"style":448},[32146],{"type":26,"value":32147},"                 * (by returning a value), and use the cache key to retrieve the value from the IndexedDB. Then,\n",{"type":21,"tag":209,"props":32149,"children":32150},{"class":211,"line":17287},[32151],{"type":21,"tag":209,"props":32152,"children":32153},{"style":448},[32154],{"type":26,"value":32155},"                 * call the completeCallback with the fetched value.\n",{"type":21,"tag":209,"props":32157,"children":32158},{"class":211,"line":17312},[32159],{"type":21,"tag":209,"props":32160,"children":32161},{"style":448},[32162],{"type":26,"value":32163},"                 */\n",{"type":21,"tag":209,"props":32165,"children":32166},{"class":211,"line":17320},[32167,32171],{"type":21,"tag":209,"props":32168,"children":32169},{"style":216},[32170],{"type":26,"value":5653},{"type":21,"tag":209,"props":32172,"children":32173},{"style":222},[32174],{"type":26,"value":276},{"type":21,"tag":209,"props":32176,"children":32177},{"class":211,"line":17341},[32178,32183,32187,32191,32195,32199,32203,32208],{"type":21,"tag":209,"props":32179,"children":32180},{"style":360},[32181],{"type":26,"value":32182},"                    send",{"type":21,"tag":209,"props":32184,"children":32185},{"style":222},[32186],{"type":26,"value":191},{"type":21,"tag":209,"props":32188,"children":32189},{"style":216},[32190],{"type":26,"value":5370},{"type":21,"tag":209,"props":32192,"children":32193},{"style":222},[32194],{"type":26,"value":368},{"type":21,"tag":209,"props":32196,"children":32197},{"style":400},[32198],{"type":26,"value":15176},{"type":21,"tag":209,"props":32200,"children":32201},{"style":222},[32202],{"type":26,"value":408},{"type":21,"tag":209,"props":32204,"children":32205},{"style":400},[32206],{"type":26,"value":32207},"completeCallback",{"type":21,"tag":209,"props":32209,"children":32210},{"style":222},[32211],{"type":26,"value":4786},{"type":21,"tag":209,"props":32213,"children":32214},{"class":211,"line":17350},[32215,32220,32224,32229,32233,32237,32241,32245,32250],{"type":21,"tag":209,"props":32216,"children":32217},{"style":222},[32218],{"type":26,"value":32219},"                        $.jidb.",{"type":21,"tag":209,"props":32221,"children":32222},{"style":360},[32223],{"type":26,"value":17089},{"type":21,"tag":209,"props":32225,"children":32226},{"style":222},[32227],{"type":26,"value":32228},"(cacheKey).",{"type":21,"tag":209,"props":32230,"children":32231},{"style":360},[32232],{"type":26,"value":18042},{"type":21,"tag":209,"props":32234,"children":32235},{"style":222},[32236],{"type":26,"value":368},{"type":21,"tag":209,"props":32238,"children":32239},{"style":216},[32240],{"type":26,"value":5370},{"type":21,"tag":209,"props":32242,"children":32243},{"style":222},[32244],{"type":26,"value":368},{"type":21,"tag":209,"props":32246,"children":32247},{"style":400},[32248],{"type":26,"value":32249},"result",{"type":21,"tag":209,"props":32251,"children":32252},{"style":222},[32253],{"type":26,"value":2369},{"type":21,"tag":209,"props":32255,"children":32256},{"class":211,"line":17359},[32257,32262,32266,32270],{"type":21,"tag":209,"props":32258,"children":32259},{"style":216},[32260],{"type":26,"value":32261},"                            var",{"type":21,"tag":209,"props":32263,"children":32264},{"style":222},[32265],{"type":26,"value":12514},{"type":21,"tag":209,"props":32267,"children":32268},{"style":216},[32269],{"type":26,"value":1432},{"type":21,"tag":209,"props":32271,"children":32272},{"style":222},[32273],{"type":26,"value":32274}," {};\n",{"type":21,"tag":209,"props":32276,"children":32277},{"class":211,"line":17404},[32278,32283,32287],{"type":21,"tag":209,"props":32279,"children":32280},{"style":222},[32281],{"type":26,"value":32282},"                            response[result.dataType] ",{"type":21,"tag":209,"props":32284,"children":32285},{"style":216},[32286],{"type":26,"value":1432},{"type":21,"tag":209,"props":32288,"children":32289},{"style":222},[32290],{"type":26,"value":32291}," result.data;\n",{"type":21,"tag":209,"props":32293,"children":32294},{"class":211,"line":17412},[32295,32300,32304,32308,32312,32316,32321,32325],{"type":21,"tag":209,"props":32296,"children":32297},{"style":360},[32298],{"type":26,"value":32299},"                            completeCallback",{"type":21,"tag":209,"props":32301,"children":32302},{"style":222},[32303],{"type":26,"value":368},{"type":21,"tag":209,"props":32305,"children":32306},{"style":263},[32307],{"type":26,"value":14764},{"type":21,"tag":209,"props":32309,"children":32310},{"style":222},[32311],{"type":26,"value":408},{"type":21,"tag":209,"props":32313,"children":32314},{"style":233},[32315],{"type":26,"value":14781},{"type":21,"tag":209,"props":32317,"children":32318},{"style":222},[32319],{"type":26,"value":32320},", response, ",{"type":21,"tag":209,"props":32322,"children":32323},{"style":233},[32324],{"type":26,"value":20111},{"type":21,"tag":209,"props":32326,"children":32327},{"style":222},[32328],{"type":26,"value":2608},{"type":21,"tag":209,"props":32330,"children":32331},{"class":211,"line":17420},[32332,32337,32341,32345,32349],{"type":21,"tag":209,"props":32333,"children":32334},{"style":222},[32335],{"type":26,"value":32336},"                        }).",{"type":21,"tag":209,"props":32338,"children":32339},{"style":360},[32340],{"type":26,"value":18091},{"type":21,"tag":209,"props":32342,"children":32343},{"style":222},[32344],{"type":26,"value":368},{"type":21,"tag":209,"props":32346,"children":32347},{"style":216},[32348],{"type":26,"value":5370},{"type":21,"tag":209,"props":32350,"children":32351},{"style":222},[32352],{"type":26,"value":2561},{"type":21,"tag":209,"props":32354,"children":32355},{"class":211,"line":17429},[32356,32360,32364,32368,32372,32377,32381,32386,32390,32394,32398],{"type":21,"tag":209,"props":32357,"children":32358},{"style":360},[32359],{"type":26,"value":32299},{"type":21,"tag":209,"props":32361,"children":32362},{"style":222},[32363],{"type":26,"value":368},{"type":21,"tag":209,"props":32365,"children":32366},{"style":263},[32367],{"type":26,"value":23759},{"type":21,"tag":209,"props":32369,"children":32370},{"style":222},[32371],{"type":26,"value":408},{"type":21,"tag":209,"props":32373,"children":32374},{"style":233},[32375],{"type":26,"value":32376},"'cache failure'",{"type":21,"tag":209,"props":32378,"children":32379},{"style":222},[32380],{"type":26,"value":408},{"type":21,"tag":209,"props":32382,"children":32383},{"style":216},[32384],{"type":26,"value":32385},"void",{"type":21,"tag":209,"props":32387,"children":32388},{"style":263},[32389],{"type":26,"value":17197},{"type":21,"tag":209,"props":32391,"children":32392},{"style":222},[32393],{"type":26,"value":408},{"type":21,"tag":209,"props":32395,"children":32396},{"style":233},[32397],{"type":26,"value":20111},{"type":21,"tag":209,"props":32399,"children":32400},{"style":222},[32401],{"type":26,"value":2608},{"type":21,"tag":209,"props":32403,"children":32404},{"class":211,"line":17438},[32405],{"type":21,"tag":209,"props":32406,"children":32407},{"style":222},[32408],{"type":26,"value":32409},"                        });\n",{"type":21,"tag":209,"props":32411,"children":32412},{"class":211,"line":17486},[32413],{"type":21,"tag":209,"props":32414,"children":32415},{"style":222},[32416],{"type":26,"value":32417},"                    },\n",{"type":21,"tag":209,"props":32419,"children":32420},{"class":211,"line":17503},[32421,32426,32430,32434],{"type":21,"tag":209,"props":32422,"children":32423},{"style":360},[32424],{"type":26,"value":32425},"                    abort",{"type":21,"tag":209,"props":32427,"children":32428},{"style":222},[32429],{"type":26,"value":191},{"type":21,"tag":209,"props":32431,"children":32432},{"style":216},[32433],{"type":26,"value":5370},{"type":21,"tag":209,"props":32435,"children":32436},{"style":222},[32437],{"type":26,"value":5375},{"type":21,"tag":209,"props":32439,"children":32440},{"class":211,"line":17511},[32441,32446,32450,32454,32459],{"type":21,"tag":209,"props":32442,"children":32443},{"style":222},[32444],{"type":26,"value":32445},"                        console.",{"type":21,"tag":209,"props":32447,"children":32448},{"style":360},[32449],{"type":26,"value":1059},{"type":21,"tag":209,"props":32451,"children":32452},{"style":222},[32453],{"type":26,"value":368},{"type":21,"tag":209,"props":32455,"children":32456},{"style":233},[32457],{"type":26,"value":32458},"\"Aborted ajax transport for caching.\"",{"type":21,"tag":209,"props":32460,"children":32461},{"style":222},[32462],{"type":26,"value":2608},{"type":21,"tag":209,"props":32464,"children":32465},{"class":211,"line":29262},[32466],{"type":21,"tag":209,"props":32467,"children":32468},{"style":222},[32469],{"type":26,"value":12047},{"type":21,"tag":209,"props":32471,"children":32472},{"class":211,"line":29270},[32473],{"type":21,"tag":209,"props":32474,"children":32475},{"style":222},[32476],{"type":26,"value":32477},"                };\n",{"type":21,"tag":209,"props":32479,"children":32480},{"class":211,"line":29278},[32481],{"type":21,"tag":209,"props":32482,"children":32483},{"style":222},[32484],{"type":26,"value":6136},{"type":21,"tag":209,"props":32486,"children":32487},{"class":211,"line":29287},[32488],{"type":21,"tag":209,"props":32489,"children":32490},{"style":222},[32491],{"type":26,"value":2235},{"type":21,"tag":209,"props":32493,"children":32494},{"class":211,"line":29307},[32495],{"type":21,"tag":209,"props":32496,"children":32497},{"style":222},[32498],{"type":26,"value":3391},{"type":21,"tag":209,"props":32500,"children":32501},{"class":211,"line":29315},[32502],{"type":21,"tag":209,"props":32503,"children":32504},{"style":222},[32505],{"type":26,"value":29679},{"type":21,"tag":22,"props":32507,"children":32508},{},[32509,32511,32517],{"type":26,"value":32510},"If you're acquainted with the Jalc plugin, this should look familiar. The main changes lie in the ",{"type":21,"tag":63,"props":32512,"children":32514},{"className":32513},[],[32515],{"type":26,"value":32516},"addToStorage",{"type":26,"value":32518}," function, which we call to actual store the values - notice that we need to handle both the case where we've hit an error in local storage (such as exceeding the storage limit), and potential errors responses from our IndexedDB wrapper - and the ajaxTransport we use to deliver the cached response which, as promised, uses our dirty little hack of relying on the synchronous nature of LocalStorage to tell us whether a key exists and, once we've asserted that we'll be delivering the transport for this request, taking our time with the asynchronous operation to actually fetch and return the requested data.",{"type":21,"tag":51,"props":32520,"children":32522},{"id":32521},"thats-it-folks",[32523],{"type":26,"value":32524},"That's it, folks",{"type":21,"tag":22,"props":32526,"children":32527},{},[32528,32530,32535,32537,32542],{"type":26,"value":32529},"This plugin should be considered ",{"type":21,"tag":1084,"props":32531,"children":32532},{},[32533],{"type":26,"value":32534},"experimental",{"type":26,"value":32536},"! It works as a proof of concept, but I wouldn't place it into production if I were you - it doesn't attempt to handle cases like Privacy mode in Firefox (where IndexedDB ",{"type":21,"tag":1084,"props":32538,"children":32539},{},[32540],{"type":26,"value":32541},"says",{"type":26,"value":32543}," it's available, but fails to function), no fallbacks, and weak-to-nonexistant error handling. Want to use it somewhere serious? Pull requests are welcome. :)",{"type":21,"tag":22,"props":32545,"children":32546},{},[32547,32549,32555],{"type":26,"value":32548},"Take a look at the new ",{"type":21,"tag":29,"props":32550,"children":32552},{"href":26570,"rel":32551},[93],[32553],{"type":26,"value":32554},"Jalic plugin on Github",{"type":26,"value":378},{"type":21,"tag":3490,"props":32557,"children":32558},{},[32559],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":32561},[32562,32565,32566],{"id":26579,"depth":254,"text":26582,"children":32563},[32564],{"id":26698,"depth":279,"text":26701},{"id":26772,"depth":254,"text":26775},{"id":32521,"depth":254,"text":32524},"content:ckeefer:2016-1:ajaxBinaryCaching.md","ckeefer/2016-1/ajaxBinaryCaching.md","ckeefer/2016-1/ajaxBinaryCaching",{"user":3518,"name":3519},{"_path":32572,"_dir":32573,"_draft":7,"_partial":7,"_locale":8,"title":32574,"description":32575,"publishDate":32576,"tags":32577,"excerpt":32575,"body":32578,"_type":3511,"_id":32930,"_source":3513,"_file":32931,"_stem":32932,"_extension":3516,"author":32933},"/ckeefer/2015-5/file-reader-chunking","2015-5","FileReader Chunking and Base64 DataURLs","In a hurry? You can now use our HUp jquery plugin to read files in a chunked fashion as data URLs. Hooray!","2015-12-15",[12,13804],{"type":18,"children":32579,"toc":32925},[32580,32594,32599,32622,32628,32633,32683,32704,32712,32717,32722,32728,32733,32758,32785,32797,32802,32875,32880,32886,32891,32896,32908,32921],{"type":21,"tag":22,"props":32581,"children":32582},{},[32583,32585,32592],{"type":26,"value":32584},"In a hurry? You can now use our ",{"type":21,"tag":29,"props":32586,"children":32589},{"href":32587,"rel":32588},"https://github.com/SaneMethod/HUp",[93],[32590],{"type":26,"value":32591},"HUp jquery plugin",{"type":26,"value":32593}," to read files in a chunked fashion as data URLs. Hooray!",{"type":21,"tag":22,"props":32595,"children":32596},{},[32597],{"type":26,"value":32598},"Got a minute or two? Let's talk about file read chunking, data URLs and base 64.",{"type":21,"tag":22,"props":32600,"children":32601},{},[32602,32604,32611,32613,32620],{"type":26,"value":32603},"If you've been looking forward to the ",{"type":21,"tag":29,"props":32605,"children":32608},{"href":32606,"rel":32607},"https://artandlogic.com/2015/11/11029/",[93],[32609],{"type":26,"value":32610},"previously promised discussion",{"type":26,"value":32612}," about file reading/downloading to/uploading from ",{"type":21,"tag":29,"props":32614,"children":32617},{"href":32615,"rel":32616},"https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API",[93],[32618],{"type":26,"value":32619},"IndexedDb",{"type":26,"value":32621}," - well, keep looking forward, it's on the way. In the meantime, however, let's take a quick look at a problem and it's quick and easy solution, that emerged out of making file reading chunkable for the HUp plugin.",{"type":21,"tag":51,"props":32623,"children":32625},{"id":32624},"the-problem",[32626],{"type":26,"value":32627},"The Problem",{"type":21,"tag":22,"props":32629,"children":32630},{},[32631],{"type":26,"value":32632},"The HUp plugin has, as one of its goals, sensible defaults - such that a user can just call it against whatever element they want to make into a file reader/uploader drag-and-drop point, and presto! Everything works, and in a reasonable manner.",{"type":21,"tag":22,"props":32634,"children":32635},{},[32636,32638,32643,32645,32650,32652,32659,32661,32665,32667,32673,32675,32681],{"type":26,"value":32637},"When I added the ability to ",{"type":21,"tag":1084,"props":32639,"children":32640},{},[32641],{"type":26,"value":32642},"read",{"type":26,"value":32644}," files in chunks, to mirror and complement our ability to ",{"type":21,"tag":1084,"props":32646,"children":32647},{},[32648],{"type":26,"value":32649},"upload",{"type":26,"value":32651}," files in chunks, we hit a snag in regards to the above goal. Generally speaking, the expectation is that developers using the plugin to read files in will probably want to be able to use said file in the browser in some fashion, and one of the simplest representations that can be used directly in the browser is a base64-encoded ",{"type":21,"tag":29,"props":32653,"children":32656},{"href":32654,"rel":32655},"https://developer.mozilla.org/en-US/docs/Web/HTTP/data_URIs",[93],[32657],{"type":26,"value":32658},"data URL",{"type":26,"value":32660},". You can expect to be able to pop it into the ",{"type":21,"tag":1084,"props":32662,"children":32663},{},[32664],{"type":26,"value":8912},{"type":26,"value":32666}," attribute of a number of elements in a modern browser, and be able to do something with it right away. So, defaulting our ",{"type":21,"tag":63,"props":32668,"children":32670},{"className":32669},[],[32671],{"type":26,"value":32672},"read_method",{"type":26,"value":32674}," to ",{"type":21,"tag":63,"props":32676,"children":32678},{"className":32677},[],[32679],{"type":26,"value":32680},"readAsDataURL",{"type":26,"value":32682}," makes sense.",{"type":21,"tag":22,"props":32684,"children":32685},{},[32686,32688,32694,32696,32702],{"type":26,"value":32687},"However! Now that we're chunking file reads by default (since it offers benefits, some of which were discussed ",{"type":21,"tag":29,"props":32689,"children":32691},{"href":32606,"rel":32690},[93],[32692],{"type":26,"value":32693},"last time",{"type":26,"value":32695},"), if the file to be read is larger than our ",{"type":21,"tag":63,"props":32697,"children":32699},{"className":32698},[],[32700],{"type":26,"value":32701},"chunk_size",{"type":26,"value":32703}," (which defaults to 1MiB), than it will be read as a number of chunks, which will need to be reassembled to be used in a src attribute as a data URL. Small bit of extra work for the developer, but a little string manipulation and you're done, right?",{"type":21,"tag":22,"props":32705,"children":32706},{},[32707],{"type":21,"tag":5270,"props":32708,"children":32709},{},[32710],{"type":26,"value":32711},"Not quite.",{"type":21,"tag":22,"props":32713,"children":32714},{},[32715],{"type":26,"value":32716},"It's common knowledge that encoding binary data as base64 will result in an overall increase in size of about 33%. This is because, with a total of 26 different values, base64 can encode 6 bits per character (that is, the eight bits composing one character (in, for example, utf-8), are each used to represent 6 bits in the source binary).",{"type":21,"tag":22,"props":32718,"children":32719},{},[32720],{"type":26,"value":32721},"So what's the problem? We can end up with chunks that can't be trivially recombined, and the details we just discussed regarding how many bits per character we get in base64-encoding explains why - if we're not careful about where we slice the file chunks, we end up with each base64 chunk after the first out of alignment from the binary source. Attempting to simply concatenate them and use them will fail.",{"type":21,"tag":51,"props":32723,"children":32725},{"id":32724},"the-workaround",[32726],{"type":26,"value":32727},"The Workaround",{"type":21,"tag":22,"props":32729,"children":32730},{},[32731],{"type":26,"value":32732},"Recently, a user of the plugin brought up an unrelated problem, regarding the mime-type on the produced data URLs. In the process of fixing this, I started thinking about how chunking might affect the data URLs, and a few quick experiments showed me I was correct - chunking the files and encoding them as base64 caused problems. I didn't have the time to fix the issue at that moment, however, so I mentioned a workaround to said user.",{"type":21,"tag":22,"props":32734,"children":32735},{},[32736,32741,32743,32748,32750,32757],{"type":21,"tag":1084,"props":32737,"children":32738},{},[32739],{"type":26,"value":32740},"You",{"type":26,"value":32742},", lucky reader, don't ",{"type":21,"tag":1084,"props":32744,"children":32745},{},[32746],{"type":26,"value":32747},"need",{"type":26,"value":32749}," this workaround, since this issue is now addressed - however, it might be of future interest, particularly if you need/prefer to work with ",{"type":21,"tag":29,"props":32751,"children":32754},{"href":32752,"rel":32753},"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer",[93],[32755],{"type":26,"value":32756},"Array Buffers",{"type":26,"value":378},{"type":21,"tag":22,"props":32759,"children":32760},{},[32761,32763,32768,32770,32775,32777,32783],{"type":26,"value":32762},"Since using an Array Buffer means we don't need to worry about base64 encoding a file, we can slice and dice each chunk however we please, and concatenating the resulting array buffers poses no issue. So, instead of using ",{"type":21,"tag":63,"props":32764,"children":32766},{"className":32765},[],[32767],{"type":26,"value":32680},{"type":26,"value":32769}," as our ",{"type":21,"tag":63,"props":32771,"children":32773},{"className":32772},[],[32774],{"type":26,"value":32672},{"type":26,"value":32776},", I suggested this user employ the ",{"type":21,"tag":63,"props":32778,"children":32780},{"className":32779},[],[32781],{"type":26,"value":32782},"readAsArrayBuffer",{"type":26,"value":32784}," method instead.",{"type":21,"tag":22,"props":32786,"children":32787},{},[32788,32790,32795],{"type":26,"value":32789},"What if he wants to be able to display or otherwise use the read-in file in the browser? Well, we could convert the concatenated array buffers into base64, but a much more straightforward method is to create a new ",{"type":21,"tag":29,"props":32791,"children":32793},{"href":8900,"rel":32792},[93],[32794],{"type":26,"value":8904},{"type":26,"value":32796}," from the concatenated array buffers, and get an object url from said blob to display.",{"type":21,"tag":22,"props":32798,"children":32799},{},[32800],{"type":26,"value":32801},"This would look something like the following, assuming for the sake of example that you have three array buffers which we'll creatively name arr1, arr2 and arr3:",{"type":21,"tag":200,"props":32803,"children":32805},{"className":9044,"code":32804,"language":9046,"meta":8,"style":8},"var blob = new Blob([arr1, arr2, arr3], {type:'mime/type'}),\n    url = URL.createObjectURL(blob);\n",[32806],{"type":21,"tag":63,"props":32807,"children":32808},{"__ignoreMap":8},[32809,32847],{"type":21,"tag":209,"props":32810,"children":32811},{"class":211,"line":212},[32812,32816,32820,32824,32828,32832,32837,32842],{"type":21,"tag":209,"props":32813,"children":32814},{"style":216},[32815],{"type":26,"value":8996},{"type":21,"tag":209,"props":32817,"children":32818},{"style":222},[32819],{"type":26,"value":9001},{"type":21,"tag":209,"props":32821,"children":32822},{"style":216},[32823],{"type":26,"value":1432},{"type":21,"tag":209,"props":32825,"children":32826},{"style":216},[32827],{"type":26,"value":4667},{"type":21,"tag":209,"props":32829,"children":32830},{"style":360},[32831],{"type":26,"value":9014},{"type":21,"tag":209,"props":32833,"children":32834},{"style":222},[32835],{"type":26,"value":32836},"([arr1, arr2, arr3], {type:",{"type":21,"tag":209,"props":32838,"children":32839},{"style":233},[32840],{"type":26,"value":32841},"'mime/type'",{"type":21,"tag":209,"props":32843,"children":32844},{"style":222},[32845],{"type":26,"value":32846},"}),\n",{"type":21,"tag":209,"props":32848,"children":32849},{"class":211,"line":244},[32850,32855,32859,32863,32867,32871],{"type":21,"tag":209,"props":32851,"children":32852},{"style":222},[32853],{"type":26,"value":32854},"    url ",{"type":21,"tag":209,"props":32856,"children":32857},{"style":216},[32858],{"type":26,"value":1432},{"type":21,"tag":209,"props":32860,"children":32861},{"style":263},[32862],{"type":26,"value":9125},{"type":21,"tag":209,"props":32864,"children":32865},{"style":222},[32866],{"type":26,"value":378},{"type":21,"tag":209,"props":32868,"children":32869},{"style":360},[32870],{"type":26,"value":9134},{"type":21,"tag":209,"props":32872,"children":32873},{"style":222},[32874],{"type":26,"value":9139},{"type":21,"tag":22,"props":32876,"children":32877},{},[32878],{"type":26,"value":32879},"Pretty easy, right?",{"type":21,"tag":51,"props":32881,"children":32883},{"id":32882},"the-solution",[32884],{"type":26,"value":32885},"The Solution",{"type":21,"tag":22,"props":32887,"children":32888},{},[32889],{"type":26,"value":32890},"I wasn't entirely happy with having to suggest this workaround, however, so when I had an hour or so free to revisit the question, I tried a little experiment. Could it really be as simple, I wondered, as making sure our chunks were aligned to the nearest multiple of 6 (remembering, as mentioned above, that we get 6-bits per character)?",{"type":21,"tag":22,"props":32892,"children":32893},{},[32894],{"type":26,"value":32895},"Yes, yes it could be.",{"type":21,"tag":22,"props":32897,"children":32898},{},[32899,32901,32906],{"type":26,"value":32900},"So, the defaults for HUp can now remain blissfully unchanged, and chunking works just fine - when ",{"type":21,"tag":63,"props":32902,"children":32904},{"className":32903},[],[32905],{"type":26,"value":32680},{"type":26,"value":32907}," is specified as the read_method, the plugin will transparently alter the total size of each chunk to the nearest multiple of 6 until we reach the end of the file, ensuring that the resulting base64 remains aligned with the binary source, and allowing trivial recombination of the data URLs.",{"type":21,"tag":22,"props":32909,"children":32910},{},[32911,32913,32919],{"type":26,"value":32912},"I've also added a small convenience function to handle said recombination - check out the ",{"type":21,"tag":29,"props":32914,"children":32916},{"href":32587,"rel":32915},[93],[32917],{"type":26,"value":32918},"Github Repo",{"type":26,"value":32920}," for the details.",{"type":21,"tag":3490,"props":32922,"children":32923},{},[32924],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":32926},[32927,32928,32929],{"id":32624,"depth":254,"text":32627},{"id":32724,"depth":254,"text":32727},{"id":32882,"depth":254,"text":32885},"content:ckeefer:2015-5:file-reader-chunking.md","ckeefer/2015-5/file-reader-chunking.md","ckeefer/2015-5/file-reader-chunking",{"user":3518,"name":3519},{"_path":32935,"_dir":32936,"_draft":7,"_partial":7,"_locale":8,"title":32937,"description":32938,"publishDate":32939,"tags":32940,"excerpt":32938,"body":32941,"_type":3511,"_id":35807,"_source":3513,"_file":35808,"_stem":35809,"_extension":3516,"author":35810},"/ckeefer/2015-3/emailvalidation","2015-3","Email Validation with Django and python-social-auth","When it comes to user accounts, the standard litmus test is email validation. Besides the immediate benefits - of offering us a straightforward unique identifier for users, and making it more difficult to automate creating a mass of accounts on our service - by requiring that each account have an email address and interact therewith to confirm the addresses validity, it also offers us the chance to associate a known-working email account with a user account. This is important for transactional emails such as password resets or for potential two-factor authentication use... and if you're a little less ethical, for sending marketing desirable and informative emails about interesting products and services.","2015-07-23",[9842,18916],{"type":18,"children":32942,"toc":35798},[32943,32949,32953,32958,32972,32977,32999,33005,33015,33142,33147,33294,33331,33336,33700,33712,33825,33830,34165,34171,34177,34190,34231,34252,34257,34262,34793,34815,34820,34879,34885,34890,34900,34911,34916,34938,34943,35783,35789,35794],{"type":21,"tag":3549,"props":32944,"children":32946},{"id":32945},"so-youre-asking-yourself-robot-or-real-person",[32947],{"type":26,"value":32948},"So you're asking yourself - robot or real person?",{"type":21,"tag":22,"props":32950,"children":32951},{},[32952],{"type":26,"value":32938},{"type":21,"tag":22,"props":32954,"children":32955},{},[32956],{"type":26,"value":32957},"\"But,\" you whine piteously, \"the whole reason I integrated python-social-auth into my project was to let the OAuth providers look after this sort of thing for me!\"",{"type":21,"tag":22,"props":32959,"children":32960},{},[32961,32963,32970],{"type":26,"value":32962},"Tough rocks. ",{"type":21,"tag":29,"props":32964,"children":32967},{"href":32965,"rel":32966},"https://twittercommunity.com/t/how-to-get-email-is-using-twitter-api-on-callback-page-using-php/404/33",[93],[32968],{"type":26,"value":32969},"Twitter ain't gonna give you their users' email addresses",{"type":26,"value":32971},". Just look at all those angry comments. If their whining didn't get through to Twitter, yours isn't going to do the trick either. Besides, eventually you'll probably want to allow the user to login the good old-fashioned way, with a username (which may or may not be their email address) and a password - in which case, you'll want to handle validating their email address yourself anyways.",{"type":21,"tag":22,"props":32973,"children":32974},{},[32975],{"type":26,"value":32976},"So, given that we've already integrated python-social-auth into our Django project (some of the same principles will apply to other frameworks, but many of the details presented herein are specified to Django) - let's get email validation working as part of our user creation/authentication pipeline.",{"type":21,"tag":22,"props":32978,"children":32979},{},[32980,32981,32988,32990,32997],{"type":26,"value":108},{"type":21,"tag":29,"props":32982,"children":32985},{"href":32983,"rel":32984},"http://psa.matiasaguirre.net/docs/",[93],[32986],{"type":26,"value":32987},"python-social-auth docs",{"type":26,"value":32989}," have a rather threadbare ",{"type":21,"tag":29,"props":32991,"children":32994},{"href":32992,"rel":32993},"http://psa.matiasaguirre.net/docs/pipeline.html#email-validation",[93],[32995],{"type":26,"value":32996},"section on email validation",{"type":26,"value":32998},", so we won't be reproducing the details discussed there. Instead, let's take a look at some examples of what an implementation should look like, and some workarounds for issues encountered.",{"type":21,"tag":3549,"props":33000,"children":33002},{"id":33001},"step-1-acquiring-the-email",[33003],{"type":26,"value":33004},"Step 1 - Acquiring the Email",{"type":21,"tag":22,"props":33006,"children":33007},{},[33008,33010,33014],{"type":26,"value":33009},"To start, we'll need to be able to send emails of our own, so drop the details of your email server/service into ",{"type":21,"tag":5270,"props":33011,"children":33012},{},[33013],{"type":26,"value":19944},{"type":26,"value":191},{"type":21,"tag":200,"props":33016,"children":33018},{"className":9840,"code":33017,"language":9842,"meta":8,"style":8},"EMAIL_HOST = 'smtp.yourmailserver.com'\nEMAIL_HOST_USER = 'smtp-username'\nEMAIL_HOST_PASSWORD = 'smtp-password'\n# Port 587 is the default port for smtp submission, but some will use 25, 465, or an arbitrary port #\nEMAIL_PORT = 587  \nEMAIL_USE_TLS = True\nEMAIL_NOREPLY = \"noreply@yourserver.com\"  # Not required, but potentially useful to have defined\n",[33019],{"type":21,"tag":63,"props":33020,"children":33021},{"__ignoreMap":8},[33022,33039,33056,33073,33081,33103,33120],{"type":21,"tag":209,"props":33023,"children":33024},{"class":211,"line":212},[33025,33030,33034],{"type":21,"tag":209,"props":33026,"children":33027},{"style":263},[33028],{"type":26,"value":33029},"EMAIL_HOST",{"type":21,"tag":209,"props":33031,"children":33032},{"style":216},[33033],{"type":26,"value":271},{"type":21,"tag":209,"props":33035,"children":33036},{"style":233},[33037],{"type":26,"value":33038}," 'smtp.yourmailserver.com'\n",{"type":21,"tag":209,"props":33040,"children":33041},{"class":211,"line":244},[33042,33047,33051],{"type":21,"tag":209,"props":33043,"children":33044},{"style":263},[33045],{"type":26,"value":33046},"EMAIL_HOST_USER",{"type":21,"tag":209,"props":33048,"children":33049},{"style":216},[33050],{"type":26,"value":271},{"type":21,"tag":209,"props":33052,"children":33053},{"style":233},[33054],{"type":26,"value":33055}," 'smtp-username'\n",{"type":21,"tag":209,"props":33057,"children":33058},{"class":211,"line":254},[33059,33064,33068],{"type":21,"tag":209,"props":33060,"children":33061},{"style":263},[33062],{"type":26,"value":33063},"EMAIL_HOST_PASSWORD",{"type":21,"tag":209,"props":33065,"children":33066},{"style":216},[33067],{"type":26,"value":271},{"type":21,"tag":209,"props":33069,"children":33070},{"style":233},[33071],{"type":26,"value":33072}," 'smtp-password'\n",{"type":21,"tag":209,"props":33074,"children":33075},{"class":211,"line":279},[33076],{"type":21,"tag":209,"props":33077,"children":33078},{"style":448},[33079],{"type":26,"value":33080},"# Port 587 is the default port for smtp submission, but some will use 25, 465, or an arbitrary port #\n",{"type":21,"tag":209,"props":33082,"children":33083},{"class":211,"line":288},[33084,33089,33093,33098],{"type":21,"tag":209,"props":33085,"children":33086},{"style":263},[33087],{"type":26,"value":33088},"EMAIL_PORT",{"type":21,"tag":209,"props":33090,"children":33091},{"style":216},[33092],{"type":26,"value":271},{"type":21,"tag":209,"props":33094,"children":33095},{"style":263},[33096],{"type":26,"value":33097}," 587",{"type":21,"tag":209,"props":33099,"children":33100},{"style":222},[33101],{"type":26,"value":33102},"  \n",{"type":21,"tag":209,"props":33104,"children":33105},{"class":211,"line":307},[33106,33111,33115],{"type":21,"tag":209,"props":33107,"children":33108},{"style":263},[33109],{"type":26,"value":33110},"EMAIL_USE_TLS",{"type":21,"tag":209,"props":33112,"children":33113},{"style":216},[33114],{"type":26,"value":271},{"type":21,"tag":209,"props":33116,"children":33117},{"style":263},[33118],{"type":26,"value":33119}," True\n",{"type":21,"tag":209,"props":33121,"children":33122},{"class":211,"line":325},[33123,33128,33132,33137],{"type":21,"tag":209,"props":33124,"children":33125},{"style":263},[33126],{"type":26,"value":33127},"EMAIL_NOREPLY",{"type":21,"tag":209,"props":33129,"children":33130},{"style":216},[33131],{"type":26,"value":271},{"type":21,"tag":209,"props":33133,"children":33134},{"style":233},[33135],{"type":26,"value":33136}," \"noreply@yourserver.com\"",{"type":21,"tag":209,"props":33138,"children":33139},{"style":448},[33140],{"type":26,"value":33141},"  # Not required, but potentially useful to have defined\n",{"type":21,"tag":22,"props":33143,"children":33144},{},[33145],{"type":26,"value":33146},"We'll also need to have setup our social auth pipeline. An example:",{"type":21,"tag":200,"props":33148,"children":33150},{"className":9840,"code":33149,"language":9842,"meta":8,"style":8},"SOCIAL_AUTH_PIPELINE = (\n    'social.pipeline.social_auth.social_details',\n    'social.pipeline.social_auth.social_uid',\n    'social.pipeline.social_auth.auth_allowed',\n    'social.pipeline.social_auth.social_user',\n    'social.pipeline.user.get_username',\n    'app.auth.user_details.require_email',\n    'social.pipeline.mail.mail_validation',\n    'social.pipeline.social_auth.associate_by_email',\n    'social.pipeline.social_auth.associate_user',\n    'social.pipeline.social_auth.load_extra_data'\n)\n",[33151],{"type":21,"tag":63,"props":33152,"children":33153},{"__ignoreMap":8},[33154,33171,33183,33195,33207,33219,33231,33243,33255,33267,33279,33287],{"type":21,"tag":209,"props":33155,"children":33156},{"class":211,"line":212},[33157,33162,33166],{"type":21,"tag":209,"props":33158,"children":33159},{"style":263},[33160],{"type":26,"value":33161},"SOCIAL_AUTH_PIPELINE",{"type":21,"tag":209,"props":33163,"children":33164},{"style":216},[33165],{"type":26,"value":271},{"type":21,"tag":209,"props":33167,"children":33168},{"style":222},[33169],{"type":26,"value":33170}," (\n",{"type":21,"tag":209,"props":33172,"children":33173},{"class":211,"line":244},[33174,33179],{"type":21,"tag":209,"props":33175,"children":33176},{"style":233},[33177],{"type":26,"value":33178},"    'social.pipeline.social_auth.social_details'",{"type":21,"tag":209,"props":33180,"children":33181},{"style":222},[33182],{"type":26,"value":304},{"type":21,"tag":209,"props":33184,"children":33185},{"class":211,"line":254},[33186,33191],{"type":21,"tag":209,"props":33187,"children":33188},{"style":233},[33189],{"type":26,"value":33190},"    'social.pipeline.social_auth.social_uid'",{"type":21,"tag":209,"props":33192,"children":33193},{"style":222},[33194],{"type":26,"value":304},{"type":21,"tag":209,"props":33196,"children":33197},{"class":211,"line":279},[33198,33203],{"type":21,"tag":209,"props":33199,"children":33200},{"style":233},[33201],{"type":26,"value":33202},"    'social.pipeline.social_auth.auth_allowed'",{"type":21,"tag":209,"props":33204,"children":33205},{"style":222},[33206],{"type":26,"value":304},{"type":21,"tag":209,"props":33208,"children":33209},{"class":211,"line":288},[33210,33215],{"type":21,"tag":209,"props":33211,"children":33212},{"style":233},[33213],{"type":26,"value":33214},"    'social.pipeline.social_auth.social_user'",{"type":21,"tag":209,"props":33216,"children":33217},{"style":222},[33218],{"type":26,"value":304},{"type":21,"tag":209,"props":33220,"children":33221},{"class":211,"line":307},[33222,33227],{"type":21,"tag":209,"props":33223,"children":33224},{"style":233},[33225],{"type":26,"value":33226},"    'social.pipeline.user.get_username'",{"type":21,"tag":209,"props":33228,"children":33229},{"style":222},[33230],{"type":26,"value":304},{"type":21,"tag":209,"props":33232,"children":33233},{"class":211,"line":325},[33234,33239],{"type":21,"tag":209,"props":33235,"children":33236},{"style":233},[33237],{"type":26,"value":33238},"    'app.auth.user_details.require_email'",{"type":21,"tag":209,"props":33240,"children":33241},{"style":222},[33242],{"type":26,"value":304},{"type":21,"tag":209,"props":33244,"children":33245},{"class":211,"line":334},[33246,33251],{"type":21,"tag":209,"props":33247,"children":33248},{"style":233},[33249],{"type":26,"value":33250},"    'social.pipeline.mail.mail_validation'",{"type":21,"tag":209,"props":33252,"children":33253},{"style":222},[33254],{"type":26,"value":304},{"type":21,"tag":209,"props":33256,"children":33257},{"class":211,"line":343},[33258,33263],{"type":21,"tag":209,"props":33259,"children":33260},{"style":233},[33261],{"type":26,"value":33262},"    'social.pipeline.social_auth.associate_by_email'",{"type":21,"tag":209,"props":33264,"children":33265},{"style":222},[33266],{"type":26,"value":304},{"type":21,"tag":209,"props":33268,"children":33269},{"class":211,"line":351},[33270,33275],{"type":21,"tag":209,"props":33271,"children":33272},{"style":233},[33273],{"type":26,"value":33274},"    'social.pipeline.social_auth.associate_user'",{"type":21,"tag":209,"props":33276,"children":33277},{"style":222},[33278],{"type":26,"value":304},{"type":21,"tag":209,"props":33280,"children":33281},{"class":211,"line":444},[33282],{"type":21,"tag":209,"props":33283,"children":33284},{"style":233},[33285],{"type":26,"value":33286},"    'social.pipeline.social_auth.load_extra_data'\n",{"type":21,"tag":209,"props":33288,"children":33289},{"class":211,"line":454},[33290],{"type":21,"tag":209,"props":33291,"children":33292},{"style":222},[33293],{"type":26,"value":10112},{"type":21,"tag":22,"props":33295,"children":33296},{},[33297,33299,33305,33306,33312,33314,33320,33322,33329],{"type":26,"value":33298},"The exact makeup and order of this pipeline will depend on the needs of your project. The elements of interest to us for the sake of setting up email validation are the lines ",{"type":21,"tag":63,"props":33300,"children":33302},{"className":33301},[],[33303],{"type":26,"value":33304},"app.auth.user_details.require_email",{"type":26,"value":7274},{"type":21,"tag":63,"props":33307,"children":33309},{"className":33308},[],[33310],{"type":26,"value":33311},"social.pipeline.mail.mail_validation",{"type":26,"value":33313},". Note also that we include these lines before ",{"type":21,"tag":63,"props":33315,"children":33317},{"className":33316},[],[33318],{"type":26,"value":33319},"associate_by_email",{"type":26,"value":33321}," - we don't want to associate users by email until we've confirmed that the user actually owns the email account they've entered, or they could gain control over someone's else's account (see the ",{"type":21,"tag":29,"props":33323,"children":33326},{"href":33324,"rel":33325},"http://psa.matiasaguirre.net/docs/use_cases.html#associate-users-by-email",[93],[33327],{"type":26,"value":33328},"warnings regarding associate_by_email in the python-social-auth docs",{"type":26,"value":33330}," for more details).",{"type":21,"tag":22,"props":33332,"children":33333},{},[33334],{"type":26,"value":33335},"Returning to the two entries in the pipeline I've called out - the former is a partial pipeline function that we create ourselves, to decide whether we need to ask the user for their email at this point in the process. This allows us to proceed seamlessly when we're logging the user in with a service that provides the email (like Google+ or Facebook), while allowing us to present the user with a form to fill in the necessary details otherwise. This fucntion could look something like:",{"type":21,"tag":200,"props":33337,"children":33339},{"className":9840,"code":33338,"language":9842,"meta":8,"style":8},"from django.shortcuts import redirect\nfrom social.pipeline.partial import partial\nfrom social.pipeline.user import USER_FIELDS\n\ndef require_email(strategy, details, user=None, is_new=False, *args, **kwargs):\n    backend = kwargs.get('backend')\n    if user and user.email:\n        return # The user we're logging in already has their email attribute set\n    elif is_new and and not details.get('email'):\n        # If we're creating a new user, and we can't find the email in the details\n        # we'll attempt to request it from the data returned from our backend strategy\n        userEmail = strategy.request_data().get('email')\n        if userEmail:\n            details['email'] = userEmail\n        else:\n            # If there's no email information to be had, we need to ask the user to fill it in\n            # This should redirect us to a view\n            return redirect('acquire_email')\n",[33340],{"type":21,"tag":63,"props":33341,"children":33342},{"__ignoreMap":8},[33343,33363,33384,33405,33412,33474,33500,33522,33534,33574,33582,33590,33615,33627,33652,33663,33671,33679],{"type":21,"tag":209,"props":33344,"children":33345},{"class":211,"line":212},[33346,33350,33354,33358],{"type":21,"tag":209,"props":33347,"children":33348},{"style":216},[33349],{"type":26,"value":230},{"type":21,"tag":209,"props":33351,"children":33352},{"style":222},[33353],{"type":26,"value":23838},{"type":21,"tag":209,"props":33355,"children":33356},{"style":216},[33357],{"type":26,"value":219},{"type":21,"tag":209,"props":33359,"children":33360},{"style":222},[33361],{"type":26,"value":33362}," redirect\n",{"type":21,"tag":209,"props":33364,"children":33365},{"class":211,"line":244},[33366,33370,33375,33379],{"type":21,"tag":209,"props":33367,"children":33368},{"style":216},[33369],{"type":26,"value":230},{"type":21,"tag":209,"props":33371,"children":33372},{"style":222},[33373],{"type":26,"value":33374}," social.pipeline.partial ",{"type":21,"tag":209,"props":33376,"children":33377},{"style":216},[33378],{"type":26,"value":219},{"type":21,"tag":209,"props":33380,"children":33381},{"style":222},[33382],{"type":26,"value":33383}," partial\n",{"type":21,"tag":209,"props":33385,"children":33386},{"class":211,"line":254},[33387,33391,33396,33400],{"type":21,"tag":209,"props":33388,"children":33389},{"style":216},[33390],{"type":26,"value":230},{"type":21,"tag":209,"props":33392,"children":33393},{"style":222},[33394],{"type":26,"value":33395}," social.pipeline.user ",{"type":21,"tag":209,"props":33397,"children":33398},{"style":216},[33399],{"type":26,"value":219},{"type":21,"tag":209,"props":33401,"children":33402},{"style":263},[33403],{"type":26,"value":33404}," USER_FIELDS\n",{"type":21,"tag":209,"props":33406,"children":33407},{"class":211,"line":279},[33408],{"type":21,"tag":209,"props":33409,"children":33410},{"emptyLinePlaceholder":248},[33411],{"type":26,"value":251},{"type":21,"tag":209,"props":33413,"children":33414},{"class":211,"line":288},[33415,33419,33424,33429,33433,33437,33442,33446,33451,33455,33459,33464,33469],{"type":21,"tag":209,"props":33416,"children":33417},{"style":216},[33418],{"type":26,"value":9882},{"type":21,"tag":209,"props":33420,"children":33421},{"style":360},[33422],{"type":26,"value":33423}," require_email",{"type":21,"tag":209,"props":33425,"children":33426},{"style":222},[33427],{"type":26,"value":33428},"(strategy, details, user",{"type":21,"tag":209,"props":33430,"children":33431},{"style":216},[33432],{"type":26,"value":1432},{"type":21,"tag":209,"props":33434,"children":33435},{"style":263},[33436],{"type":26,"value":13412},{"type":21,"tag":209,"props":33438,"children":33439},{"style":222},[33440],{"type":26,"value":33441},", is_new",{"type":21,"tag":209,"props":33443,"children":33444},{"style":216},[33445],{"type":26,"value":1432},{"type":21,"tag":209,"props":33447,"children":33448},{"style":263},[33449],{"type":26,"value":33450},"False",{"type":21,"tag":209,"props":33452,"children":33453},{"style":222},[33454],{"type":26,"value":408},{"type":21,"tag":209,"props":33456,"children":33457},{"style":216},[33458],{"type":26,"value":944},{"type":21,"tag":209,"props":33460,"children":33461},{"style":222},[33462],{"type":26,"value":33463},"args, ",{"type":21,"tag":209,"props":33465,"children":33466},{"style":216},[33467],{"type":26,"value":33468},"**",{"type":21,"tag":209,"props":33470,"children":33471},{"style":222},[33472],{"type":26,"value":33473},"kwargs):\n",{"type":21,"tag":209,"props":33475,"children":33476},{"class":211,"line":307},[33477,33482,33486,33491,33496],{"type":21,"tag":209,"props":33478,"children":33479},{"style":222},[33480],{"type":26,"value":33481},"    backend ",{"type":21,"tag":209,"props":33483,"children":33484},{"style":216},[33485],{"type":26,"value":1432},{"type":21,"tag":209,"props":33487,"children":33488},{"style":222},[33489],{"type":26,"value":33490}," kwargs.get(",{"type":21,"tag":209,"props":33492,"children":33493},{"style":233},[33494],{"type":26,"value":33495},"'backend'",{"type":21,"tag":209,"props":33497,"children":33498},{"style":222},[33499],{"type":26,"value":10112},{"type":21,"tag":209,"props":33501,"children":33502},{"class":211,"line":325},[33503,33507,33512,33517],{"type":21,"tag":209,"props":33504,"children":33505},{"style":216},[33506],{"type":26,"value":10853},{"type":21,"tag":209,"props":33508,"children":33509},{"style":222},[33510],{"type":26,"value":33511}," user ",{"type":21,"tag":209,"props":33513,"children":33514},{"style":216},[33515],{"type":26,"value":33516},"and",{"type":21,"tag":209,"props":33518,"children":33519},{"style":222},[33520],{"type":26,"value":33521}," user.email:\n",{"type":21,"tag":209,"props":33523,"children":33524},{"class":211,"line":334},[33525,33529],{"type":21,"tag":209,"props":33526,"children":33527},{"style":216},[33528],{"type":26,"value":3069},{"type":21,"tag":209,"props":33530,"children":33531},{"style":448},[33532],{"type":26,"value":33533}," # The user we're logging in already has their email attribute set\n",{"type":21,"tag":209,"props":33535,"children":33536},{"class":211,"line":343},[33537,33542,33547,33551,33556,33560,33565,33570],{"type":21,"tag":209,"props":33538,"children":33539},{"style":216},[33540],{"type":26,"value":33541},"    elif",{"type":21,"tag":209,"props":33543,"children":33544},{"style":222},[33545],{"type":26,"value":33546}," is_new ",{"type":21,"tag":209,"props":33548,"children":33549},{"style":216},[33550],{"type":26,"value":33516},{"type":21,"tag":209,"props":33552,"children":33553},{"style":216},[33554],{"type":26,"value":33555}," and",{"type":21,"tag":209,"props":33557,"children":33558},{"style":216},[33559],{"type":26,"value":26025},{"type":21,"tag":209,"props":33561,"children":33562},{"style":222},[33563],{"type":26,"value":33564}," details.get(",{"type":21,"tag":209,"props":33566,"children":33567},{"style":233},[33568],{"type":26,"value":33569},"'email'",{"type":21,"tag":209,"props":33571,"children":33572},{"style":222},[33573],{"type":26,"value":23904},{"type":21,"tag":209,"props":33575,"children":33576},{"class":211,"line":351},[33577],{"type":21,"tag":209,"props":33578,"children":33579},{"style":448},[33580],{"type":26,"value":33581},"        # If we're creating a new user, and we can't find the email in the details\n",{"type":21,"tag":209,"props":33583,"children":33584},{"class":211,"line":444},[33585],{"type":21,"tag":209,"props":33586,"children":33587},{"style":448},[33588],{"type":26,"value":33589},"        # we'll attempt to request it from the data returned from our backend strategy\n",{"type":21,"tag":209,"props":33591,"children":33592},{"class":211,"line":454},[33593,33598,33602,33607,33611],{"type":21,"tag":209,"props":33594,"children":33595},{"style":222},[33596],{"type":26,"value":33597},"        userEmail ",{"type":21,"tag":209,"props":33599,"children":33600},{"style":216},[33601],{"type":26,"value":1432},{"type":21,"tag":209,"props":33603,"children":33604},{"style":222},[33605],{"type":26,"value":33606}," strategy.request_data().get(",{"type":21,"tag":209,"props":33608,"children":33609},{"style":233},[33610],{"type":26,"value":33569},{"type":21,"tag":209,"props":33612,"children":33613},{"style":222},[33614],{"type":26,"value":10112},{"type":21,"tag":209,"props":33616,"children":33617},{"class":211,"line":463},[33618,33622],{"type":21,"tag":209,"props":33619,"children":33620},{"style":216},[33621],{"type":26,"value":5803},{"type":21,"tag":209,"props":33623,"children":33624},{"style":222},[33625],{"type":26,"value":33626}," userEmail:\n",{"type":21,"tag":209,"props":33628,"children":33629},{"class":211,"line":472},[33630,33635,33639,33643,33647],{"type":21,"tag":209,"props":33631,"children":33632},{"style":222},[33633],{"type":26,"value":33634},"            details[",{"type":21,"tag":209,"props":33636,"children":33637},{"style":233},[33638],{"type":26,"value":33569},{"type":21,"tag":209,"props":33640,"children":33641},{"style":222},[33642],{"type":26,"value":1427},{"type":21,"tag":209,"props":33644,"children":33645},{"style":216},[33646],{"type":26,"value":1432},{"type":21,"tag":209,"props":33648,"children":33649},{"style":222},[33650],{"type":26,"value":33651}," userEmail\n",{"type":21,"tag":209,"props":33653,"children":33654},{"class":211,"line":480},[33655,33659],{"type":21,"tag":209,"props":33656,"children":33657},{"style":216},[33658],{"type":26,"value":26146},{"type":21,"tag":209,"props":33660,"children":33661},{"style":222},[33662],{"type":26,"value":844},{"type":21,"tag":209,"props":33664,"children":33665},{"class":211,"line":489},[33666],{"type":21,"tag":209,"props":33667,"children":33668},{"style":448},[33669],{"type":26,"value":33670},"            # If there's no email information to be had, we need to ask the user to fill it in\n",{"type":21,"tag":209,"props":33672,"children":33673},{"class":211,"line":847},[33674],{"type":21,"tag":209,"props":33675,"children":33676},{"style":448},[33677],{"type":26,"value":33678},"            # This should redirect us to a view\n",{"type":21,"tag":209,"props":33680,"children":33681},{"class":211,"line":860},[33682,33686,33691,33696],{"type":21,"tag":209,"props":33683,"children":33684},{"style":216},[33685],{"type":26,"value":5101},{"type":21,"tag":209,"props":33687,"children":33688},{"style":222},[33689],{"type":26,"value":33690}," redirect(",{"type":21,"tag":209,"props":33692,"children":33693},{"style":233},[33694],{"type":26,"value":33695},"'acquire_email'",{"type":21,"tag":209,"props":33697,"children":33698},{"style":222},[33699],{"type":26,"value":10112},{"type":21,"tag":22,"props":33701,"children":33702},{},[33703,33704,33710],{"type":26,"value":108},{"type":21,"tag":63,"props":33705,"children":33707},{"className":33706},[],[33708],{"type":26,"value":33709},"acquire_email",{"type":26,"value":33711}," view we're redirecting to can look something like the following:",{"type":21,"tag":200,"props":33713,"children":33715},{"className":9840,"code":33714,"language":9842,"meta":8,"style":8},"def acquire_email(request, template_name=\"email/acquire.html\"):\n    \"\"\"\n    Request email for the create user flow for logins that don't specify their email address.\n    \"\"\"\n    backend = request.session['partial_pipeline']['backend']\n    return render(request, template_name, {\"backend\": backend})\n",[33716],{"type":21,"tag":63,"props":33717,"children":33718},{"__ignoreMap":8},[33719,33748,33755,33763,33770,33804],{"type":21,"tag":209,"props":33720,"children":33721},{"class":211,"line":212},[33722,33726,33731,33735,33739,33744],{"type":21,"tag":209,"props":33723,"children":33724},{"style":216},[33725],{"type":26,"value":9882},{"type":21,"tag":209,"props":33727,"children":33728},{"style":360},[33729],{"type":26,"value":33730}," acquire_email",{"type":21,"tag":209,"props":33732,"children":33733},{"style":222},[33734],{"type":26,"value":23890},{"type":21,"tag":209,"props":33736,"children":33737},{"style":216},[33738],{"type":26,"value":1432},{"type":21,"tag":209,"props":33740,"children":33741},{"style":233},[33742],{"type":26,"value":33743},"\"email/acquire.html\"",{"type":21,"tag":209,"props":33745,"children":33746},{"style":222},[33747],{"type":26,"value":23904},{"type":21,"tag":209,"props":33749,"children":33750},{"class":211,"line":244},[33751],{"type":21,"tag":209,"props":33752,"children":33753},{"style":233},[33754],{"type":26,"value":9900},{"type":21,"tag":209,"props":33756,"children":33757},{"class":211,"line":254},[33758],{"type":21,"tag":209,"props":33759,"children":33760},{"style":233},[33761],{"type":26,"value":33762},"    Request email for the create user flow for logins that don't specify their email address.\n",{"type":21,"tag":209,"props":33764,"children":33765},{"class":211,"line":279},[33766],{"type":21,"tag":209,"props":33767,"children":33768},{"style":233},[33769],{"type":26,"value":9900},{"type":21,"tag":209,"props":33771,"children":33772},{"class":211,"line":288},[33773,33777,33781,33786,33791,33796,33800],{"type":21,"tag":209,"props":33774,"children":33775},{"style":222},[33776],{"type":26,"value":33481},{"type":21,"tag":209,"props":33778,"children":33779},{"style":216},[33780],{"type":26,"value":1432},{"type":21,"tag":209,"props":33782,"children":33783},{"style":222},[33784],{"type":26,"value":33785}," request.session[",{"type":21,"tag":209,"props":33787,"children":33788},{"style":233},[33789],{"type":26,"value":33790},"'partial_pipeline'",{"type":21,"tag":209,"props":33792,"children":33793},{"style":222},[33794],{"type":26,"value":33795},"][",{"type":21,"tag":209,"props":33797,"children":33798},{"style":233},[33799],{"type":26,"value":33495},{"type":21,"tag":209,"props":33801,"children":33802},{"style":222},[33803],{"type":26,"value":10292},{"type":21,"tag":209,"props":33805,"children":33806},{"class":211,"line":307},[33807,33811,33815,33820],{"type":21,"tag":209,"props":33808,"children":33809},{"style":216},[33810],{"type":26,"value":1298},{"type":21,"tag":209,"props":33812,"children":33813},{"style":222},[33814],{"type":26,"value":24026},{"type":21,"tag":209,"props":33816,"children":33817},{"style":233},[33818],{"type":26,"value":33819},"\"backend\"",{"type":21,"tag":209,"props":33821,"children":33822},{"style":222},[33823],{"type":26,"value":33824},": backend})\n",{"type":21,"tag":22,"props":33826,"children":33827},{},[33828],{"type":26,"value":33829},"And somewhere within the template, add a form that will submit the required data into the pipeline:",{"type":21,"tag":200,"props":33831,"children":33833},{"className":7947,"code":33832,"language":7949,"meta":8,"style":8},"\u003Cform action=\"{% url \"social:complete\" backend=backend %}\" method=\"post\" role=\"form\">\n    {% csrf_token %}\n    \u003Cdiv class=\"form-group\">\n        \u003Clabel class=\"control-label\" for=\"email\">Email address:\u003C/label>\n        \u003Cinput class=\"form-control\" id=\"email\" type=\"email\" name=\"email\" value=\"\" required />\n    \u003C/div>\n    \u003Cbutton type=\"submit\">Submit\u003C/button>\n\u003C/form>\n",[33834],{"type":21,"tag":63,"props":33835,"children":33836},{"__ignoreMap":8},[33837,33926,33934,33963,34015,34099,34114,34150],{"type":21,"tag":209,"props":33838,"children":33839},{"class":211,"line":212},[33840,33844,33848,33853,33857,33862,33867,33871,33876,33880,33885,33890,33894,33899,33903,33908,33913,33917,33922],{"type":21,"tag":209,"props":33841,"children":33842},{"style":222},[33843],{"type":26,"value":1985},{"type":21,"tag":209,"props":33845,"children":33846},{"style":1988},[33847],{"type":26,"value":24477},{"type":21,"tag":209,"props":33849,"children":33850},{"style":360},[33851],{"type":26,"value":33852}," action",{"type":21,"tag":209,"props":33854,"children":33855},{"style":222},[33856],{"type":26,"value":1432},{"type":21,"tag":209,"props":33858,"children":33859},{"style":233},[33860],{"type":26,"value":33861},"\"{% url \"",{"type":21,"tag":209,"props":33863,"children":33864},{"style":360},[33865],{"type":26,"value":33866},"social:complete",{"type":21,"tag":209,"props":33868,"children":33869},{"style":20979},[33870],{"type":26,"value":10018},{"type":21,"tag":209,"props":33872,"children":33873},{"style":360},[33874],{"type":26,"value":33875}," backend",{"type":21,"tag":209,"props":33877,"children":33878},{"style":222},[33879],{"type":26,"value":1432},{"type":21,"tag":209,"props":33881,"children":33882},{"style":233},[33883],{"type":26,"value":33884},"backend",{"type":21,"tag":209,"props":33886,"children":33887},{"style":360},[33888],{"type":26,"value":33889}," %}",{"type":21,"tag":209,"props":33891,"children":33892},{"style":20979},[33893],{"type":26,"value":10018},{"type":21,"tag":209,"props":33895,"children":33896},{"style":360},[33897],{"type":26,"value":33898}," method",{"type":21,"tag":209,"props":33900,"children":33901},{"style":222},[33902],{"type":26,"value":1432},{"type":21,"tag":209,"props":33904,"children":33905},{"style":233},[33906],{"type":26,"value":33907},"\"post\"",{"type":21,"tag":209,"props":33909,"children":33910},{"style":360},[33911],{"type":26,"value":33912}," role",{"type":21,"tag":209,"props":33914,"children":33915},{"style":222},[33916],{"type":26,"value":1432},{"type":21,"tag":209,"props":33918,"children":33919},{"style":233},[33920],{"type":26,"value":33921},"\"form\"",{"type":21,"tag":209,"props":33923,"children":33924},{"style":222},[33925],{"type":26,"value":1996},{"type":21,"tag":209,"props":33927,"children":33928},{"class":211,"line":244},[33929],{"type":21,"tag":209,"props":33930,"children":33931},{"style":222},[33932],{"type":26,"value":33933},"    {% csrf_token %}\n",{"type":21,"tag":209,"props":33935,"children":33936},{"class":211,"line":254},[33937,33941,33945,33950,33954,33959],{"type":21,"tag":209,"props":33938,"children":33939},{"style":222},[33940],{"type":26,"value":2004},{"type":21,"tag":209,"props":33942,"children":33943},{"style":1988},[33944],{"type":26,"value":2009},{"type":21,"tag":209,"props":33946,"children":33947},{"style":360},[33948],{"type":26,"value":33949}," class",{"type":21,"tag":209,"props":33951,"children":33952},{"style":222},[33953],{"type":26,"value":1432},{"type":21,"tag":209,"props":33955,"children":33956},{"style":233},[33957],{"type":26,"value":33958},"\"form-group\"",{"type":21,"tag":209,"props":33960,"children":33961},{"style":222},[33962],{"type":26,"value":1996},{"type":21,"tag":209,"props":33964,"children":33965},{"class":211,"line":279},[33966,33970,33975,33979,33983,33988,33993,33997,34002,34007,34011],{"type":21,"tag":209,"props":33967,"children":33968},{"style":222},[33969],{"type":26,"value":24472},{"type":21,"tag":209,"props":33971,"children":33972},{"style":1988},[33973],{"type":26,"value":33974},"label",{"type":21,"tag":209,"props":33976,"children":33977},{"style":360},[33978],{"type":26,"value":33949},{"type":21,"tag":209,"props":33980,"children":33981},{"style":222},[33982],{"type":26,"value":1432},{"type":21,"tag":209,"props":33984,"children":33985},{"style":233},[33986],{"type":26,"value":33987},"\"control-label\"",{"type":21,"tag":209,"props":33989,"children":33990},{"style":360},[33991],{"type":26,"value":33992}," for",{"type":21,"tag":209,"props":33994,"children":33995},{"style":222},[33996],{"type":26,"value":1432},{"type":21,"tag":209,"props":33998,"children":33999},{"style":233},[34000],{"type":26,"value":34001},"\"email\"",{"type":21,"tag":209,"props":34003,"children":34004},{"style":222},[34005],{"type":26,"value":34006},">Email address:\u003C/",{"type":21,"tag":209,"props":34008,"children":34009},{"style":1988},[34010],{"type":26,"value":33974},{"type":21,"tag":209,"props":34012,"children":34013},{"style":222},[34014],{"type":26,"value":1996},{"type":21,"tag":209,"props":34016,"children":34017},{"class":211,"line":288},[34018,34022,34027,34031,34035,34040,34044,34048,34052,34056,34060,34064,34068,34072,34076,34081,34085,34090,34095],{"type":21,"tag":209,"props":34019,"children":34020},{"style":222},[34021],{"type":26,"value":24472},{"type":21,"tag":209,"props":34023,"children":34024},{"style":1988},[34025],{"type":26,"value":34026},"input",{"type":21,"tag":209,"props":34028,"children":34029},{"style":360},[34030],{"type":26,"value":33949},{"type":21,"tag":209,"props":34032,"children":34033},{"style":222},[34034],{"type":26,"value":1432},{"type":21,"tag":209,"props":34036,"children":34037},{"style":233},[34038],{"type":26,"value":34039},"\"form-control\"",{"type":21,"tag":209,"props":34041,"children":34042},{"style":360},[34043],{"type":26,"value":24498},{"type":21,"tag":209,"props":34045,"children":34046},{"style":222},[34047],{"type":26,"value":1432},{"type":21,"tag":209,"props":34049,"children":34050},{"style":233},[34051],{"type":26,"value":34001},{"type":21,"tag":209,"props":34053,"children":34054},{"style":360},[34055],{"type":26,"value":24544},{"type":21,"tag":209,"props":34057,"children":34058},{"style":222},[34059],{"type":26,"value":1432},{"type":21,"tag":209,"props":34061,"children":34062},{"style":233},[34063],{"type":26,"value":34001},{"type":21,"tag":209,"props":34065,"children":34066},{"style":360},[34067],{"type":26,"value":8099},{"type":21,"tag":209,"props":34069,"children":34070},{"style":222},[34071],{"type":26,"value":1432},{"type":21,"tag":209,"props":34073,"children":34074},{"style":233},[34075],{"type":26,"value":34001},{"type":21,"tag":209,"props":34077,"children":34078},{"style":360},[34079],{"type":26,"value":34080}," value",{"type":21,"tag":209,"props":34082,"children":34083},{"style":222},[34084],{"type":26,"value":1432},{"type":21,"tag":209,"props":34086,"children":34087},{"style":233},[34088],{"type":26,"value":34089},"\"\"",{"type":21,"tag":209,"props":34091,"children":34092},{"style":360},[34093],{"type":26,"value":34094}," required",{"type":21,"tag":209,"props":34096,"children":34097},{"style":222},[34098],{"type":26,"value":8127},{"type":21,"tag":209,"props":34100,"children":34101},{"class":211,"line":307},[34102,34106,34110],{"type":21,"tag":209,"props":34103,"children":34104},{"style":222},[34105],{"type":26,"value":24597},{"type":21,"tag":209,"props":34107,"children":34108},{"style":1988},[34109],{"type":26,"value":2009},{"type":21,"tag":209,"props":34111,"children":34112},{"style":222},[34113],{"type":26,"value":1996},{"type":21,"tag":209,"props":34115,"children":34116},{"class":211,"line":325},[34117,34121,34125,34129,34133,34137,34142,34146],{"type":21,"tag":209,"props":34118,"children":34119},{"style":222},[34120],{"type":26,"value":2004},{"type":21,"tag":209,"props":34122,"children":34123},{"style":1988},[34124],{"type":26,"value":24539},{"type":21,"tag":209,"props":34126,"children":34127},{"style":360},[34128],{"type":26,"value":24544},{"type":21,"tag":209,"props":34130,"children":34131},{"style":222},[34132],{"type":26,"value":1432},{"type":21,"tag":209,"props":34134,"children":34135},{"style":233},[34136],{"type":26,"value":24553},{"type":21,"tag":209,"props":34138,"children":34139},{"style":222},[34140],{"type":26,"value":34141},">Submit\u003C/",{"type":21,"tag":209,"props":34143,"children":34144},{"style":1988},[34145],{"type":26,"value":24539},{"type":21,"tag":209,"props":34147,"children":34148},{"style":222},[34149],{"type":26,"value":1996},{"type":21,"tag":209,"props":34151,"children":34152},{"class":211,"line":334},[34153,34157,34161],{"type":21,"tag":209,"props":34154,"children":34155},{"style":222},[34156],{"type":26,"value":2024},{"type":21,"tag":209,"props":34158,"children":34159},{"style":1988},[34160],{"type":26,"value":24477},{"type":21,"tag":209,"props":34162,"children":34163},{"style":222},[34164],{"type":26,"value":1996},{"type":21,"tag":193,"props":34166,"children":34168},{"id":34167},"thats-step-1-complete",[34169],{"type":26,"value":34170},"That's step 1 complete...",{"type":21,"tag":3549,"props":34172,"children":34174},{"id":34173},"step-2-validating-the-email",[34175],{"type":26,"value":34176},"Step 2 - Validating the email",{"type":21,"tag":22,"props":34178,"children":34179},{},[34180,34182,34188],{"type":26,"value":34181},"The latter of the two pipeline functions called out is the ",{"type":21,"tag":29,"props":34183,"children":34185},{"href":32992,"rel":34184},[93],[34186],{"type":26,"value":34187},"email validation partial pipeline discussed in the docs",{"type":26,"value":34189},". In order to effectively use it, we need to include a few additional entries in settings.py, as well as create some further custom functions.",{"type":21,"tag":200,"props":34191,"children":34193},{"className":9840,"code":34192,"language":9842,"meta":8,"style":8},"SOCIAL_AUTH_EMAIL_VALIDATION_FUNCTION = 'app.email.SendVerificationEmail'\nSOCIAL_AUTH_EMAIL_VALIDATION_URL = '/email_verify_sent/'\n",[34194],{"type":21,"tag":63,"props":34195,"children":34196},{"__ignoreMap":8},[34197,34214],{"type":21,"tag":209,"props":34198,"children":34199},{"class":211,"line":212},[34200,34205,34209],{"type":21,"tag":209,"props":34201,"children":34202},{"style":263},[34203],{"type":26,"value":34204},"SOCIAL_AUTH_EMAIL_VALIDATION_FUNCTION",{"type":21,"tag":209,"props":34206,"children":34207},{"style":216},[34208],{"type":26,"value":271},{"type":21,"tag":209,"props":34210,"children":34211},{"style":233},[34212],{"type":26,"value":34213}," 'app.email.SendVerificationEmail'\n",{"type":21,"tag":209,"props":34215,"children":34216},{"class":211,"line":244},[34217,34222,34226],{"type":21,"tag":209,"props":34218,"children":34219},{"style":263},[34220],{"type":26,"value":34221},"SOCIAL_AUTH_EMAIL_VALIDATION_URL",{"type":21,"tag":209,"props":34223,"children":34224},{"style":216},[34225],{"type":26,"value":271},{"type":21,"tag":209,"props":34227,"children":34228},{"style":233},[34229],{"type":26,"value":34230}," '/email_verify_sent/'\n",{"type":21,"tag":22,"props":34232,"children":34233},{},[34234,34236,34242,34244,34250],{"type":26,"value":34235},"The latter of these two is the url that the user will be redirected to once the validation email has been sent - you should add a view and url entry for this as per usual. For the former, we'll need to create a function that actually sends the verifiction email. Here we've created it in a module ",{"type":21,"tag":63,"props":34237,"children":34239},{"className":34238},[],[34240],{"type":26,"value":34241},"email",{"type":26,"value":34243}," within the application ",{"type":21,"tag":63,"props":34245,"children":34247},{"className":34246},[],[34248],{"type":26,"value":34249},"app",{"type":26,"value":34251},", but those are details that can be altered according to your project's needs.",{"type":21,"tag":22,"props":34253,"children":34254},{},[34255],{"type":26,"value":34256},"The function itself needs to build the email text you're going to send, and include some details that will enable the email validation partial_pipeline to resume. We'll be including more than the standard recommended details for reasons we'll discuss momentarily.",{"type":21,"tag":22,"props":34258,"children":34259},{},[34260],{"type":26,"value":34261},"Your email verification function should look something like the following:",{"type":21,"tag":200,"props":34263,"children":34265},{"className":9840,"code":34264,"language":9842,"meta":8,"style":8},"from django.core import signing\nfrom django.core.mail import EmailMultiAlternatives\n\ndef SendVerificationEmail(strategy, backend, code):\n    \"\"\"\n    Send an email with an embedded verification code and the necessary details to restore the required session\n    elements to complete the verification and sign-in, regardless of what browser the user completes the\n    verification from.\n    \"\"\"\n    signature = signing.dumps({\"session_key\": strategy.session.session_key, \"email\": code.email},\n                              key=settings.EMAIL_SECRET_KEY)\n    verifyURL = \"{0}?verification_code={1}&signature={2}\".format(\n        reverse('social:complete', args=(backend.name,)),\n        code.code, signature)\n    verifyURL = strategy.request.build_absolute_uri(verifyURL)   \n\n    emailHTML = # Include your function that returns an html string here\n    emailText = \"\"\"Welcome to MyApp!\nIn order to login with your new user account, you need to verify your email address with us.\nPlease copy and paste the following into your browser's url bar: {verifyURL}\n\"\"\".format(verifyURL=verifyURL)\n\n    kwargs = {\n        \"subject\": \"Verify Your Account\",\n        \"body\": emailText,\n        \"from_email\": \"MyApp \",\n        \"to\": [\"recipient@email.address\"],\n    }\n\n    email = EmailMultiAlternatives(**kwargs)\n    email.attach_alternative(emailHTML, \"text/html\")\n    email.send()\n",[34266],{"type":21,"tag":63,"props":34267,"children":34268},{"__ignoreMap":8},[34269,34290,34311,34318,34335,34342,34350,34358,34366,34373,34409,34434,34485,34516,34524,34540,34547,34564,34581,34589,34602,34629,34636,34652,34673,34686,34707,34728,34735,34742,34768,34785],{"type":21,"tag":209,"props":34270,"children":34271},{"class":211,"line":212},[34272,34276,34281,34285],{"type":21,"tag":209,"props":34273,"children":34274},{"style":216},[34275],{"type":26,"value":230},{"type":21,"tag":209,"props":34277,"children":34278},{"style":222},[34279],{"type":26,"value":34280}," django.core ",{"type":21,"tag":209,"props":34282,"children":34283},{"style":216},[34284],{"type":26,"value":219},{"type":21,"tag":209,"props":34286,"children":34287},{"style":222},[34288],{"type":26,"value":34289}," signing\n",{"type":21,"tag":209,"props":34291,"children":34292},{"class":211,"line":244},[34293,34297,34302,34306],{"type":21,"tag":209,"props":34294,"children":34295},{"style":216},[34296],{"type":26,"value":230},{"type":21,"tag":209,"props":34298,"children":34299},{"style":222},[34300],{"type":26,"value":34301}," django.core.mail ",{"type":21,"tag":209,"props":34303,"children":34304},{"style":216},[34305],{"type":26,"value":219},{"type":21,"tag":209,"props":34307,"children":34308},{"style":222},[34309],{"type":26,"value":34310}," EmailMultiAlternatives\n",{"type":21,"tag":209,"props":34312,"children":34313},{"class":211,"line":254},[34314],{"type":21,"tag":209,"props":34315,"children":34316},{"emptyLinePlaceholder":248},[34317],{"type":26,"value":251},{"type":21,"tag":209,"props":34319,"children":34320},{"class":211,"line":279},[34321,34325,34330],{"type":21,"tag":209,"props":34322,"children":34323},{"style":216},[34324],{"type":26,"value":9882},{"type":21,"tag":209,"props":34326,"children":34327},{"style":360},[34328],{"type":26,"value":34329}," SendVerificationEmail",{"type":21,"tag":209,"props":34331,"children":34332},{"style":222},[34333],{"type":26,"value":34334},"(strategy, backend, code):\n",{"type":21,"tag":209,"props":34336,"children":34337},{"class":211,"line":288},[34338],{"type":21,"tag":209,"props":34339,"children":34340},{"style":233},[34341],{"type":26,"value":9900},{"type":21,"tag":209,"props":34343,"children":34344},{"class":211,"line":307},[34345],{"type":21,"tag":209,"props":34346,"children":34347},{"style":233},[34348],{"type":26,"value":34349},"    Send an email with an embedded verification code and the necessary details to restore the required session\n",{"type":21,"tag":209,"props":34351,"children":34352},{"class":211,"line":325},[34353],{"type":21,"tag":209,"props":34354,"children":34355},{"style":233},[34356],{"type":26,"value":34357},"    elements to complete the verification and sign-in, regardless of what browser the user completes the\n",{"type":21,"tag":209,"props":34359,"children":34360},{"class":211,"line":334},[34361],{"type":21,"tag":209,"props":34362,"children":34363},{"style":233},[34364],{"type":26,"value":34365},"    verification from.\n",{"type":21,"tag":209,"props":34367,"children":34368},{"class":211,"line":343},[34369],{"type":21,"tag":209,"props":34370,"children":34371},{"style":233},[34372],{"type":26,"value":9900},{"type":21,"tag":209,"props":34374,"children":34375},{"class":211,"line":351},[34376,34381,34385,34390,34395,34400,34404],{"type":21,"tag":209,"props":34377,"children":34378},{"style":222},[34379],{"type":26,"value":34380},"    signature ",{"type":21,"tag":209,"props":34382,"children":34383},{"style":216},[34384],{"type":26,"value":1432},{"type":21,"tag":209,"props":34386,"children":34387},{"style":222},[34388],{"type":26,"value":34389}," signing.dumps({",{"type":21,"tag":209,"props":34391,"children":34392},{"style":233},[34393],{"type":26,"value":34394},"\"session_key\"",{"type":21,"tag":209,"props":34396,"children":34397},{"style":222},[34398],{"type":26,"value":34399},": strategy.session.session_key, ",{"type":21,"tag":209,"props":34401,"children":34402},{"style":233},[34403],{"type":26,"value":34001},{"type":21,"tag":209,"props":34405,"children":34406},{"style":222},[34407],{"type":26,"value":34408},": code.email},\n",{"type":21,"tag":209,"props":34410,"children":34411},{"class":211,"line":444},[34412,34417,34421,34425,34430],{"type":21,"tag":209,"props":34413,"children":34414},{"style":400},[34415],{"type":26,"value":34416},"                              key",{"type":21,"tag":209,"props":34418,"children":34419},{"style":216},[34420],{"type":26,"value":1432},{"type":21,"tag":209,"props":34422,"children":34423},{"style":222},[34424],{"type":26,"value":13300},{"type":21,"tag":209,"props":34426,"children":34427},{"style":263},[34428],{"type":26,"value":34429},"EMAIL_SECRET_KEY",{"type":21,"tag":209,"props":34431,"children":34432},{"style":222},[34433],{"type":26,"value":10112},{"type":21,"tag":209,"props":34435,"children":34436},{"class":211,"line":454},[34437,34442,34446,34451,34456,34461,34466,34471,34476,34480],{"type":21,"tag":209,"props":34438,"children":34439},{"style":222},[34440],{"type":26,"value":34441},"    verifyURL ",{"type":21,"tag":209,"props":34443,"children":34444},{"style":216},[34445],{"type":26,"value":1432},{"type":21,"tag":209,"props":34447,"children":34448},{"style":233},[34449],{"type":26,"value":34450}," \"",{"type":21,"tag":209,"props":34452,"children":34453},{"style":263},[34454],{"type":26,"value":34455},"{0}",{"type":21,"tag":209,"props":34457,"children":34458},{"style":233},[34459],{"type":26,"value":34460},"?verification_code=",{"type":21,"tag":209,"props":34462,"children":34463},{"style":263},[34464],{"type":26,"value":34465},"{1}",{"type":21,"tag":209,"props":34467,"children":34468},{"style":233},[34469],{"type":26,"value":34470},"&signature=",{"type":21,"tag":209,"props":34472,"children":34473},{"style":263},[34474],{"type":26,"value":34475},"{2}",{"type":21,"tag":209,"props":34477,"children":34478},{"style":233},[34479],{"type":26,"value":10018},{"type":21,"tag":209,"props":34481,"children":34482},{"style":222},[34483],{"type":26,"value":34484},".format(\n",{"type":21,"tag":209,"props":34486,"children":34487},{"class":211,"line":463},[34488,34493,34498,34502,34507,34511],{"type":21,"tag":209,"props":34489,"children":34490},{"style":222},[34491],{"type":26,"value":34492},"        reverse(",{"type":21,"tag":209,"props":34494,"children":34495},{"style":233},[34496],{"type":26,"value":34497},"'social:complete'",{"type":21,"tag":209,"props":34499,"children":34500},{"style":222},[34501],{"type":26,"value":408},{"type":21,"tag":209,"props":34503,"children":34504},{"style":400},[34505],{"type":26,"value":34506},"args",{"type":21,"tag":209,"props":34508,"children":34509},{"style":216},[34510],{"type":26,"value":1432},{"type":21,"tag":209,"props":34512,"children":34513},{"style":222},[34514],{"type":26,"value":34515},"(backend.name,)),\n",{"type":21,"tag":209,"props":34517,"children":34518},{"class":211,"line":472},[34519],{"type":21,"tag":209,"props":34520,"children":34521},{"style":222},[34522],{"type":26,"value":34523},"        code.code, signature)\n",{"type":21,"tag":209,"props":34525,"children":34526},{"class":211,"line":480},[34527,34531,34535],{"type":21,"tag":209,"props":34528,"children":34529},{"style":222},[34530],{"type":26,"value":34441},{"type":21,"tag":209,"props":34532,"children":34533},{"style":216},[34534],{"type":26,"value":1432},{"type":21,"tag":209,"props":34536,"children":34537},{"style":222},[34538],{"type":26,"value":34539}," strategy.request.build_absolute_uri(verifyURL)   \n",{"type":21,"tag":209,"props":34541,"children":34542},{"class":211,"line":489},[34543],{"type":21,"tag":209,"props":34544,"children":34545},{"emptyLinePlaceholder":248},[34546],{"type":26,"value":251},{"type":21,"tag":209,"props":34548,"children":34549},{"class":211,"line":847},[34550,34555,34559],{"type":21,"tag":209,"props":34551,"children":34552},{"style":222},[34553],{"type":26,"value":34554},"    emailHTML ",{"type":21,"tag":209,"props":34556,"children":34557},{"style":216},[34558],{"type":26,"value":1432},{"type":21,"tag":209,"props":34560,"children":34561},{"style":448},[34562],{"type":26,"value":34563}," # Include your function that returns an html string here\n",{"type":21,"tag":209,"props":34565,"children":34566},{"class":211,"line":860},[34567,34572,34576],{"type":21,"tag":209,"props":34568,"children":34569},{"style":222},[34570],{"type":26,"value":34571},"    emailText ",{"type":21,"tag":209,"props":34573,"children":34574},{"style":216},[34575],{"type":26,"value":1432},{"type":21,"tag":209,"props":34577,"children":34578},{"style":233},[34579],{"type":26,"value":34580}," \"\"\"Welcome to MyApp!\n",{"type":21,"tag":209,"props":34582,"children":34583},{"class":211,"line":877},[34584],{"type":21,"tag":209,"props":34585,"children":34586},{"style":233},[34587],{"type":26,"value":34588},"In order to login with your new user account, you need to verify your email address with us.\n",{"type":21,"tag":209,"props":34590,"children":34591},{"class":211,"line":889},[34592,34597],{"type":21,"tag":209,"props":34593,"children":34594},{"style":233},[34595],{"type":26,"value":34596},"Please copy and paste the following into your browser's url bar: ",{"type":21,"tag":209,"props":34598,"children":34599},{"style":263},[34600],{"type":26,"value":34601},"{verifyURL}\n",{"type":21,"tag":209,"props":34603,"children":34604},{"class":211,"line":902},[34605,34610,34615,34620,34624],{"type":21,"tag":209,"props":34606,"children":34607},{"style":233},[34608],{"type":26,"value":34609},"\"\"\"",{"type":21,"tag":209,"props":34611,"children":34612},{"style":222},[34613],{"type":26,"value":34614},".format(",{"type":21,"tag":209,"props":34616,"children":34617},{"style":400},[34618],{"type":26,"value":34619},"verifyURL",{"type":21,"tag":209,"props":34621,"children":34622},{"style":216},[34623],{"type":26,"value":1432},{"type":21,"tag":209,"props":34625,"children":34626},{"style":222},[34627],{"type":26,"value":34628},"verifyURL)\n",{"type":21,"tag":209,"props":34630,"children":34631},{"class":211,"line":914},[34632],{"type":21,"tag":209,"props":34633,"children":34634},{"emptyLinePlaceholder":248},[34635],{"type":26,"value":251},{"type":21,"tag":209,"props":34637,"children":34638},{"class":211,"line":922},[34639,34644,34648],{"type":21,"tag":209,"props":34640,"children":34641},{"style":222},[34642],{"type":26,"value":34643},"    kwargs ",{"type":21,"tag":209,"props":34645,"children":34646},{"style":216},[34647],{"type":26,"value":1432},{"type":21,"tag":209,"props":34649,"children":34650},{"style":222},[34651],{"type":26,"value":276},{"type":21,"tag":209,"props":34653,"children":34654},{"class":211,"line":2312},[34655,34660,34664,34669],{"type":21,"tag":209,"props":34656,"children":34657},{"style":233},[34658],{"type":26,"value":34659},"        \"subject\"",{"type":21,"tag":209,"props":34661,"children":34662},{"style":222},[34663],{"type":26,"value":7427},{"type":21,"tag":209,"props":34665,"children":34666},{"style":233},[34667],{"type":26,"value":34668},"\"Verify Your Account\"",{"type":21,"tag":209,"props":34670,"children":34671},{"style":222},[34672],{"type":26,"value":304},{"type":21,"tag":209,"props":34674,"children":34675},{"class":211,"line":2321},[34676,34681],{"type":21,"tag":209,"props":34677,"children":34678},{"style":233},[34679],{"type":26,"value":34680},"        \"body\"",{"type":21,"tag":209,"props":34682,"children":34683},{"style":222},[34684],{"type":26,"value":34685},": emailText,\n",{"type":21,"tag":209,"props":34687,"children":34688},{"class":211,"line":2372},[34689,34694,34698,34703],{"type":21,"tag":209,"props":34690,"children":34691},{"style":233},[34692],{"type":26,"value":34693},"        \"from_email\"",{"type":21,"tag":209,"props":34695,"children":34696},{"style":222},[34697],{"type":26,"value":7427},{"type":21,"tag":209,"props":34699,"children":34700},{"style":233},[34701],{"type":26,"value":34702},"\"MyApp \"",{"type":21,"tag":209,"props":34704,"children":34705},{"style":222},[34706],{"type":26,"value":304},{"type":21,"tag":209,"props":34708,"children":34709},{"class":211,"line":2381},[34710,34715,34719,34724],{"type":21,"tag":209,"props":34711,"children":34712},{"style":233},[34713],{"type":26,"value":34714},"        \"to\"",{"type":21,"tag":209,"props":34716,"children":34717},{"style":222},[34718],{"type":26,"value":10444},{"type":21,"tag":209,"props":34720,"children":34721},{"style":233},[34722],{"type":26,"value":34723},"\"recipient@email.address\"",{"type":21,"tag":209,"props":34725,"children":34726},{"style":222},[34727],{"type":26,"value":10454},{"type":21,"tag":209,"props":34729,"children":34730},{"class":211,"line":2389},[34731],{"type":21,"tag":209,"props":34732,"children":34733},{"style":222},[34734],{"type":26,"value":331},{"type":21,"tag":209,"props":34736,"children":34737},{"class":211,"line":2397},[34738],{"type":21,"tag":209,"props":34739,"children":34740},{"emptyLinePlaceholder":248},[34741],{"type":26,"value":251},{"type":21,"tag":209,"props":34743,"children":34744},{"class":211,"line":2406},[34745,34750,34754,34759,34763],{"type":21,"tag":209,"props":34746,"children":34747},{"style":222},[34748],{"type":26,"value":34749},"    email ",{"type":21,"tag":209,"props":34751,"children":34752},{"style":216},[34753],{"type":26,"value":1432},{"type":21,"tag":209,"props":34755,"children":34756},{"style":222},[34757],{"type":26,"value":34758}," EmailMultiAlternatives(",{"type":21,"tag":209,"props":34760,"children":34761},{"style":216},[34762],{"type":26,"value":33468},{"type":21,"tag":209,"props":34764,"children":34765},{"style":222},[34766],{"type":26,"value":34767},"kwargs)\n",{"type":21,"tag":209,"props":34769,"children":34770},{"class":211,"line":2415},[34771,34776,34781],{"type":21,"tag":209,"props":34772,"children":34773},{"style":222},[34774],{"type":26,"value":34775},"    email.attach_alternative(emailHTML, ",{"type":21,"tag":209,"props":34777,"children":34778},{"style":233},[34779],{"type":26,"value":34780},"\"text/html\"",{"type":21,"tag":209,"props":34782,"children":34783},{"style":222},[34784],{"type":26,"value":10112},{"type":21,"tag":209,"props":34786,"children":34787},{"class":211,"line":2424},[34788],{"type":21,"tag":209,"props":34789,"children":34790},{"style":222},[34791],{"type":26,"value":34792},"    email.send()\n",{"type":21,"tag":22,"props":34794,"children":34795},{},[34796,34798,34805,34807,34814],{"type":26,"value":34797},"You'll notice we used Django's ",{"type":21,"tag":29,"props":34799,"children":34802},{"href":34800,"rel":34801},"https://docs.djangoproject.com/en/1.8/topics/email/#django.core.mail.EmailMessage",[93],[34803],{"type":26,"value":34804},"EmailMultiAlternatives",{"type":26,"value":34806}," to attach an html version of the email. You can find more details on sending email with Django in the ",{"type":21,"tag":29,"props":34808,"children":34811},{"href":34809,"rel":34810},"https://docs.djangoproject.com/en/1.8/topics/email/",[93],[34812],{"type":26,"value":34813},"Django docs",{"type":26,"value":378},{"type":21,"tag":22,"props":34816,"children":34817},{},[34818],{"type":26,"value":34819},"You'll also likely have noticed that we're including some signed details in that verification email string we're sending. What details are for what purpose? Let's break it down, and discuss some necessary evil.",{"type":21,"tag":3677,"props":34821,"children":34822},{},[34823,34834,34845],{"type":21,"tag":3681,"props":34824,"children":34825},{},[34826,34832],{"type":21,"tag":63,"props":34827,"children":34829},{"className":34828},[],[34830],{"type":26,"value":34831},"code.code",{"type":26,"value":34833}," is the email verification code generated by the mail validation pipeline.",{"type":21,"tag":3681,"props":34835,"children":34836},{},[34837,34843],{"type":21,"tag":63,"props":34838,"children":34840},{"className":34839},[],[34841],{"type":26,"value":34842},"code.email",{"type":26,"value":34844}," is the email address we're attempting to verify.",{"type":21,"tag":3681,"props":34846,"children":34847},{},[34848,34854,34856,34862,34864,34870,34872,34878],{"type":21,"tag":63,"props":34849,"children":34851},{"className":34850},[],[34852],{"type":26,"value":34853},"signature",{"type":26,"value":34855}," is our own addition to the process - you'll notice it include both the email we're trying to verify, and a ",{"type":21,"tag":63,"props":34857,"children":34859},{"className":34858},[],[34860],{"type":26,"value":34861},"session_key",{"type":26,"value":34863},", which contains the session_key stored in our current backend strategy. Finally, ",{"type":21,"tag":63,"props":34865,"children":34867},{"className":34866},[],[34868],{"type":26,"value":34869},"key",{"type":26,"value":34871}," is the secret we're using to sign this signature with, to prevent tampering - you can find more details on signing in the ",{"type":21,"tag":29,"props":34873,"children":34876},{"href":34874,"rel":34875},"https://docs.djangoproject.com/en/1.8/topics/signing/",[93],[34877],{"type":26,"value":34813},{"type":26,"value":378},{"type":21,"tag":3549,"props":34880,"children":34882},{"id":34881},"step-3-validating-the-email-from-any-browser",[34883],{"type":26,"value":34884},"Step 3 - Validating the email from any browser",{"type":21,"tag":22,"props":34886,"children":34887},{},[34888],{"type":26,"value":34889},"What do we need that signature for, though? This may have been remedied in whatever version of python-social-auth your using, but at the time of this writing (July 2015), if your receiving user were to click/paste the link you included in your validation email into a different browser, they'd likely be confronted with a 500 error page, and you'll have an entry in your log:",{"type":21,"tag":200,"props":34891,"children":34895},{"className":34892,"code":34894,"language":26},[34893],"language-text","Partial pipeline can not resume\n",[34896],{"type":21,"tag":63,"props":34897,"children":34898},{"__ignoreMap":8},[34899],{"type":26,"value":34894},{"type":21,"tag":22,"props":34901,"children":34902},{},[34903,34905,34910],{"type":26,"value":34904},"In fact, if they were to click that link in the same browser, but after clearing their cache, or after a long period of time causes their current session to expire, they'd run into the same problem. It turns out that python-social-auth relies on the session to store the details of a partial pipeline - which means that if a user tries to resume the pipeline (as in the case of validating their email) from a different browser, ",{"type":21,"tag":5270,"props":34906,"children":34907},{},[34908],{"type":26,"value":34909},"it will fail",{"type":26,"value":378},{"type":21,"tag":22,"props":34912,"children":34913},{},[34914],{"type":26,"value":34915},"The expected user flow here is that the user should be able to validate their email address from any browser, indeed, from any device that can access their email account. They shouldn't need to use the same browser within the arbitrary lifetime of their current server session. Let's fix that.",{"type":21,"tag":22,"props":34917,"children":34918},{},[34919,34921,34927,34929,34936],{"type":26,"value":34920},"Here comes the necessary evil - we'll need to monkey-patch ",{"type":21,"tag":63,"props":34922,"children":34924},{"className":34923},[],[34925],{"type":26,"value":34926},"social.utils.partial_pipeline_data",{"type":26,"value":34928}," in order to allow us to restore the required session data from the stored session in order to resume the pipeline. Our solution takes advantage of the standard storage of ",{"type":21,"tag":29,"props":34930,"children":34933},{"href":34931,"rel":34932},"https://docs.djangoproject.com/en/1.8/topics/http/sessions/#using-database-backed-sessions",[93],[34934],{"type":26,"value":34935},"Django sessions in a database table",{"type":26,"value":34937},", allowing us to interact with the stored sessions in the same way we do other tables.",{"type":21,"tag":22,"props":34939,"children":34940},{},[34941],{"type":26,"value":34942},"We confirm the cryptographic signature on the details within the url parameter, fetch the necessary table row for the session using the session_key, get the needed fields from the row, and presto, we can now properly resume the pipeline.",{"type":21,"tag":200,"props":34944,"children":34946},{"className":9840,"code":34945,"language":9842,"meta":8,"style":8},"# Monkey patching - an occasionally necessary evil.\nfrom social import utils\nfrom social.exceptions import InvalidEmail\n\nfrom django.core import signing\nfrom django.core.signing import BadSignature\nfrom django.contrib.sessions.models import Session\nfrom django.conf import settings\n\ndef partial_pipeline_data(backend, user=None, *args, **kwargs):\n    \"\"\"\n    Monkey-patch utils.partial_pipeline_data to enable us to retrieve session data by signature key in request.\n    This is necessary to allow users to follow a link in an email to validate their account from a different\n    browser than the one they were using to sign up for the account, or after they've closed/re-opened said\n    browser and potentially flushed their cookies. By adding the session key to a signed base64 encoded signature\n    on the email request, we can retrieve the necessary details from our Django session table.\n    We fetch only the needed details to complete the pipeline authorization process from the session, to prevent\n    nefarious use.\n    \"\"\"\n    data = backend.strategy.request_data()\n    if 'signature' in data:\n        try:\n            signed_details = signing.loads(data['signature'], key=settings.EMAIL_SECRET_KEY)\n            session = Session.objects.get(pk=signed_details['session_key'])\n        except BadSignature, Session.DoesNotExist:\n            raise InvalidEmail(backend)\n\n        session_details = session.get_decoded()\n        backend.strategy.session_set('email_validation_address', session_details['email_validation_address'])\n        backend.strategy.session_set('next', session_details.get('next'))\n        backend.strategy.session_set('partial_pipeline', session_details['partial_pipeline'])\n        backend.strategy.session_set(backend.name + '_state', session_details.get(backend.name + '_state'))\n        backend.strategy.session_set(backend.name + 'unauthorized_token_name',\n                                     session_details.get(backend.name + 'unauthorized_token_name'))\n\n    partial = backend.strategy.session_get('partial_pipeline', None)\n    if partial:\n        idx, backend_name, xargs, xkwargs = \\\n            backend.strategy.partial_from_session(partial)\n        if backend_name == backend.name:\n            kwargs.setdefault('pipeline_index', idx)\n            if user:  # don't update user if it's None\n                kwargs.setdefault('user', user)\n            kwargs.setdefault('request', backend.strategy.request_data())\n            xkwargs.update(kwargs)\n            return xargs, xkwargs\n        else:\n            backend.strategy.clean_partial_pipeline()\nutils.partial_pipeline_data = partial_pipeline_data\nViewport\nWindow\n",[34947],{"type":21,"tag":63,"props":34948,"children":34949},{"__ignoreMap":8},[34950,34958,34979,35000,35007,35026,35047,35068,35087,35094,35139,35146,35154,35162,35170,35178,35186,35194,35202,35209,35226,35247,35258,35304,35344,35357,35370,35377,35394,35420,35446,35469,35503,35523,35543,35550,35583,35595,35612,35620,35641,35659,35676,35694,35711,35719,35731,35742,35750,35767,35775],{"type":21,"tag":209,"props":34951,"children":34952},{"class":211,"line":212},[34953],{"type":21,"tag":209,"props":34954,"children":34955},{"style":448},[34956],{"type":26,"value":34957},"# Monkey patching - an occasionally necessary evil.\n",{"type":21,"tag":209,"props":34959,"children":34960},{"class":211,"line":244},[34961,34965,34970,34974],{"type":21,"tag":209,"props":34962,"children":34963},{"style":216},[34964],{"type":26,"value":230},{"type":21,"tag":209,"props":34966,"children":34967},{"style":222},[34968],{"type":26,"value":34969}," social ",{"type":21,"tag":209,"props":34971,"children":34972},{"style":216},[34973],{"type":26,"value":219},{"type":21,"tag":209,"props":34975,"children":34976},{"style":222},[34977],{"type":26,"value":34978}," utils\n",{"type":21,"tag":209,"props":34980,"children":34981},{"class":211,"line":254},[34982,34986,34991,34995],{"type":21,"tag":209,"props":34983,"children":34984},{"style":216},[34985],{"type":26,"value":230},{"type":21,"tag":209,"props":34987,"children":34988},{"style":222},[34989],{"type":26,"value":34990}," social.exceptions ",{"type":21,"tag":209,"props":34992,"children":34993},{"style":216},[34994],{"type":26,"value":219},{"type":21,"tag":209,"props":34996,"children":34997},{"style":222},[34998],{"type":26,"value":34999}," InvalidEmail\n",{"type":21,"tag":209,"props":35001,"children":35002},{"class":211,"line":279},[35003],{"type":21,"tag":209,"props":35004,"children":35005},{"emptyLinePlaceholder":248},[35006],{"type":26,"value":251},{"type":21,"tag":209,"props":35008,"children":35009},{"class":211,"line":288},[35010,35014,35018,35022],{"type":21,"tag":209,"props":35011,"children":35012},{"style":216},[35013],{"type":26,"value":230},{"type":21,"tag":209,"props":35015,"children":35016},{"style":222},[35017],{"type":26,"value":34280},{"type":21,"tag":209,"props":35019,"children":35020},{"style":216},[35021],{"type":26,"value":219},{"type":21,"tag":209,"props":35023,"children":35024},{"style":222},[35025],{"type":26,"value":34289},{"type":21,"tag":209,"props":35027,"children":35028},{"class":211,"line":307},[35029,35033,35038,35042],{"type":21,"tag":209,"props":35030,"children":35031},{"style":216},[35032],{"type":26,"value":230},{"type":21,"tag":209,"props":35034,"children":35035},{"style":222},[35036],{"type":26,"value":35037}," django.core.signing ",{"type":21,"tag":209,"props":35039,"children":35040},{"style":216},[35041],{"type":26,"value":219},{"type":21,"tag":209,"props":35043,"children":35044},{"style":222},[35045],{"type":26,"value":35046}," BadSignature\n",{"type":21,"tag":209,"props":35048,"children":35049},{"class":211,"line":325},[35050,35054,35059,35063],{"type":21,"tag":209,"props":35051,"children":35052},{"style":216},[35053],{"type":26,"value":230},{"type":21,"tag":209,"props":35055,"children":35056},{"style":222},[35057],{"type":26,"value":35058}," django.contrib.sessions.models ",{"type":21,"tag":209,"props":35060,"children":35061},{"style":216},[35062],{"type":26,"value":219},{"type":21,"tag":209,"props":35064,"children":35065},{"style":222},[35066],{"type":26,"value":35067}," Session\n",{"type":21,"tag":209,"props":35069,"children":35070},{"class":211,"line":334},[35071,35075,35079,35083],{"type":21,"tag":209,"props":35072,"children":35073},{"style":216},[35074],{"type":26,"value":230},{"type":21,"tag":209,"props":35076,"children":35077},{"style":222},[35078],{"type":26,"value":9858},{"type":21,"tag":209,"props":35080,"children":35081},{"style":216},[35082],{"type":26,"value":219},{"type":21,"tag":209,"props":35084,"children":35085},{"style":222},[35086],{"type":26,"value":9867},{"type":21,"tag":209,"props":35088,"children":35089},{"class":211,"line":343},[35090],{"type":21,"tag":209,"props":35091,"children":35092},{"emptyLinePlaceholder":248},[35093],{"type":26,"value":251},{"type":21,"tag":209,"props":35095,"children":35096},{"class":211,"line":351},[35097,35101,35106,35111,35115,35119,35123,35127,35131,35135],{"type":21,"tag":209,"props":35098,"children":35099},{"style":216},[35100],{"type":26,"value":9882},{"type":21,"tag":209,"props":35102,"children":35103},{"style":360},[35104],{"type":26,"value":35105}," partial_pipeline_data",{"type":21,"tag":209,"props":35107,"children":35108},{"style":222},[35109],{"type":26,"value":35110},"(backend, user",{"type":21,"tag":209,"props":35112,"children":35113},{"style":216},[35114],{"type":26,"value":1432},{"type":21,"tag":209,"props":35116,"children":35117},{"style":263},[35118],{"type":26,"value":13412},{"type":21,"tag":209,"props":35120,"children":35121},{"style":222},[35122],{"type":26,"value":408},{"type":21,"tag":209,"props":35124,"children":35125},{"style":216},[35126],{"type":26,"value":944},{"type":21,"tag":209,"props":35128,"children":35129},{"style":222},[35130],{"type":26,"value":33463},{"type":21,"tag":209,"props":35132,"children":35133},{"style":216},[35134],{"type":26,"value":33468},{"type":21,"tag":209,"props":35136,"children":35137},{"style":222},[35138],{"type":26,"value":33473},{"type":21,"tag":209,"props":35140,"children":35141},{"class":211,"line":444},[35142],{"type":21,"tag":209,"props":35143,"children":35144},{"style":233},[35145],{"type":26,"value":9900},{"type":21,"tag":209,"props":35147,"children":35148},{"class":211,"line":454},[35149],{"type":21,"tag":209,"props":35150,"children":35151},{"style":233},[35152],{"type":26,"value":35153},"    Monkey-patch utils.partial_pipeline_data to enable us to retrieve session data by signature key in request.\n",{"type":21,"tag":209,"props":35155,"children":35156},{"class":211,"line":463},[35157],{"type":21,"tag":209,"props":35158,"children":35159},{"style":233},[35160],{"type":26,"value":35161},"    This is necessary to allow users to follow a link in an email to validate their account from a different\n",{"type":21,"tag":209,"props":35163,"children":35164},{"class":211,"line":472},[35165],{"type":21,"tag":209,"props":35166,"children":35167},{"style":233},[35168],{"type":26,"value":35169},"    browser than the one they were using to sign up for the account, or after they've closed/re-opened said\n",{"type":21,"tag":209,"props":35171,"children":35172},{"class":211,"line":480},[35173],{"type":21,"tag":209,"props":35174,"children":35175},{"style":233},[35176],{"type":26,"value":35177},"    browser and potentially flushed their cookies. By adding the session key to a signed base64 encoded signature\n",{"type":21,"tag":209,"props":35179,"children":35180},{"class":211,"line":489},[35181],{"type":21,"tag":209,"props":35182,"children":35183},{"style":233},[35184],{"type":26,"value":35185},"    on the email request, we can retrieve the necessary details from our Django session table.\n",{"type":21,"tag":209,"props":35187,"children":35188},{"class":211,"line":847},[35189],{"type":21,"tag":209,"props":35190,"children":35191},{"style":233},[35192],{"type":26,"value":35193},"    We fetch only the needed details to complete the pipeline authorization process from the session, to prevent\n",{"type":21,"tag":209,"props":35195,"children":35196},{"class":211,"line":860},[35197],{"type":21,"tag":209,"props":35198,"children":35199},{"style":233},[35200],{"type":26,"value":35201},"    nefarious use.\n",{"type":21,"tag":209,"props":35203,"children":35204},{"class":211,"line":877},[35205],{"type":21,"tag":209,"props":35206,"children":35207},{"style":233},[35208],{"type":26,"value":9900},{"type":21,"tag":209,"props":35210,"children":35211},{"class":211,"line":889},[35212,35217,35221],{"type":21,"tag":209,"props":35213,"children":35214},{"style":222},[35215],{"type":26,"value":35216},"    data ",{"type":21,"tag":209,"props":35218,"children":35219},{"style":216},[35220],{"type":26,"value":1432},{"type":21,"tag":209,"props":35222,"children":35223},{"style":222},[35224],{"type":26,"value":35225}," backend.strategy.request_data()\n",{"type":21,"tag":209,"props":35227,"children":35228},{"class":211,"line":902},[35229,35233,35238,35242],{"type":21,"tag":209,"props":35230,"children":35231},{"style":216},[35232],{"type":26,"value":10853},{"type":21,"tag":209,"props":35234,"children":35235},{"style":233},[35236],{"type":26,"value":35237}," 'signature'",{"type":21,"tag":209,"props":35239,"children":35240},{"style":216},[35241],{"type":26,"value":10867},{"type":21,"tag":209,"props":35243,"children":35244},{"style":222},[35245],{"type":26,"value":35246}," data:\n",{"type":21,"tag":209,"props":35248,"children":35249},{"class":211,"line":914},[35250,35254],{"type":21,"tag":209,"props":35251,"children":35252},{"style":216},[35253],{"type":26,"value":6775},{"type":21,"tag":209,"props":35255,"children":35256},{"style":222},[35257],{"type":26,"value":844},{"type":21,"tag":209,"props":35259,"children":35260},{"class":211,"line":922},[35261,35266,35270,35275,35280,35284,35288,35292,35296,35300],{"type":21,"tag":209,"props":35262,"children":35263},{"style":222},[35264],{"type":26,"value":35265},"            signed_details ",{"type":21,"tag":209,"props":35267,"children":35268},{"style":216},[35269],{"type":26,"value":1432},{"type":21,"tag":209,"props":35271,"children":35272},{"style":222},[35273],{"type":26,"value":35274}," signing.loads(data[",{"type":21,"tag":209,"props":35276,"children":35277},{"style":233},[35278],{"type":26,"value":35279},"'signature'",{"type":21,"tag":209,"props":35281,"children":35282},{"style":222},[35283],{"type":26,"value":28130},{"type":21,"tag":209,"props":35285,"children":35286},{"style":400},[35287],{"type":26,"value":34869},{"type":21,"tag":209,"props":35289,"children":35290},{"style":216},[35291],{"type":26,"value":1432},{"type":21,"tag":209,"props":35293,"children":35294},{"style":222},[35295],{"type":26,"value":13300},{"type":21,"tag":209,"props":35297,"children":35298},{"style":263},[35299],{"type":26,"value":34429},{"type":21,"tag":209,"props":35301,"children":35302},{"style":222},[35303],{"type":26,"value":10112},{"type":21,"tag":209,"props":35305,"children":35306},{"class":211,"line":2312},[35307,35312,35316,35321,35326,35330,35335,35340],{"type":21,"tag":209,"props":35308,"children":35309},{"style":222},[35310],{"type":26,"value":35311},"            session ",{"type":21,"tag":209,"props":35313,"children":35314},{"style":216},[35315],{"type":26,"value":1432},{"type":21,"tag":209,"props":35317,"children":35318},{"style":222},[35319],{"type":26,"value":35320}," Session.objects.get(",{"type":21,"tag":209,"props":35322,"children":35323},{"style":400},[35324],{"type":26,"value":35325},"pk",{"type":21,"tag":209,"props":35327,"children":35328},{"style":216},[35329],{"type":26,"value":1432},{"type":21,"tag":209,"props":35331,"children":35332},{"style":222},[35333],{"type":26,"value":35334},"signed_details[",{"type":21,"tag":209,"props":35336,"children":35337},{"style":233},[35338],{"type":26,"value":35339},"'session_key'",{"type":21,"tag":209,"props":35341,"children":35342},{"style":222},[35343],{"type":26,"value":20697},{"type":21,"tag":209,"props":35345,"children":35346},{"class":211,"line":2321},[35347,35352],{"type":21,"tag":209,"props":35348,"children":35349},{"style":216},[35350],{"type":26,"value":35351},"        except",{"type":21,"tag":209,"props":35353,"children":35354},{"style":222},[35355],{"type":26,"value":35356}," BadSignature, Session.DoesNotExist:\n",{"type":21,"tag":209,"props":35358,"children":35359},{"class":211,"line":2372},[35360,35365],{"type":21,"tag":209,"props":35361,"children":35362},{"style":216},[35363],{"type":26,"value":35364},"            raise",{"type":21,"tag":209,"props":35366,"children":35367},{"style":222},[35368],{"type":26,"value":35369}," InvalidEmail(backend)\n",{"type":21,"tag":209,"props":35371,"children":35372},{"class":211,"line":2381},[35373],{"type":21,"tag":209,"props":35374,"children":35375},{"emptyLinePlaceholder":248},[35376],{"type":26,"value":251},{"type":21,"tag":209,"props":35378,"children":35379},{"class":211,"line":2389},[35380,35385,35389],{"type":21,"tag":209,"props":35381,"children":35382},{"style":222},[35383],{"type":26,"value":35384},"        session_details ",{"type":21,"tag":209,"props":35386,"children":35387},{"style":216},[35388],{"type":26,"value":1432},{"type":21,"tag":209,"props":35390,"children":35391},{"style":222},[35392],{"type":26,"value":35393}," session.get_decoded()\n",{"type":21,"tag":209,"props":35395,"children":35396},{"class":211,"line":2397},[35397,35402,35407,35412,35416],{"type":21,"tag":209,"props":35398,"children":35399},{"style":222},[35400],{"type":26,"value":35401},"        backend.strategy.session_set(",{"type":21,"tag":209,"props":35403,"children":35404},{"style":233},[35405],{"type":26,"value":35406},"'email_validation_address'",{"type":21,"tag":209,"props":35408,"children":35409},{"style":222},[35410],{"type":26,"value":35411},", session_details[",{"type":21,"tag":209,"props":35413,"children":35414},{"style":233},[35415],{"type":26,"value":35406},{"type":21,"tag":209,"props":35417,"children":35418},{"style":222},[35419],{"type":26,"value":20697},{"type":21,"tag":209,"props":35421,"children":35422},{"class":211,"line":2406},[35423,35427,35432,35437,35441],{"type":21,"tag":209,"props":35424,"children":35425},{"style":222},[35426],{"type":26,"value":35401},{"type":21,"tag":209,"props":35428,"children":35429},{"style":233},[35430],{"type":26,"value":35431},"'next'",{"type":21,"tag":209,"props":35433,"children":35434},{"style":222},[35435],{"type":26,"value":35436},", session_details.get(",{"type":21,"tag":209,"props":35438,"children":35439},{"style":233},[35440],{"type":26,"value":35431},{"type":21,"tag":209,"props":35442,"children":35443},{"style":222},[35444],{"type":26,"value":35445},"))\n",{"type":21,"tag":209,"props":35447,"children":35448},{"class":211,"line":2415},[35449,35453,35457,35461,35465],{"type":21,"tag":209,"props":35450,"children":35451},{"style":222},[35452],{"type":26,"value":35401},{"type":21,"tag":209,"props":35454,"children":35455},{"style":233},[35456],{"type":26,"value":33790},{"type":21,"tag":209,"props":35458,"children":35459},{"style":222},[35460],{"type":26,"value":35411},{"type":21,"tag":209,"props":35462,"children":35463},{"style":233},[35464],{"type":26,"value":33790},{"type":21,"tag":209,"props":35466,"children":35467},{"style":222},[35468],{"type":26,"value":20697},{"type":21,"tag":209,"props":35470,"children":35471},{"class":211,"line":2424},[35472,35477,35481,35486,35491,35495,35499],{"type":21,"tag":209,"props":35473,"children":35474},{"style":222},[35475],{"type":26,"value":35476},"        backend.strategy.session_set(backend.name ",{"type":21,"tag":209,"props":35478,"children":35479},{"style":216},[35480],{"type":26,"value":10237},{"type":21,"tag":209,"props":35482,"children":35483},{"style":233},[35484],{"type":26,"value":35485}," '_state'",{"type":21,"tag":209,"props":35487,"children":35488},{"style":222},[35489],{"type":26,"value":35490},", session_details.get(backend.name ",{"type":21,"tag":209,"props":35492,"children":35493},{"style":216},[35494],{"type":26,"value":10237},{"type":21,"tag":209,"props":35496,"children":35497},{"style":233},[35498],{"type":26,"value":35485},{"type":21,"tag":209,"props":35500,"children":35501},{"style":222},[35502],{"type":26,"value":35445},{"type":21,"tag":209,"props":35504,"children":35505},{"class":211,"line":2433},[35506,35510,35514,35519],{"type":21,"tag":209,"props":35507,"children":35508},{"style":222},[35509],{"type":26,"value":35476},{"type":21,"tag":209,"props":35511,"children":35512},{"style":216},[35513],{"type":26,"value":10237},{"type":21,"tag":209,"props":35515,"children":35516},{"style":233},[35517],{"type":26,"value":35518}," 'unauthorized_token_name'",{"type":21,"tag":209,"props":35520,"children":35521},{"style":222},[35522],{"type":26,"value":304},{"type":21,"tag":209,"props":35524,"children":35525},{"class":211,"line":2442},[35526,35531,35535,35539],{"type":21,"tag":209,"props":35527,"children":35528},{"style":222},[35529],{"type":26,"value":35530},"                                     session_details.get(backend.name ",{"type":21,"tag":209,"props":35532,"children":35533},{"style":216},[35534],{"type":26,"value":10237},{"type":21,"tag":209,"props":35536,"children":35537},{"style":233},[35538],{"type":26,"value":35518},{"type":21,"tag":209,"props":35540,"children":35541},{"style":222},[35542],{"type":26,"value":35445},{"type":21,"tag":209,"props":35544,"children":35545},{"class":211,"line":2471},[35546],{"type":21,"tag":209,"props":35547,"children":35548},{"emptyLinePlaceholder":248},[35549],{"type":26,"value":251},{"type":21,"tag":209,"props":35551,"children":35552},{"class":211,"line":2480},[35553,35558,35562,35567,35571,35575,35579],{"type":21,"tag":209,"props":35554,"children":35555},{"style":222},[35556],{"type":26,"value":35557},"    partial ",{"type":21,"tag":209,"props":35559,"children":35560},{"style":216},[35561],{"type":26,"value":1432},{"type":21,"tag":209,"props":35563,"children":35564},{"style":222},[35565],{"type":26,"value":35566}," backend.strategy.session_get(",{"type":21,"tag":209,"props":35568,"children":35569},{"style":233},[35570],{"type":26,"value":33790},{"type":21,"tag":209,"props":35572,"children":35573},{"style":222},[35574],{"type":26,"value":408},{"type":21,"tag":209,"props":35576,"children":35577},{"style":263},[35578],{"type":26,"value":13412},{"type":21,"tag":209,"props":35580,"children":35581},{"style":222},[35582],{"type":26,"value":10112},{"type":21,"tag":209,"props":35584,"children":35585},{"class":211,"line":2489},[35586,35590],{"type":21,"tag":209,"props":35587,"children":35588},{"style":216},[35589],{"type":26,"value":10853},{"type":21,"tag":209,"props":35591,"children":35592},{"style":222},[35593],{"type":26,"value":35594}," partial:\n",{"type":21,"tag":209,"props":35596,"children":35597},{"class":211,"line":2516},[35598,35603,35607],{"type":21,"tag":209,"props":35599,"children":35600},{"style":222},[35601],{"type":26,"value":35602},"        idx, backend_name, xargs, xkwargs ",{"type":21,"tag":209,"props":35604,"children":35605},{"style":216},[35606],{"type":26,"value":1432},{"type":21,"tag":209,"props":35608,"children":35609},{"style":222},[35610],{"type":26,"value":35611}," \\\n",{"type":21,"tag":209,"props":35613,"children":35614},{"class":211,"line":2525},[35615],{"type":21,"tag":209,"props":35616,"children":35617},{"style":222},[35618],{"type":26,"value":35619},"            backend.strategy.partial_from_session(partial)\n",{"type":21,"tag":209,"props":35621,"children":35622},{"class":211,"line":2533},[35623,35627,35632,35636],{"type":21,"tag":209,"props":35624,"children":35625},{"style":216},[35626],{"type":26,"value":5803},{"type":21,"tag":209,"props":35628,"children":35629},{"style":222},[35630],{"type":26,"value":35631}," backend_name ",{"type":21,"tag":209,"props":35633,"children":35634},{"style":216},[35635],{"type":26,"value":12908},{"type":21,"tag":209,"props":35637,"children":35638},{"style":222},[35639],{"type":26,"value":35640}," backend.name:\n",{"type":21,"tag":209,"props":35642,"children":35643},{"class":211,"line":2542},[35644,35649,35654],{"type":21,"tag":209,"props":35645,"children":35646},{"style":222},[35647],{"type":26,"value":35648},"            kwargs.setdefault(",{"type":21,"tag":209,"props":35650,"children":35651},{"style":233},[35652],{"type":26,"value":35653},"'pipeline_index'",{"type":21,"tag":209,"props":35655,"children":35656},{"style":222},[35657],{"type":26,"value":35658},", idx)\n",{"type":21,"tag":209,"props":35660,"children":35661},{"class":211,"line":2550},[35662,35666,35671],{"type":21,"tag":209,"props":35663,"children":35664},{"style":216},[35665],{"type":26,"value":6083},{"type":21,"tag":209,"props":35667,"children":35668},{"style":222},[35669],{"type":26,"value":35670}," user:  ",{"type":21,"tag":209,"props":35672,"children":35673},{"style":448},[35674],{"type":26,"value":35675},"# don't update user if it's None\n",{"type":21,"tag":209,"props":35677,"children":35678},{"class":211,"line":2564},[35679,35684,35689],{"type":21,"tag":209,"props":35680,"children":35681},{"style":222},[35682],{"type":26,"value":35683},"                kwargs.setdefault(",{"type":21,"tag":209,"props":35685,"children":35686},{"style":233},[35687],{"type":26,"value":35688},"'user'",{"type":21,"tag":209,"props":35690,"children":35691},{"style":222},[35692],{"type":26,"value":35693},", user)\n",{"type":21,"tag":209,"props":35695,"children":35696},{"class":211,"line":2611},[35697,35701,35706],{"type":21,"tag":209,"props":35698,"children":35699},{"style":222},[35700],{"type":26,"value":35648},{"type":21,"tag":209,"props":35702,"children":35703},{"style":233},[35704],{"type":26,"value":35705},"'request'",{"type":21,"tag":209,"props":35707,"children":35708},{"style":222},[35709],{"type":26,"value":35710},", backend.strategy.request_data())\n",{"type":21,"tag":209,"props":35712,"children":35713},{"class":211,"line":2619},[35714],{"type":21,"tag":209,"props":35715,"children":35716},{"style":222},[35717],{"type":26,"value":35718},"            xkwargs.update(kwargs)\n",{"type":21,"tag":209,"props":35720,"children":35721},{"class":211,"line":2627},[35722,35726],{"type":21,"tag":209,"props":35723,"children":35724},{"style":216},[35725],{"type":26,"value":5101},{"type":21,"tag":209,"props":35727,"children":35728},{"style":222},[35729],{"type":26,"value":35730}," xargs, xkwargs\n",{"type":21,"tag":209,"props":35732,"children":35733},{"class":211,"line":2636},[35734,35738],{"type":21,"tag":209,"props":35735,"children":35736},{"style":216},[35737],{"type":26,"value":26146},{"type":21,"tag":209,"props":35739,"children":35740},{"style":222},[35741],{"type":26,"value":844},{"type":21,"tag":209,"props":35743,"children":35744},{"class":211,"line":2644},[35745],{"type":21,"tag":209,"props":35746,"children":35747},{"style":222},[35748],{"type":26,"value":35749},"            backend.strategy.clean_partial_pipeline()\n",{"type":21,"tag":209,"props":35751,"children":35752},{"class":211,"line":2657},[35753,35758,35762],{"type":21,"tag":209,"props":35754,"children":35755},{"style":222},[35756],{"type":26,"value":35757},"utils.partial_pipeline_data ",{"type":21,"tag":209,"props":35759,"children":35760},{"style":216},[35761],{"type":26,"value":1432},{"type":21,"tag":209,"props":35763,"children":35764},{"style":222},[35765],{"type":26,"value":35766}," partial_pipeline_data\n",{"type":21,"tag":209,"props":35768,"children":35769},{"class":211,"line":2728},[35770],{"type":21,"tag":209,"props":35771,"children":35772},{"style":222},[35773],{"type":26,"value":35774},"Viewport\n",{"type":21,"tag":209,"props":35776,"children":35777},{"class":211,"line":2758},[35778],{"type":21,"tag":209,"props":35779,"children":35780},{"style":222},[35781],{"type":26,"value":35782},"Window\n",{"type":21,"tag":3549,"props":35784,"children":35786},{"id":35785},"step-4-relax-with-hot-beverage-of-choice",[35787],{"type":26,"value":35788},"Step 4 - Relax with hot beverage of choice",{"type":21,"tag":22,"props":35790,"children":35791},{},[35792],{"type":26,"value":35793},"Optional, but recommended.",{"type":21,"tag":3490,"props":35795,"children":35796},{},[35797],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":35799},[35800,35801,35804,35805,35806],{"id":32945,"depth":244,"text":32948},{"id":33001,"depth":244,"text":33004,"children":35802},[35803],{"id":34167,"depth":279,"text":34170},{"id":34173,"depth":244,"text":34176},{"id":34881,"depth":244,"text":34884},{"id":35785,"depth":244,"text":35788},"content:ckeefer:2015-3:EmailValidation.md","ckeefer/2015-3/EmailValidation.md","ckeefer/2015-3/EmailValidation",{"user":3518,"name":3519},{"_path":35812,"_dir":35813,"_draft":7,"_partial":7,"_locale":8,"title":35814,"description":35815,"publishDate":35816,"tags":35817,"excerpt":35815,"body":35818,"_type":3511,"_id":35969,"_source":3513,"_file":35970,"_stem":35971,"_extension":3516,"author":35972},"/ckeefer/2015-2/js-frameworks","2015-2","The What and Why of Javascript Frameworks","JavaScript has the propensity to be very untidy if you let it be. This isn't a problem unique to JavaScript, of course - many other languages suffer from a lack of native organization, especially for specific tasks.","2015-05-29",[12],{"type":18,"children":35819,"toc":35963},[35820,35824,35829,35835,35840,35845,35850,35855,35861,35866,35871,35876,35881,35887,35892,35904,35909,35914,35919,35925,35930,35935],{"type":21,"tag":22,"props":35821,"children":35822},{},[35823],{"type":26,"value":35815},{"type":21,"tag":22,"props":35825,"children":35826},{},[35827],{"type":26,"value":35828},"It is for this reason that frameworks exist - to give us some structure upon which to build, the foundation for our edifice of code. Let's dig a little deeper into what a JavaScript framework looks like, and why you might want to use one.",{"type":21,"tag":3549,"props":35830,"children":35832},{"id":35831},"what-is-a-javascript-framework",[35833],{"type":26,"value":35834},"What is a JavaScript Framework?",{"type":21,"tag":22,"props":35836,"children":35837},{},[35838],{"type":26,"value":35839},"First off: Let's define, in brief and general terms, a JavaScript framework. Definition varies by the framework, but most follow the pattern familiar to anyone with some experience with server-side frameworks (or Smalltalk-80, for that matter) - that is, some implementation of MV*, ie. MVC (Model-View-Controller), MVP (Model-View-Presenter), etc.",{"type":21,"tag":22,"props":35841,"children":35842},{},[35843],{"type":26,"value":35844},"Models in a JS framework, much like their server-side brethren, represent your application's data (users, photos, blog entries, sales figures, etc.) This data could be drawn from and kept in sync with your server, via a persistence method like ajax or websockets. Or it could exist entirely client-side, either transitory and living in memory, or persisted to client-side mechanisms like localStorage or IndexedDB. Most modern frameworks offer means by which to group models together - that is, to arrange and treat them in a manner analogous to rows within a table.",{"type":21,"tag":22,"props":35846,"children":35847},{},[35848],{"type":26,"value":35849},"Views are a bit more amorphous - depending on the framework, they might be as simple as a set of templates, or possess all the logic, routing and data-binding that might be the role of the Controller in another framework. Either way, the view's role is to maintain the state of a DOM element and it's child nodes.",{"type":21,"tag":22,"props":35851,"children":35852},{},[35853],{"type":26,"value":35854},"Partly because of the flexible definition of what composes a View, MVC often becomes instead MV_, where what the value of_ is depends on the framework - it could be a layer that keeps your views updated with changes to the models and vice versa, it could be here that routing is handled, often times it's here that views are created, grouped, manipulated, bound to different models or collections of models, and so on. Because the views so often contain significant logic about what is being presented and how it should be interacted with, as a consequence of the DOM Events model, the final element of the MV* pattern fulfills different roles in different frameworks.",{"type":21,"tag":3549,"props":35856,"children":35858},{"id":35857},"why-use-a-js-framework",[35859],{"type":26,"value":35860},"Why use a JS framework?",{"type":21,"tag":22,"props":35862,"children":35863},{},[35864],{"type":26,"value":35865},"In general terms, for the same reasons you would use a framework on the server-side: adding organization and structure to your code (especially in a manner well suited for collaboration), separation of concerns as per the above mentioned MV* pattern, abstraction of some low-level details, papering over of implementation differences between platforms, and a bevy of useful built-in functionality. In many cases, the point is simply to avoid having to re-invent the wheel for each project.",{"type":21,"tag":22,"props":35867,"children":35868},{},[35869],{"type":26,"value":35870},"More specifically, a JS framework is particularly helpful for applications where much of the business logic is going to take place on the client-side - routing, templating, first-pass model validation, table building and pagination - pretty much whatever you might have used the server for in the past, but now without the latency and overhead that additional HTTP calls would have incurred.",{"type":21,"tag":22,"props":35872,"children":35873},{},[35874],{"type":26,"value":35875},"It was never good practice to have the server do a bunch of work and spit out a gob of html to insert - this approach is less readable, harder to maintain, and harder to debug then returning just the needed data; and woe to those who include javascript in the chunk of html! Now, there's absolutely no excuse for it, and many good reasons and a lot of functionality to support doing most of the work client-side. A good REST API returning JSON and a JS framework are a natural pair.",{"type":21,"tag":22,"props":35877,"children":35878},{},[35879],{"type":26,"value":35880},"As an example, many JS frameworks include client-side routing, using the history API and/or hash-fragments - making single page apps with identifiable and even uniquely navigable URLs not just possible, but relatively easy (depending on how you go about it). Multi-page applications can also benefit from the routing, of course - there's very few cases these days where a page is likely to remain static throughout it's display lifetime, and using routing to pull in views, which automatically populate some sub-section of the page with a template and bind to a model, is a much cleaner solution than, for instance, a mass of jQuery swapping DOM elements in and out and binding in multiple places to different elements and events.",{"type":21,"tag":3549,"props":35882,"children":35884},{"id":35883},"js-frameworks-vs-jquery-et-al",[35885],{"type":26,"value":35886},"JS Frameworks vs. jQuery (et al.)",{"type":21,"tag":22,"props":35888,"children":35889},{},[35890],{"type":26,"value":35891},"On that topic, why use a framework versus jQuery and it's constellation of plugins, or Prototype, Mootools, and so on?",{"type":21,"tag":22,"props":35893,"children":35894},{},[35895,35897,35902],{"type":26,"value":35896},"The simplest answer is: this is the wrong question. In most cases, you wouldn't use a JS framework instead of jQuery - you might, however, use a JS framework ",{"type":21,"tag":1084,"props":35898,"children":35899},{},[35900],{"type":26,"value":35901},"with",{"type":26,"value":35903}," jQuery. A framework is not a compatibility layer like jQuery - as an example, the framework itself might work in IE8, but it isn't going to give you a polyfill for old IE's non-standard attachEvent method.",{"type":21,"tag":22,"props":35905,"children":35906},{},[35907],{"type":26,"value":35908},"If your project needs to support client-side routing, JS templates, models and collections, data persistence with the server, clean interaction with a REST API, etcetera, you probably want to use a JS framework.",{"type":21,"tag":22,"props":35910,"children":35911},{},[35912],{"type":26,"value":35913},"If you need to support old versions of browsers that may not share an API or support the most recent advances for things like the Selectors API, event listeners, Promises and XMLHTTPRequest, then you probably want to use jQuery.",{"type":21,"tag":22,"props":35915,"children":35916},{},[35917],{"type":26,"value":35918},"If you need both, you probably want to use both. They are (potentially) complementary.",{"type":21,"tag":3549,"props":35920,"children":35922},{"id":35921},"why-not-use-a-framework",[35923],{"type":26,"value":35924},"Why NOT use a framework?",{"type":21,"tag":22,"props":35926,"children":35927},{},[35928],{"type":26,"value":35929},"JS frameworks are not a panacea - they have use-cases for which they are the best solution, and then there are cases where they are unnecessary cruft, slowing down page-load times and obstructing progress.",{"type":21,"tag":22,"props":35931,"children":35932},{},[35933],{"type":26,"value":35934},"When considering whether you should use a JS framework, you should consider the following:",{"type":21,"tag":3739,"props":35936,"children":35937},{},[35938,35943,35948,35953,35958],{"type":21,"tag":3681,"props":35939,"children":35940},{},[35941],{"type":26,"value":35942},"Do I already know a JS framework? Here, the consideration is learning curve. Obviously, learning new things is part of the job (and one of the best parts, at that), but if there's a massive time-crunch to get the project out the door, there may not be the luxury of time needed for learning how to employ a framework to it's best effect. Better to stick to what you know and do it well, then to implement a framework poorly.",{"type":21,"tag":3681,"props":35944,"children":35945},{},[35946],{"type":26,"value":35947},"Is my project big enough? Here, the consideration is the amount of code you expect to need to write for the project - for the same reasons you might eschew a big library like jQuery for a small project, you might want to eschew a framework as well; and if you're expecting only a few source files with a couple hundred lines of code, you can probably do without the organization a framework offers. Of course, none of us are prescient and projects have a tendency to increase in scope, so think hard about this one - it's harder to fit a framework in after the fact than to start with one.",{"type":21,"tag":3681,"props":35949,"children":35950},{},[35951],{"type":26,"value":35952},"Is my project complex enough? Here, the consideration is the complexity of the client-side logic - if all of the work is going to be done server-side and the pages are going to be largely static, a framework isn't going to add much value.",{"type":21,"tag":3681,"props":35954,"children":35955},{},[35956],{"type":26,"value":35957},"Is page-size at a premium? Here, the consideration is the extra kilobytes a gzipped framework library is going to cost to transfer - for the most part, this isn't going to be a concern, especially for single page apps, but if one of the other considerations is borderline and page-size matters, you might decide to do without the framework.",{"type":21,"tag":3681,"props":35959,"children":35960},{},[35961],{"type":26,"value":35962},"Am I familiar with JavaScript? Here, the consideration is how well you know the language and available APIs. This isn't a project-specific consideration, but rather a developer-specific one. If you already know JavaScript inside and out, you'll be able to wring the most out of a framework; if not, you'll need to be careful not to let the framework become a crutch. Reading through the source of some popular frameworks is a great way to become more familiar with the language and some laudable practices.",{"title":8,"searchDepth":254,"depth":254,"links":35964},[35965,35966,35967,35968],{"id":35831,"depth":244,"text":35834},{"id":35857,"depth":244,"text":35860},{"id":35883,"depth":244,"text":35886},{"id":35921,"depth":244,"text":35924},"content:ckeefer:2015-2:js-frameworks.md","ckeefer/2015-2/js-frameworks.md","ckeefer/2015-2/js-frameworks",{"user":3518,"name":3519},{"_path":35974,"_dir":35975,"_draft":7,"_partial":7,"_locale":8,"title":35976,"description":35977,"publishDate":35978,"tags":35979,"image":35980,"excerpt":35977,"body":35981,"_type":3511,"_id":38062,"_source":3513,"_file":38063,"_stem":38064,"_extension":3516,"author":38065},"/ckeefer/2015-1/writeonce","2015-1","Write Once, Debug Everywhere","It's pretty seldom that anyone mentions web pages these days, other than in historical reference to days long gone by (yes, a whole few years ago). Web sites, sure, but not if what is really wanted is to replace something that, not so long ago, would have been some native code for a smartphone (or a little further back still, a desktop computer). Generally speaking, the most common term tripping from client's lips these days is 'web applications' - or webapps, because who has time for spaces and proper spelling, amirite?","2015-02-02",[12],"/ckeefer/2015-1/img/html5java.jpg",{"type":18,"children":35982,"toc":38056},[35983,35989,35993,35998,36003,36008,36020,36025,36031,36036,36041,36046,36060,36074,36080,36093,36098,36121,36142,37109,37114,38003,38026,38031,38037,38042,38047,38052],{"type":21,"tag":3549,"props":35984,"children":35986},{"id":35985},"or-why-we-still-have-to-test-in-every-browser-web-standards-notwithstanding",[35987],{"type":26,"value":35988},"Or Why We Still Have To Test In Every Browser, Web Standards Notwithstanding",{"type":21,"tag":22,"props":35990,"children":35991},{},[35992],{"type":26,"value":35977},{"type":21,"tag":22,"props":35994,"children":35995},{},[35996],{"type":26,"value":35997},"Of course, the client in question is almost certainly not interested in a webapp because they're hoping to take advantage of the unique properties and capabilities of any particular browser (unless they're looking for a line-of-business intranet application in IE8, in which case, you have both my scorn and my pity). Everyone wants their app to have the potential to reach the widest audience possible - and that means supporting all the mainstream browsers.",{"type":21,"tag":22,"props":35999,"children":36000},{},[36001],{"type":26,"value":36002},"Oh, and all of the mainstream mobile devices, and their browsers; and maybe smart TVs, consoles, and I hear they're coming out with, like, iWatches and stuff, can we target those too?",{"type":21,"tag":22,"props":36004,"children":36005},{},[36006],{"type":26,"value":36007},"This is, after all, a major selling point of a web application - the promise of 'write once, run anywhere'. One codebase, shared across all of your supported platforms. Since every project comes complete with a limited budget and timeframe, this can allow you to offer your product across a wider range of platforms than if you had to create a different version for each; and in addition to capturing the mainstream devices, your application may be able to appeal to users on minority platforms (Blackberry or Windows Phone, for example), that you couldn't otherwise afford to support.",{"type":21,"tag":22,"props":36009,"children":36010},{},[36011,36013,36018],{"type":26,"value":36012},"The dark side to this is that often, your client will expect that your webapp ",{"type":21,"tag":1084,"props":36014,"children":36015},{},[36016],{"type":26,"value":36017},"can and will",{"type":26,"value":36019}," support all of these various devices and browsers, and yet fail to understand why this should affect the project's timeframe or cost. \"Hold on,\" they'll say, \"I thought you said this webapp thing could support every browser that ever was, and more screen and device sizes than have been dreamt of in my philosophies?\"",{"type":21,"tag":22,"props":36021,"children":36022},{},[36023],{"type":26,"value":36024},"Well, perhaps I exaggerate; but the difficulties involved in supporting even just recent versions of browsers across many platforms tends to get underestimated by clients - and, sometimes, developers as well.",{"type":21,"tag":3549,"props":36026,"children":36028},{"id":36027},"the-browser-is-the-new-virtual-machine",[36029],{"type":26,"value":36030},"The Browser is the new Virtual Machine",{"type":21,"tag":22,"props":36032,"children":36033},{},[36034],{"type":26,"value":36035},"Of course, the promise of 'write once, run anywhere' has been made before, most famously by Sun Microsystems for its Java language, and the Java Virtual Machine. Developers familiar with the language have an old joke based on the marketing slogan: \"Write once, debug everywhere\"; and the joke applies all the more certainly to web development.",{"type":21,"tag":22,"props":36037,"children":36038},{},[36039],{"type":26,"value":36040},"While all major browsers follow the W3C standards, and carefully feature test against the specifications, their implementations are unique - at least Java developers could expect that the JVM was being made by engineers who, if nothing else, could step across the hallway and ask their fellows about the details of this or that feature implementation.",{"type":21,"tag":22,"props":36042,"children":36043},{},[36044],{"type":26,"value":36045},"The developers for Firefox do their best to offer something like this, by developing entirely in open source; Google and Safari each have their closed components, though (and Blink and Webkit diverge by the day), and the implementation details of Internet Explorer are a mystery. The same challenges that faced developers working with the JVM on differing operating systems and/or hardware - subtle bugs encountered in surprising places, limited subsets of functionality available across all platforms (and sometimes, not available using the same mechanisms, or to the same degree) - are faced by webapp developers today.",{"type":21,"tag":22,"props":36047,"children":36048},{},[36049,36051,36058],{"type":26,"value":36050},"Just look at this sample of the ",{"type":21,"tag":29,"props":36052,"children":36055},{"href":36053,"rel":36054},"https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills",[93],[36056],{"type":26,"value":36057},"polyfills, shims and outright hacks",{"type":26,"value":36059}," collected to try and bridge the feature gaps between browsers, or offer a single sane interface over differing implementations.",{"type":21,"tag":22,"props":36061,"children":36062},{},[36063,36065,36072],{"type":26,"value":36064},"Realistically, when estimating projects and committing to which browsers to support, each browser should be considered a separate platform with its attendant needs for platform-specific code and testing. Moreover, supporting any mobile device and browser greatly increases the chance of needing platform-specific code (not to mention the significant cost of 'responsive design' styling to make a site mobile-friendly). Major versions of said browsers may also qualify for this careful treatment (consider the vast ",{"type":21,"tag":29,"props":36066,"children":36069},{"href":36067,"rel":36068},"http://caniuse.com/#compare=ie%2B8%2Cie%2B9",[93],[36070],{"type":26,"value":36071},"diffference in features between IE8 and IE9",{"type":26,"value":36073},", for example).",{"type":21,"tag":3549,"props":36075,"children":36077},{"id":36076},"an-example-for-the-skeptical",[36078],{"type":26,"value":36079},"An Example for the skeptical",{"type":21,"tag":22,"props":36081,"children":36082},{},[36083,36085,36092],{"type":26,"value":36084},"Any web developer whose had to work with multiple platforms will have horror stories about surprising issues - and not just those who've been working with cutting-edge tech (consider, for instance, the issues encountered when ",{"type":21,"tag":29,"props":36086,"children":36089},{"href":36087,"rel":36088},"http://www.alproduction.local/blog/2014/04/hidden-options-a-workaround/",[93],[36090],{"type":26,"value":36091},"all you want to do is hide options in a select element",{"type":26,"value":2699},{"type":21,"tag":22,"props":36094,"children":36095},{},[36096],{"type":26,"value":36097},"But let's take something both fairly cutting edge, and yet commonly requested, as our example: image manipulation on the client side. To cut this example down to the barebones, this is the scenario: we have the user select an image using a file input, that we the read in using FileReader, let the user decide how they want to crop the image, and perform the crop and create a new image using the Canvas. Fairly involved, but nothing any modern browser shouldn't be able to do.",{"type":21,"tag":22,"props":36099,"children":36100},{},[36101,36103,36110,36112,36119],{"type":26,"value":36102},"Ah, but are we including IE9 in our array of 'modern browsers' that we have to support? We probably are, since IE9 still has a ",{"type":21,"tag":29,"props":36104,"children":36107},{"href":36105,"rel":36106},"https://www.netmarketshare.com/browser-market-share.aspx?qprid=2&qpcustomd=0",[93],[36108],{"type":26,"value":36109},"10% market share",{"type":26,"value":36111}," as of this writing; but ",{"type":21,"tag":29,"props":36113,"children":36116},{"href":36114,"rel":36115},"http://caniuse.com/#feat=filereader",[93],[36117],{"type":26,"value":36118},"IE9 doesn't support FileReader",{"type":26,"value":36120},", so we have to include some complex shim to add the functionality we need (probably Flash or Silverlight based).",{"type":21,"tag":22,"props":36122,"children":36123},{},[36124,36126,36131,36133,36140],{"type":26,"value":36125},"Okay, but IE9 is old news. ",{"type":21,"tag":1084,"props":36127,"children":36128},{},[36129],{"type":26,"value":36130},"Truly",{"type":26,"value":36132}," modern browsers have everything we need. Oh? But what if we need to convert the resulting image into a blob, for sending to the server? On chrome, ",{"type":21,"tag":29,"props":36134,"children":36137},{"href":36135,"rel":36136},"https://code.google.com/p/chromium/issues/detail?id=67587",[93],[36138],{"type":26,"value":36139},"getting a blob from the canvas isn't supported yet",{"type":26,"value":36141},". So, we have to include a polyfill to handle this case manually:",{"type":21,"tag":200,"props":36143,"children":36145},{"className":9044,"code":36144,"language":9046,"meta":8,"style":8},"/**\n * Canvas toBlob shim, adapted with thanks from https://code.google.com/u/105701149099589407503/, \n * from this chrome bug thread: https://code.google.com/p/chromium/issues/detail?id=67587\n */\n(function(){\n    /**\n     * Convert a base64 image dataURL from a canvas element, to a blob.\n     * @param {function} callback\n     * @param {string} type\n     * @param {number} quality\n     * @param {base64=} dataURL The dataURL to use, rather than fetch from the canvas.\n     */\n    function dataURLToBlob(callback, type, quality, dataURL){\n        dataURL = dataURL || this.toDataURL(type, quality);\n        var bin = atob(dataURL.split(',')[1]),\n            len = bin.length,\n            len32 = len >> 2,\n            a8 = new Uint8Array(len),\n            a32 = new Uint32Array(a8.buffer, 0, len32),\n            tailLength = len & 3;\n\n        for(var i=0, j=0; i \u003C len32; i++)\n        {\n            a32[i] = bin.charCodeAt(j++) |\n                bin.charCodeAt(j++) \u003C\u003C 8 |\n                bin.charCodeAt(j++) \u003C\u003C 16 |\n                bin.charCodeAt(j++) \u003C\u003C 24;\n        }\n\n        while(tailLength--)\n        {\n            a8[j] = bin.charCodeAt(j++);\n        }\n\n        callback(new Blob([a8], {'type': type || 'image/png'}));\n    }\n\n    if(HTMLCanvasElement && Object.defineProperty && !HTMLCanvasElement.prototype.toBlob)\n    {\n        Object.defineProperty(HTMLCanvasElement.prototype, 'toBlob',\n        {\n            value:dataURLToBlob\n        });\n    }\n})();\n",[36146],{"type":21,"tag":63,"props":36147,"children":36148},{"__ignoreMap":8},[36149,36156,36164,36172,36179,36194,36201,36209,36230,36250,36270,36296,36303,36354,36393,36446,36472,36503,36529,36564,36594,36601,36666,36673,36712,36751,36787,36823,36830,36837,36859,36866,36898,36905,36912,36961,36968,36975,37022,37030,37072,37079,37087,37094,37101],{"type":21,"tag":209,"props":36150,"children":36151},{"class":211,"line":212},[36152],{"type":21,"tag":209,"props":36153,"children":36154},{"style":448},[36155],{"type":26,"value":731},{"type":21,"tag":209,"props":36157,"children":36158},{"class":211,"line":244},[36159],{"type":21,"tag":209,"props":36160,"children":36161},{"style":448},[36162],{"type":26,"value":36163}," * Canvas toBlob shim, adapted with thanks from https://code.google.com/u/105701149099589407503/, \n",{"type":21,"tag":209,"props":36165,"children":36166},{"class":211,"line":254},[36167],{"type":21,"tag":209,"props":36168,"children":36169},{"style":448},[36170],{"type":26,"value":36171}," * from this chrome bug thread: https://code.google.com/p/chromium/issues/detail?id=67587\n",{"type":21,"tag":209,"props":36173,"children":36174},{"class":211,"line":279},[36175],{"type":21,"tag":209,"props":36176,"children":36177},{"style":448},[36178],{"type":26,"value":755},{"type":21,"tag":209,"props":36180,"children":36181},{"class":211,"line":288},[36182,36186,36190],{"type":21,"tag":209,"props":36183,"children":36184},{"style":222},[36185],{"type":26,"value":368},{"type":21,"tag":209,"props":36187,"children":36188},{"style":216},[36189],{"type":26,"value":5370},{"type":21,"tag":209,"props":36191,"children":36192},{"style":222},[36193],{"type":26,"value":2561},{"type":21,"tag":209,"props":36195,"children":36196},{"class":211,"line":307},[36197],{"type":21,"tag":209,"props":36198,"children":36199},{"style":448},[36200],{"type":26,"value":4697},{"type":21,"tag":209,"props":36202,"children":36203},{"class":211,"line":325},[36204],{"type":21,"tag":209,"props":36205,"children":36206},{"style":448},[36207],{"type":26,"value":36208},"     * Convert a base64 image dataURL from a canvas element, to a blob.\n",{"type":21,"tag":209,"props":36210,"children":36211},{"class":211,"line":334},[36212,36216,36220,36225],{"type":21,"tag":209,"props":36213,"children":36214},{"style":448},[36215],{"type":26,"value":4713},{"type":21,"tag":209,"props":36217,"children":36218},{"style":216},[36219],{"type":26,"value":4718},{"type":21,"tag":209,"props":36221,"children":36222},{"style":360},[36223],{"type":26,"value":36224}," {function}",{"type":21,"tag":209,"props":36226,"children":36227},{"style":222},[36228],{"type":26,"value":36229}," callback\n",{"type":21,"tag":209,"props":36231,"children":36232},{"class":211,"line":343},[36233,36237,36241,36245],{"type":21,"tag":209,"props":36234,"children":36235},{"style":448},[36236],{"type":26,"value":4713},{"type":21,"tag":209,"props":36238,"children":36239},{"style":216},[36240],{"type":26,"value":4718},{"type":21,"tag":209,"props":36242,"children":36243},{"style":360},[36244],{"type":26,"value":4723},{"type":21,"tag":209,"props":36246,"children":36247},{"style":222},[36248],{"type":26,"value":36249}," type\n",{"type":21,"tag":209,"props":36251,"children":36252},{"class":211,"line":351},[36253,36257,36261,36265],{"type":21,"tag":209,"props":36254,"children":36255},{"style":448},[36256],{"type":26,"value":4713},{"type":21,"tag":209,"props":36258,"children":36259},{"style":216},[36260],{"type":26,"value":4718},{"type":21,"tag":209,"props":36262,"children":36263},{"style":360},[36264],{"type":26,"value":30651},{"type":21,"tag":209,"props":36266,"children":36267},{"style":222},[36268],{"type":26,"value":36269}," quality\n",{"type":21,"tag":209,"props":36271,"children":36272},{"class":211,"line":444},[36273,36277,36281,36286,36291],{"type":21,"tag":209,"props":36274,"children":36275},{"style":448},[36276],{"type":26,"value":4713},{"type":21,"tag":209,"props":36278,"children":36279},{"style":216},[36280],{"type":26,"value":4718},{"type":21,"tag":209,"props":36282,"children":36283},{"style":360},[36284],{"type":26,"value":36285}," {base64=}",{"type":21,"tag":209,"props":36287,"children":36288},{"style":222},[36289],{"type":26,"value":36290}," dataURL",{"type":21,"tag":209,"props":36292,"children":36293},{"style":448},[36294],{"type":26,"value":36295}," The dataURL to use, rather than fetch from the canvas.\n",{"type":21,"tag":209,"props":36297,"children":36298},{"class":211,"line":454},[36299],{"type":21,"tag":209,"props":36300,"children":36301},{"style":448},[36302],{"type":26,"value":4753},{"type":21,"tag":209,"props":36304,"children":36305},{"class":211,"line":463},[36306,36310,36315,36319,36324,36328,36332,36336,36341,36345,36350],{"type":21,"tag":209,"props":36307,"children":36308},{"style":216},[36309],{"type":26,"value":2981},{"type":21,"tag":209,"props":36311,"children":36312},{"style":360},[36313],{"type":26,"value":36314}," dataURLToBlob",{"type":21,"tag":209,"props":36316,"children":36317},{"style":222},[36318],{"type":26,"value":368},{"type":21,"tag":209,"props":36320,"children":36321},{"style":400},[36322],{"type":26,"value":36323},"callback",{"type":21,"tag":209,"props":36325,"children":36326},{"style":222},[36327],{"type":26,"value":408},{"type":21,"tag":209,"props":36329,"children":36330},{"style":400},[36331],{"type":26,"value":25774},{"type":21,"tag":209,"props":36333,"children":36334},{"style":222},[36335],{"type":26,"value":408},{"type":21,"tag":209,"props":36337,"children":36338},{"style":400},[36339],{"type":26,"value":36340},"quality",{"type":21,"tag":209,"props":36342,"children":36343},{"style":222},[36344],{"type":26,"value":408},{"type":21,"tag":209,"props":36346,"children":36347},{"style":400},[36348],{"type":26,"value":36349},"dataURL",{"type":21,"tag":209,"props":36351,"children":36352},{"style":222},[36353],{"type":26,"value":2369},{"type":21,"tag":209,"props":36355,"children":36356},{"class":211,"line":472},[36357,36362,36366,36371,36375,36379,36383,36388],{"type":21,"tag":209,"props":36358,"children":36359},{"style":222},[36360],{"type":26,"value":36361},"        dataURL ",{"type":21,"tag":209,"props":36363,"children":36364},{"style":216},[36365],{"type":26,"value":1432},{"type":21,"tag":209,"props":36367,"children":36368},{"style":222},[36369],{"type":26,"value":36370}," dataURL ",{"type":21,"tag":209,"props":36372,"children":36373},{"style":216},[36374],{"type":26,"value":4677},{"type":21,"tag":209,"props":36376,"children":36377},{"style":263},[36378],{"type":26,"value":17698},{"type":21,"tag":209,"props":36380,"children":36381},{"style":222},[36382],{"type":26,"value":378},{"type":21,"tag":209,"props":36384,"children":36385},{"style":360},[36386],{"type":26,"value":36387},"toDataURL",{"type":21,"tag":209,"props":36389,"children":36390},{"style":222},[36391],{"type":26,"value":36392},"(type, quality);\n",{"type":21,"tag":209,"props":36394,"children":36395},{"class":211,"line":480},[36396,36400,36405,36409,36414,36419,36424,36428,36433,36437,36441],{"type":21,"tag":209,"props":36397,"children":36398},{"style":216},[36399],{"type":26,"value":5925},{"type":21,"tag":209,"props":36401,"children":36402},{"style":222},[36403],{"type":26,"value":36404}," bin ",{"type":21,"tag":209,"props":36406,"children":36407},{"style":216},[36408],{"type":26,"value":1432},{"type":21,"tag":209,"props":36410,"children":36411},{"style":360},[36412],{"type":26,"value":36413}," atob",{"type":21,"tag":209,"props":36415,"children":36416},{"style":222},[36417],{"type":26,"value":36418},"(dataURL.",{"type":21,"tag":209,"props":36420,"children":36421},{"style":360},[36422],{"type":26,"value":36423},"split",{"type":21,"tag":209,"props":36425,"children":36426},{"style":222},[36427],{"type":26,"value":368},{"type":21,"tag":209,"props":36429,"children":36430},{"style":233},[36431],{"type":26,"value":36432},"','",{"type":21,"tag":209,"props":36434,"children":36435},{"style":222},[36436],{"type":26,"value":24289},{"type":21,"tag":209,"props":36438,"children":36439},{"style":263},[36440],{"type":26,"value":3224},{"type":21,"tag":209,"props":36442,"children":36443},{"style":222},[36444],{"type":26,"value":36445},"]),\n",{"type":21,"tag":209,"props":36447,"children":36448},{"class":211,"line":489},[36449,36454,36458,36463,36468],{"type":21,"tag":209,"props":36450,"children":36451},{"style":222},[36452],{"type":26,"value":36453},"            len ",{"type":21,"tag":209,"props":36455,"children":36456},{"style":216},[36457],{"type":26,"value":1432},{"type":21,"tag":209,"props":36459,"children":36460},{"style":222},[36461],{"type":26,"value":36462}," bin.",{"type":21,"tag":209,"props":36464,"children":36465},{"style":263},[36466],{"type":26,"value":36467},"length",{"type":21,"tag":209,"props":36469,"children":36470},{"style":222},[36471],{"type":26,"value":304},{"type":21,"tag":209,"props":36473,"children":36474},{"class":211,"line":847},[36475,36480,36484,36489,36494,36499],{"type":21,"tag":209,"props":36476,"children":36477},{"style":222},[36478],{"type":26,"value":36479},"            len32 ",{"type":21,"tag":209,"props":36481,"children":36482},{"style":216},[36483],{"type":26,"value":1432},{"type":21,"tag":209,"props":36485,"children":36486},{"style":222},[36487],{"type":26,"value":36488}," len ",{"type":21,"tag":209,"props":36490,"children":36491},{"style":216},[36492],{"type":26,"value":36493},">>",{"type":21,"tag":209,"props":36495,"children":36496},{"style":263},[36497],{"type":26,"value":36498}," 2",{"type":21,"tag":209,"props":36500,"children":36501},{"style":222},[36502],{"type":26,"value":304},{"type":21,"tag":209,"props":36504,"children":36505},{"class":211,"line":860},[36506,36511,36515,36519,36524],{"type":21,"tag":209,"props":36507,"children":36508},{"style":222},[36509],{"type":26,"value":36510},"            a8 ",{"type":21,"tag":209,"props":36512,"children":36513},{"style":216},[36514],{"type":26,"value":1432},{"type":21,"tag":209,"props":36516,"children":36517},{"style":216},[36518],{"type":26,"value":4667},{"type":21,"tag":209,"props":36520,"children":36521},{"style":360},[36522],{"type":26,"value":36523}," Uint8Array",{"type":21,"tag":209,"props":36525,"children":36526},{"style":222},[36527],{"type":26,"value":36528},"(len),\n",{"type":21,"tag":209,"props":36530,"children":36531},{"class":211,"line":877},[36532,36537,36541,36545,36550,36555,36559],{"type":21,"tag":209,"props":36533,"children":36534},{"style":222},[36535],{"type":26,"value":36536},"            a32 ",{"type":21,"tag":209,"props":36538,"children":36539},{"style":216},[36540],{"type":26,"value":1432},{"type":21,"tag":209,"props":36542,"children":36543},{"style":216},[36544],{"type":26,"value":4667},{"type":21,"tag":209,"props":36546,"children":36547},{"style":360},[36548],{"type":26,"value":36549}," Uint32Array",{"type":21,"tag":209,"props":36551,"children":36552},{"style":222},[36553],{"type":26,"value":36554},"(a8.buffer, ",{"type":21,"tag":209,"props":36556,"children":36557},{"style":263},[36558],{"type":26,"value":6048},{"type":21,"tag":209,"props":36560,"children":36561},{"style":222},[36562],{"type":26,"value":36563},", len32),\n",{"type":21,"tag":209,"props":36565,"children":36566},{"class":211,"line":889},[36567,36572,36576,36580,36585,36590],{"type":21,"tag":209,"props":36568,"children":36569},{"style":222},[36570],{"type":26,"value":36571},"            tailLength ",{"type":21,"tag":209,"props":36573,"children":36574},{"style":216},[36575],{"type":26,"value":1432},{"type":21,"tag":209,"props":36577,"children":36578},{"style":222},[36579],{"type":26,"value":36488},{"type":21,"tag":209,"props":36581,"children":36582},{"style":216},[36583],{"type":26,"value":36584},"&",{"type":21,"tag":209,"props":36586,"children":36587},{"style":263},[36588],{"type":26,"value":36589}," 3",{"type":21,"tag":209,"props":36591,"children":36592},{"style":222},[36593],{"type":26,"value":241},{"type":21,"tag":209,"props":36595,"children":36596},{"class":211,"line":902},[36597],{"type":21,"tag":209,"props":36598,"children":36599},{"emptyLinePlaceholder":248},[36600],{"type":26,"value":251},{"type":21,"tag":209,"props":36602,"children":36603},{"class":211,"line":914},[36604,36609,36613,36617,36622,36626,36630,36635,36639,36643,36648,36652,36657,36662],{"type":21,"tag":209,"props":36605,"children":36606},{"style":216},[36607],{"type":26,"value":36608},"        for",{"type":21,"tag":209,"props":36610,"children":36611},{"style":222},[36612],{"type":26,"value":368},{"type":21,"tag":209,"props":36614,"children":36615},{"style":216},[36616],{"type":26,"value":8996},{"type":21,"tag":209,"props":36618,"children":36619},{"style":222},[36620],{"type":26,"value":36621}," i",{"type":21,"tag":209,"props":36623,"children":36624},{"style":216},[36625],{"type":26,"value":1432},{"type":21,"tag":209,"props":36627,"children":36628},{"style":263},[36629],{"type":26,"value":6048},{"type":21,"tag":209,"props":36631,"children":36632},{"style":222},[36633],{"type":26,"value":36634},", j",{"type":21,"tag":209,"props":36636,"children":36637},{"style":216},[36638],{"type":26,"value":1432},{"type":21,"tag":209,"props":36640,"children":36641},{"style":263},[36642],{"type":26,"value":6048},{"type":21,"tag":209,"props":36644,"children":36645},{"style":222},[36646],{"type":26,"value":36647},"; i ",{"type":21,"tag":209,"props":36649,"children":36650},{"style":216},[36651],{"type":26,"value":1985},{"type":21,"tag":209,"props":36653,"children":36654},{"style":222},[36655],{"type":26,"value":36656}," len32; i",{"type":21,"tag":209,"props":36658,"children":36659},{"style":216},[36660],{"type":26,"value":36661},"++",{"type":21,"tag":209,"props":36663,"children":36664},{"style":222},[36665],{"type":26,"value":10112},{"type":21,"tag":209,"props":36667,"children":36668},{"class":211,"line":922},[36669],{"type":21,"tag":209,"props":36670,"children":36671},{"style":222},[36672],{"type":26,"value":7561},{"type":21,"tag":209,"props":36674,"children":36675},{"class":211,"line":2312},[36676,36681,36685,36689,36694,36699,36703,36707],{"type":21,"tag":209,"props":36677,"children":36678},{"style":222},[36679],{"type":26,"value":36680},"            a32[i] ",{"type":21,"tag":209,"props":36682,"children":36683},{"style":216},[36684],{"type":26,"value":1432},{"type":21,"tag":209,"props":36686,"children":36687},{"style":222},[36688],{"type":26,"value":36462},{"type":21,"tag":209,"props":36690,"children":36691},{"style":360},[36692],{"type":26,"value":36693},"charCodeAt",{"type":21,"tag":209,"props":36695,"children":36696},{"style":222},[36697],{"type":26,"value":36698},"(j",{"type":21,"tag":209,"props":36700,"children":36701},{"style":216},[36702],{"type":26,"value":36661},{"type":21,"tag":209,"props":36704,"children":36705},{"style":222},[36706],{"type":26,"value":432},{"type":21,"tag":209,"props":36708,"children":36709},{"style":216},[36710],{"type":26,"value":36711},"|\n",{"type":21,"tag":209,"props":36713,"children":36714},{"class":211,"line":2321},[36715,36720,36724,36728,36732,36736,36741,36746],{"type":21,"tag":209,"props":36716,"children":36717},{"style":222},[36718],{"type":26,"value":36719},"                bin.",{"type":21,"tag":209,"props":36721,"children":36722},{"style":360},[36723],{"type":26,"value":36693},{"type":21,"tag":209,"props":36725,"children":36726},{"style":222},[36727],{"type":26,"value":36698},{"type":21,"tag":209,"props":36729,"children":36730},{"style":216},[36731],{"type":26,"value":36661},{"type":21,"tag":209,"props":36733,"children":36734},{"style":222},[36735],{"type":26,"value":432},{"type":21,"tag":209,"props":36737,"children":36738},{"style":216},[36739],{"type":26,"value":36740},"\u003C\u003C",{"type":21,"tag":209,"props":36742,"children":36743},{"style":263},[36744],{"type":26,"value":36745}," 8",{"type":21,"tag":209,"props":36747,"children":36748},{"style":216},[36749],{"type":26,"value":36750}," |\n",{"type":21,"tag":209,"props":36752,"children":36753},{"class":211,"line":2372},[36754,36758,36762,36766,36770,36774,36778,36783],{"type":21,"tag":209,"props":36755,"children":36756},{"style":222},[36757],{"type":26,"value":36719},{"type":21,"tag":209,"props":36759,"children":36760},{"style":360},[36761],{"type":26,"value":36693},{"type":21,"tag":209,"props":36763,"children":36764},{"style":222},[36765],{"type":26,"value":36698},{"type":21,"tag":209,"props":36767,"children":36768},{"style":216},[36769],{"type":26,"value":36661},{"type":21,"tag":209,"props":36771,"children":36772},{"style":222},[36773],{"type":26,"value":432},{"type":21,"tag":209,"props":36775,"children":36776},{"style":216},[36777],{"type":26,"value":36740},{"type":21,"tag":209,"props":36779,"children":36780},{"style":263},[36781],{"type":26,"value":36782}," 16",{"type":21,"tag":209,"props":36784,"children":36785},{"style":216},[36786],{"type":26,"value":36750},{"type":21,"tag":209,"props":36788,"children":36789},{"class":211,"line":2381},[36790,36794,36798,36802,36806,36810,36814,36819],{"type":21,"tag":209,"props":36791,"children":36792},{"style":222},[36793],{"type":26,"value":36719},{"type":21,"tag":209,"props":36795,"children":36796},{"style":360},[36797],{"type":26,"value":36693},{"type":21,"tag":209,"props":36799,"children":36800},{"style":222},[36801],{"type":26,"value":36698},{"type":21,"tag":209,"props":36803,"children":36804},{"style":216},[36805],{"type":26,"value":36661},{"type":21,"tag":209,"props":36807,"children":36808},{"style":222},[36809],{"type":26,"value":432},{"type":21,"tag":209,"props":36811,"children":36812},{"style":216},[36813],{"type":26,"value":36740},{"type":21,"tag":209,"props":36815,"children":36816},{"style":263},[36817],{"type":26,"value":36818}," 24",{"type":21,"tag":209,"props":36820,"children":36821},{"style":222},[36822],{"type":26,"value":241},{"type":21,"tag":209,"props":36824,"children":36825},{"class":211,"line":2389},[36826],{"type":21,"tag":209,"props":36827,"children":36828},{"style":222},[36829],{"type":26,"value":2235},{"type":21,"tag":209,"props":36831,"children":36832},{"class":211,"line":2397},[36833],{"type":21,"tag":209,"props":36834,"children":36835},{"emptyLinePlaceholder":248},[36836],{"type":26,"value":251},{"type":21,"tag":209,"props":36838,"children":36839},{"class":211,"line":2406},[36840,36845,36850,36855],{"type":21,"tag":209,"props":36841,"children":36842},{"style":216},[36843],{"type":26,"value":36844},"        while",{"type":21,"tag":209,"props":36846,"children":36847},{"style":222},[36848],{"type":26,"value":36849},"(tailLength",{"type":21,"tag":209,"props":36851,"children":36852},{"style":216},[36853],{"type":26,"value":36854},"--",{"type":21,"tag":209,"props":36856,"children":36857},{"style":222},[36858],{"type":26,"value":10112},{"type":21,"tag":209,"props":36860,"children":36861},{"class":211,"line":2415},[36862],{"type":21,"tag":209,"props":36863,"children":36864},{"style":222},[36865],{"type":26,"value":7561},{"type":21,"tag":209,"props":36867,"children":36868},{"class":211,"line":2424},[36869,36874,36878,36882,36886,36890,36894],{"type":21,"tag":209,"props":36870,"children":36871},{"style":222},[36872],{"type":26,"value":36873},"            a8[j] ",{"type":21,"tag":209,"props":36875,"children":36876},{"style":216},[36877],{"type":26,"value":1432},{"type":21,"tag":209,"props":36879,"children":36880},{"style":222},[36881],{"type":26,"value":36462},{"type":21,"tag":209,"props":36883,"children":36884},{"style":360},[36885],{"type":26,"value":36693},{"type":21,"tag":209,"props":36887,"children":36888},{"style":222},[36889],{"type":26,"value":36698},{"type":21,"tag":209,"props":36891,"children":36892},{"style":216},[36893],{"type":26,"value":36661},{"type":21,"tag":209,"props":36895,"children":36896},{"style":222},[36897],{"type":26,"value":2608},{"type":21,"tag":209,"props":36899,"children":36900},{"class":211,"line":2433},[36901],{"type":21,"tag":209,"props":36902,"children":36903},{"style":222},[36904],{"type":26,"value":2235},{"type":21,"tag":209,"props":36906,"children":36907},{"class":211,"line":2442},[36908],{"type":21,"tag":209,"props":36909,"children":36910},{"emptyLinePlaceholder":248},[36911],{"type":26,"value":251},{"type":21,"tag":209,"props":36913,"children":36914},{"class":211,"line":2471},[36915,36920,36924,36928,36932,36937,36942,36947,36951,36956],{"type":21,"tag":209,"props":36916,"children":36917},{"style":360},[36918],{"type":26,"value":36919},"        callback",{"type":21,"tag":209,"props":36921,"children":36922},{"style":222},[36923],{"type":26,"value":368},{"type":21,"tag":209,"props":36925,"children":36926},{"style":216},[36927],{"type":26,"value":21569},{"type":21,"tag":209,"props":36929,"children":36930},{"style":360},[36931],{"type":26,"value":9014},{"type":21,"tag":209,"props":36933,"children":36934},{"style":222},[36935],{"type":26,"value":36936},"([a8], {",{"type":21,"tag":209,"props":36938,"children":36939},{"style":233},[36940],{"type":26,"value":36941},"'type'",{"type":21,"tag":209,"props":36943,"children":36944},{"style":222},[36945],{"type":26,"value":36946},": type ",{"type":21,"tag":209,"props":36948,"children":36949},{"style":216},[36950],{"type":26,"value":4677},{"type":21,"tag":209,"props":36952,"children":36953},{"style":233},[36954],{"type":26,"value":36955}," 'image/png'",{"type":21,"tag":209,"props":36957,"children":36958},{"style":222},[36959],{"type":26,"value":36960},"}));\n",{"type":21,"tag":209,"props":36962,"children":36963},{"class":211,"line":2480},[36964],{"type":21,"tag":209,"props":36965,"children":36966},{"style":222},[36967],{"type":26,"value":331},{"type":21,"tag":209,"props":36969,"children":36970},{"class":211,"line":2489},[36971],{"type":21,"tag":209,"props":36972,"children":36973},{"emptyLinePlaceholder":248},[36974],{"type":26,"value":251},{"type":21,"tag":209,"props":36976,"children":36977},{"class":211,"line":2516},[36978,36982,36987,36991,36996,37000,37004,37008,37012,37017],{"type":21,"tag":209,"props":36979,"children":36980},{"style":216},[36981],{"type":26,"value":10853},{"type":21,"tag":209,"props":36983,"children":36984},{"style":222},[36985],{"type":26,"value":36986},"(HTMLCanvasElement ",{"type":21,"tag":209,"props":36988,"children":36989},{"style":216},[36990],{"type":26,"value":15578},{"type":21,"tag":209,"props":36992,"children":36993},{"style":222},[36994],{"type":26,"value":36995}," Object.defineProperty ",{"type":21,"tag":209,"props":36997,"children":36998},{"style":216},[36999],{"type":26,"value":15578},{"type":21,"tag":209,"props":37001,"children":37002},{"style":216},[37003],{"type":26,"value":17157},{"type":21,"tag":209,"props":37005,"children":37006},{"style":263},[37007],{"type":26,"value":8957},{"type":21,"tag":209,"props":37009,"children":37010},{"style":222},[37011],{"type":26,"value":378},{"type":21,"tag":209,"props":37013,"children":37014},{"style":263},[37015],{"type":26,"value":37016},"prototype",{"type":21,"tag":209,"props":37018,"children":37019},{"style":222},[37020],{"type":26,"value":37021},".toBlob)\n",{"type":21,"tag":209,"props":37023,"children":37024},{"class":211,"line":2525},[37025],{"type":21,"tag":209,"props":37026,"children":37027},{"style":222},[37028],{"type":26,"value":37029},"    {\n",{"type":21,"tag":209,"props":37031,"children":37032},{"class":211,"line":2533},[37033,37038,37043,37047,37051,37055,37059,37063,37068],{"type":21,"tag":209,"props":37034,"children":37035},{"style":222},[37036],{"type":26,"value":37037},"        Object.",{"type":21,"tag":209,"props":37039,"children":37040},{"style":360},[37041],{"type":26,"value":37042},"defineProperty",{"type":21,"tag":209,"props":37044,"children":37045},{"style":222},[37046],{"type":26,"value":368},{"type":21,"tag":209,"props":37048,"children":37049},{"style":263},[37050],{"type":26,"value":8957},{"type":21,"tag":209,"props":37052,"children":37053},{"style":222},[37054],{"type":26,"value":378},{"type":21,"tag":209,"props":37056,"children":37057},{"style":263},[37058],{"type":26,"value":37016},{"type":21,"tag":209,"props":37060,"children":37061},{"style":222},[37062],{"type":26,"value":408},{"type":21,"tag":209,"props":37064,"children":37065},{"style":233},[37066],{"type":26,"value":37067},"'toBlob'",{"type":21,"tag":209,"props":37069,"children":37070},{"style":222},[37071],{"type":26,"value":304},{"type":21,"tag":209,"props":37073,"children":37074},{"class":211,"line":2542},[37075],{"type":21,"tag":209,"props":37076,"children":37077},{"style":222},[37078],{"type":26,"value":7561},{"type":21,"tag":209,"props":37080,"children":37081},{"class":211,"line":2550},[37082],{"type":21,"tag":209,"props":37083,"children":37084},{"style":222},[37085],{"type":26,"value":37086},"            value:dataURLToBlob\n",{"type":21,"tag":209,"props":37088,"children":37089},{"class":211,"line":2564},[37090],{"type":21,"tag":209,"props":37091,"children":37092},{"style":222},[37093],{"type":26,"value":5114},{"type":21,"tag":209,"props":37095,"children":37096},{"class":211,"line":2611},[37097],{"type":21,"tag":209,"props":37098,"children":37099},{"style":222},[37100],{"type":26,"value":331},{"type":21,"tag":209,"props":37102,"children":37103},{"class":211,"line":2619},[37104],{"type":21,"tag":209,"props":37105,"children":37106},{"style":222},[37107],{"type":26,"value":37108},"})();\n",{"type":21,"tag":22,"props":37110,"children":37111},{},[37112],{"type":26,"value":37113},"See here:",{"type":21,"tag":200,"props":37115,"children":37116},{"className":9044,"code":36144,"language":9046,"meta":8,"style":8},[37117],{"type":21,"tag":63,"props":37118,"children":37119},{"__ignoreMap":8},[37120,37127,37134,37141,37148,37163,37170,37177,37196,37215,37234,37257,37264,37311,37346,37393,37416,37443,37466,37497,37524,37531,37590,37597,37632,37667,37702,37737,37744,37751,37770,37777,37808,37815,37822,37865,37872,37879,37922,37929,37968,37975,37982,37989,37996],{"type":21,"tag":209,"props":37121,"children":37122},{"class":211,"line":212},[37123],{"type":21,"tag":209,"props":37124,"children":37125},{"style":448},[37126],{"type":26,"value":731},{"type":21,"tag":209,"props":37128,"children":37129},{"class":211,"line":244},[37130],{"type":21,"tag":209,"props":37131,"children":37132},{"style":448},[37133],{"type":26,"value":36163},{"type":21,"tag":209,"props":37135,"children":37136},{"class":211,"line":254},[37137],{"type":21,"tag":209,"props":37138,"children":37139},{"style":448},[37140],{"type":26,"value":36171},{"type":21,"tag":209,"props":37142,"children":37143},{"class":211,"line":279},[37144],{"type":21,"tag":209,"props":37145,"children":37146},{"style":448},[37147],{"type":26,"value":755},{"type":21,"tag":209,"props":37149,"children":37150},{"class":211,"line":288},[37151,37155,37159],{"type":21,"tag":209,"props":37152,"children":37153},{"style":222},[37154],{"type":26,"value":368},{"type":21,"tag":209,"props":37156,"children":37157},{"style":216},[37158],{"type":26,"value":5370},{"type":21,"tag":209,"props":37160,"children":37161},{"style":222},[37162],{"type":26,"value":2561},{"type":21,"tag":209,"props":37164,"children":37165},{"class":211,"line":307},[37166],{"type":21,"tag":209,"props":37167,"children":37168},{"style":448},[37169],{"type":26,"value":4697},{"type":21,"tag":209,"props":37171,"children":37172},{"class":211,"line":325},[37173],{"type":21,"tag":209,"props":37174,"children":37175},{"style":448},[37176],{"type":26,"value":36208},{"type":21,"tag":209,"props":37178,"children":37179},{"class":211,"line":334},[37180,37184,37188,37192],{"type":21,"tag":209,"props":37181,"children":37182},{"style":448},[37183],{"type":26,"value":4713},{"type":21,"tag":209,"props":37185,"children":37186},{"style":216},[37187],{"type":26,"value":4718},{"type":21,"tag":209,"props":37189,"children":37190},{"style":360},[37191],{"type":26,"value":36224},{"type":21,"tag":209,"props":37193,"children":37194},{"style":222},[37195],{"type":26,"value":36229},{"type":21,"tag":209,"props":37197,"children":37198},{"class":211,"line":343},[37199,37203,37207,37211],{"type":21,"tag":209,"props":37200,"children":37201},{"style":448},[37202],{"type":26,"value":4713},{"type":21,"tag":209,"props":37204,"children":37205},{"style":216},[37206],{"type":26,"value":4718},{"type":21,"tag":209,"props":37208,"children":37209},{"style":360},[37210],{"type":26,"value":4723},{"type":21,"tag":209,"props":37212,"children":37213},{"style":222},[37214],{"type":26,"value":36249},{"type":21,"tag":209,"props":37216,"children":37217},{"class":211,"line":351},[37218,37222,37226,37230],{"type":21,"tag":209,"props":37219,"children":37220},{"style":448},[37221],{"type":26,"value":4713},{"type":21,"tag":209,"props":37223,"children":37224},{"style":216},[37225],{"type":26,"value":4718},{"type":21,"tag":209,"props":37227,"children":37228},{"style":360},[37229],{"type":26,"value":30651},{"type":21,"tag":209,"props":37231,"children":37232},{"style":222},[37233],{"type":26,"value":36269},{"type":21,"tag":209,"props":37235,"children":37236},{"class":211,"line":444},[37237,37241,37245,37249,37253],{"type":21,"tag":209,"props":37238,"children":37239},{"style":448},[37240],{"type":26,"value":4713},{"type":21,"tag":209,"props":37242,"children":37243},{"style":216},[37244],{"type":26,"value":4718},{"type":21,"tag":209,"props":37246,"children":37247},{"style":360},[37248],{"type":26,"value":36285},{"type":21,"tag":209,"props":37250,"children":37251},{"style":222},[37252],{"type":26,"value":36290},{"type":21,"tag":209,"props":37254,"children":37255},{"style":448},[37256],{"type":26,"value":36295},{"type":21,"tag":209,"props":37258,"children":37259},{"class":211,"line":454},[37260],{"type":21,"tag":209,"props":37261,"children":37262},{"style":448},[37263],{"type":26,"value":4753},{"type":21,"tag":209,"props":37265,"children":37266},{"class":211,"line":463},[37267,37271,37275,37279,37283,37287,37291,37295,37299,37303,37307],{"type":21,"tag":209,"props":37268,"children":37269},{"style":216},[37270],{"type":26,"value":2981},{"type":21,"tag":209,"props":37272,"children":37273},{"style":360},[37274],{"type":26,"value":36314},{"type":21,"tag":209,"props":37276,"children":37277},{"style":222},[37278],{"type":26,"value":368},{"type":21,"tag":209,"props":37280,"children":37281},{"style":400},[37282],{"type":26,"value":36323},{"type":21,"tag":209,"props":37284,"children":37285},{"style":222},[37286],{"type":26,"value":408},{"type":21,"tag":209,"props":37288,"children":37289},{"style":400},[37290],{"type":26,"value":25774},{"type":21,"tag":209,"props":37292,"children":37293},{"style":222},[37294],{"type":26,"value":408},{"type":21,"tag":209,"props":37296,"children":37297},{"style":400},[37298],{"type":26,"value":36340},{"type":21,"tag":209,"props":37300,"children":37301},{"style":222},[37302],{"type":26,"value":408},{"type":21,"tag":209,"props":37304,"children":37305},{"style":400},[37306],{"type":26,"value":36349},{"type":21,"tag":209,"props":37308,"children":37309},{"style":222},[37310],{"type":26,"value":2369},{"type":21,"tag":209,"props":37312,"children":37313},{"class":211,"line":472},[37314,37318,37322,37326,37330,37334,37338,37342],{"type":21,"tag":209,"props":37315,"children":37316},{"style":222},[37317],{"type":26,"value":36361},{"type":21,"tag":209,"props":37319,"children":37320},{"style":216},[37321],{"type":26,"value":1432},{"type":21,"tag":209,"props":37323,"children":37324},{"style":222},[37325],{"type":26,"value":36370},{"type":21,"tag":209,"props":37327,"children":37328},{"style":216},[37329],{"type":26,"value":4677},{"type":21,"tag":209,"props":37331,"children":37332},{"style":263},[37333],{"type":26,"value":17698},{"type":21,"tag":209,"props":37335,"children":37336},{"style":222},[37337],{"type":26,"value":378},{"type":21,"tag":209,"props":37339,"children":37340},{"style":360},[37341],{"type":26,"value":36387},{"type":21,"tag":209,"props":37343,"children":37344},{"style":222},[37345],{"type":26,"value":36392},{"type":21,"tag":209,"props":37347,"children":37348},{"class":211,"line":480},[37349,37353,37357,37361,37365,37369,37373,37377,37381,37385,37389],{"type":21,"tag":209,"props":37350,"children":37351},{"style":216},[37352],{"type":26,"value":5925},{"type":21,"tag":209,"props":37354,"children":37355},{"style":222},[37356],{"type":26,"value":36404},{"type":21,"tag":209,"props":37358,"children":37359},{"style":216},[37360],{"type":26,"value":1432},{"type":21,"tag":209,"props":37362,"children":37363},{"style":360},[37364],{"type":26,"value":36413},{"type":21,"tag":209,"props":37366,"children":37367},{"style":222},[37368],{"type":26,"value":36418},{"type":21,"tag":209,"props":37370,"children":37371},{"style":360},[37372],{"type":26,"value":36423},{"type":21,"tag":209,"props":37374,"children":37375},{"style":222},[37376],{"type":26,"value":368},{"type":21,"tag":209,"props":37378,"children":37379},{"style":233},[37380],{"type":26,"value":36432},{"type":21,"tag":209,"props":37382,"children":37383},{"style":222},[37384],{"type":26,"value":24289},{"type":21,"tag":209,"props":37386,"children":37387},{"style":263},[37388],{"type":26,"value":3224},{"type":21,"tag":209,"props":37390,"children":37391},{"style":222},[37392],{"type":26,"value":36445},{"type":21,"tag":209,"props":37394,"children":37395},{"class":211,"line":489},[37396,37400,37404,37408,37412],{"type":21,"tag":209,"props":37397,"children":37398},{"style":222},[37399],{"type":26,"value":36453},{"type":21,"tag":209,"props":37401,"children":37402},{"style":216},[37403],{"type":26,"value":1432},{"type":21,"tag":209,"props":37405,"children":37406},{"style":222},[37407],{"type":26,"value":36462},{"type":21,"tag":209,"props":37409,"children":37410},{"style":263},[37411],{"type":26,"value":36467},{"type":21,"tag":209,"props":37413,"children":37414},{"style":222},[37415],{"type":26,"value":304},{"type":21,"tag":209,"props":37417,"children":37418},{"class":211,"line":847},[37419,37423,37427,37431,37435,37439],{"type":21,"tag":209,"props":37420,"children":37421},{"style":222},[37422],{"type":26,"value":36479},{"type":21,"tag":209,"props":37424,"children":37425},{"style":216},[37426],{"type":26,"value":1432},{"type":21,"tag":209,"props":37428,"children":37429},{"style":222},[37430],{"type":26,"value":36488},{"type":21,"tag":209,"props":37432,"children":37433},{"style":216},[37434],{"type":26,"value":36493},{"type":21,"tag":209,"props":37436,"children":37437},{"style":263},[37438],{"type":26,"value":36498},{"type":21,"tag":209,"props":37440,"children":37441},{"style":222},[37442],{"type":26,"value":304},{"type":21,"tag":209,"props":37444,"children":37445},{"class":211,"line":860},[37446,37450,37454,37458,37462],{"type":21,"tag":209,"props":37447,"children":37448},{"style":222},[37449],{"type":26,"value":36510},{"type":21,"tag":209,"props":37451,"children":37452},{"style":216},[37453],{"type":26,"value":1432},{"type":21,"tag":209,"props":37455,"children":37456},{"style":216},[37457],{"type":26,"value":4667},{"type":21,"tag":209,"props":37459,"children":37460},{"style":360},[37461],{"type":26,"value":36523},{"type":21,"tag":209,"props":37463,"children":37464},{"style":222},[37465],{"type":26,"value":36528},{"type":21,"tag":209,"props":37467,"children":37468},{"class":211,"line":877},[37469,37473,37477,37481,37485,37489,37493],{"type":21,"tag":209,"props":37470,"children":37471},{"style":222},[37472],{"type":26,"value":36536},{"type":21,"tag":209,"props":37474,"children":37475},{"style":216},[37476],{"type":26,"value":1432},{"type":21,"tag":209,"props":37478,"children":37479},{"style":216},[37480],{"type":26,"value":4667},{"type":21,"tag":209,"props":37482,"children":37483},{"style":360},[37484],{"type":26,"value":36549},{"type":21,"tag":209,"props":37486,"children":37487},{"style":222},[37488],{"type":26,"value":36554},{"type":21,"tag":209,"props":37490,"children":37491},{"style":263},[37492],{"type":26,"value":6048},{"type":21,"tag":209,"props":37494,"children":37495},{"style":222},[37496],{"type":26,"value":36563},{"type":21,"tag":209,"props":37498,"children":37499},{"class":211,"line":889},[37500,37504,37508,37512,37516,37520],{"type":21,"tag":209,"props":37501,"children":37502},{"style":222},[37503],{"type":26,"value":36571},{"type":21,"tag":209,"props":37505,"children":37506},{"style":216},[37507],{"type":26,"value":1432},{"type":21,"tag":209,"props":37509,"children":37510},{"style":222},[37511],{"type":26,"value":36488},{"type":21,"tag":209,"props":37513,"children":37514},{"style":216},[37515],{"type":26,"value":36584},{"type":21,"tag":209,"props":37517,"children":37518},{"style":263},[37519],{"type":26,"value":36589},{"type":21,"tag":209,"props":37521,"children":37522},{"style":222},[37523],{"type":26,"value":241},{"type":21,"tag":209,"props":37525,"children":37526},{"class":211,"line":902},[37527],{"type":21,"tag":209,"props":37528,"children":37529},{"emptyLinePlaceholder":248},[37530],{"type":26,"value":251},{"type":21,"tag":209,"props":37532,"children":37533},{"class":211,"line":914},[37534,37538,37542,37546,37550,37554,37558,37562,37566,37570,37574,37578,37582,37586],{"type":21,"tag":209,"props":37535,"children":37536},{"style":216},[37537],{"type":26,"value":36608},{"type":21,"tag":209,"props":37539,"children":37540},{"style":222},[37541],{"type":26,"value":368},{"type":21,"tag":209,"props":37543,"children":37544},{"style":216},[37545],{"type":26,"value":8996},{"type":21,"tag":209,"props":37547,"children":37548},{"style":222},[37549],{"type":26,"value":36621},{"type":21,"tag":209,"props":37551,"children":37552},{"style":216},[37553],{"type":26,"value":1432},{"type":21,"tag":209,"props":37555,"children":37556},{"style":263},[37557],{"type":26,"value":6048},{"type":21,"tag":209,"props":37559,"children":37560},{"style":222},[37561],{"type":26,"value":36634},{"type":21,"tag":209,"props":37563,"children":37564},{"style":216},[37565],{"type":26,"value":1432},{"type":21,"tag":209,"props":37567,"children":37568},{"style":263},[37569],{"type":26,"value":6048},{"type":21,"tag":209,"props":37571,"children":37572},{"style":222},[37573],{"type":26,"value":36647},{"type":21,"tag":209,"props":37575,"children":37576},{"style":216},[37577],{"type":26,"value":1985},{"type":21,"tag":209,"props":37579,"children":37580},{"style":222},[37581],{"type":26,"value":36656},{"type":21,"tag":209,"props":37583,"children":37584},{"style":216},[37585],{"type":26,"value":36661},{"type":21,"tag":209,"props":37587,"children":37588},{"style":222},[37589],{"type":26,"value":10112},{"type":21,"tag":209,"props":37591,"children":37592},{"class":211,"line":922},[37593],{"type":21,"tag":209,"props":37594,"children":37595},{"style":222},[37596],{"type":26,"value":7561},{"type":21,"tag":209,"props":37598,"children":37599},{"class":211,"line":2312},[37600,37604,37608,37612,37616,37620,37624,37628],{"type":21,"tag":209,"props":37601,"children":37602},{"style":222},[37603],{"type":26,"value":36680},{"type":21,"tag":209,"props":37605,"children":37606},{"style":216},[37607],{"type":26,"value":1432},{"type":21,"tag":209,"props":37609,"children":37610},{"style":222},[37611],{"type":26,"value":36462},{"type":21,"tag":209,"props":37613,"children":37614},{"style":360},[37615],{"type":26,"value":36693},{"type":21,"tag":209,"props":37617,"children":37618},{"style":222},[37619],{"type":26,"value":36698},{"type":21,"tag":209,"props":37621,"children":37622},{"style":216},[37623],{"type":26,"value":36661},{"type":21,"tag":209,"props":37625,"children":37626},{"style":222},[37627],{"type":26,"value":432},{"type":21,"tag":209,"props":37629,"children":37630},{"style":216},[37631],{"type":26,"value":36711},{"type":21,"tag":209,"props":37633,"children":37634},{"class":211,"line":2321},[37635,37639,37643,37647,37651,37655,37659,37663],{"type":21,"tag":209,"props":37636,"children":37637},{"style":222},[37638],{"type":26,"value":36719},{"type":21,"tag":209,"props":37640,"children":37641},{"style":360},[37642],{"type":26,"value":36693},{"type":21,"tag":209,"props":37644,"children":37645},{"style":222},[37646],{"type":26,"value":36698},{"type":21,"tag":209,"props":37648,"children":37649},{"style":216},[37650],{"type":26,"value":36661},{"type":21,"tag":209,"props":37652,"children":37653},{"style":222},[37654],{"type":26,"value":432},{"type":21,"tag":209,"props":37656,"children":37657},{"style":216},[37658],{"type":26,"value":36740},{"type":21,"tag":209,"props":37660,"children":37661},{"style":263},[37662],{"type":26,"value":36745},{"type":21,"tag":209,"props":37664,"children":37665},{"style":216},[37666],{"type":26,"value":36750},{"type":21,"tag":209,"props":37668,"children":37669},{"class":211,"line":2372},[37670,37674,37678,37682,37686,37690,37694,37698],{"type":21,"tag":209,"props":37671,"children":37672},{"style":222},[37673],{"type":26,"value":36719},{"type":21,"tag":209,"props":37675,"children":37676},{"style":360},[37677],{"type":26,"value":36693},{"type":21,"tag":209,"props":37679,"children":37680},{"style":222},[37681],{"type":26,"value":36698},{"type":21,"tag":209,"props":37683,"children":37684},{"style":216},[37685],{"type":26,"value":36661},{"type":21,"tag":209,"props":37687,"children":37688},{"style":222},[37689],{"type":26,"value":432},{"type":21,"tag":209,"props":37691,"children":37692},{"style":216},[37693],{"type":26,"value":36740},{"type":21,"tag":209,"props":37695,"children":37696},{"style":263},[37697],{"type":26,"value":36782},{"type":21,"tag":209,"props":37699,"children":37700},{"style":216},[37701],{"type":26,"value":36750},{"type":21,"tag":209,"props":37703,"children":37704},{"class":211,"line":2381},[37705,37709,37713,37717,37721,37725,37729,37733],{"type":21,"tag":209,"props":37706,"children":37707},{"style":222},[37708],{"type":26,"value":36719},{"type":21,"tag":209,"props":37710,"children":37711},{"style":360},[37712],{"type":26,"value":36693},{"type":21,"tag":209,"props":37714,"children":37715},{"style":222},[37716],{"type":26,"value":36698},{"type":21,"tag":209,"props":37718,"children":37719},{"style":216},[37720],{"type":26,"value":36661},{"type":21,"tag":209,"props":37722,"children":37723},{"style":222},[37724],{"type":26,"value":432},{"type":21,"tag":209,"props":37726,"children":37727},{"style":216},[37728],{"type":26,"value":36740},{"type":21,"tag":209,"props":37730,"children":37731},{"style":263},[37732],{"type":26,"value":36818},{"type":21,"tag":209,"props":37734,"children":37735},{"style":222},[37736],{"type":26,"value":241},{"type":21,"tag":209,"props":37738,"children":37739},{"class":211,"line":2389},[37740],{"type":21,"tag":209,"props":37741,"children":37742},{"style":222},[37743],{"type":26,"value":2235},{"type":21,"tag":209,"props":37745,"children":37746},{"class":211,"line":2397},[37747],{"type":21,"tag":209,"props":37748,"children":37749},{"emptyLinePlaceholder":248},[37750],{"type":26,"value":251},{"type":21,"tag":209,"props":37752,"children":37753},{"class":211,"line":2406},[37754,37758,37762,37766],{"type":21,"tag":209,"props":37755,"children":37756},{"style":216},[37757],{"type":26,"value":36844},{"type":21,"tag":209,"props":37759,"children":37760},{"style":222},[37761],{"type":26,"value":36849},{"type":21,"tag":209,"props":37763,"children":37764},{"style":216},[37765],{"type":26,"value":36854},{"type":21,"tag":209,"props":37767,"children":37768},{"style":222},[37769],{"type":26,"value":10112},{"type":21,"tag":209,"props":37771,"children":37772},{"class":211,"line":2415},[37773],{"type":21,"tag":209,"props":37774,"children":37775},{"style":222},[37776],{"type":26,"value":7561},{"type":21,"tag":209,"props":37778,"children":37779},{"class":211,"line":2424},[37780,37784,37788,37792,37796,37800,37804],{"type":21,"tag":209,"props":37781,"children":37782},{"style":222},[37783],{"type":26,"value":36873},{"type":21,"tag":209,"props":37785,"children":37786},{"style":216},[37787],{"type":26,"value":1432},{"type":21,"tag":209,"props":37789,"children":37790},{"style":222},[37791],{"type":26,"value":36462},{"type":21,"tag":209,"props":37793,"children":37794},{"style":360},[37795],{"type":26,"value":36693},{"type":21,"tag":209,"props":37797,"children":37798},{"style":222},[37799],{"type":26,"value":36698},{"type":21,"tag":209,"props":37801,"children":37802},{"style":216},[37803],{"type":26,"value":36661},{"type":21,"tag":209,"props":37805,"children":37806},{"style":222},[37807],{"type":26,"value":2608},{"type":21,"tag":209,"props":37809,"children":37810},{"class":211,"line":2433},[37811],{"type":21,"tag":209,"props":37812,"children":37813},{"style":222},[37814],{"type":26,"value":2235},{"type":21,"tag":209,"props":37816,"children":37817},{"class":211,"line":2442},[37818],{"type":21,"tag":209,"props":37819,"children":37820},{"emptyLinePlaceholder":248},[37821],{"type":26,"value":251},{"type":21,"tag":209,"props":37823,"children":37824},{"class":211,"line":2471},[37825,37829,37833,37837,37841,37845,37849,37853,37857,37861],{"type":21,"tag":209,"props":37826,"children":37827},{"style":360},[37828],{"type":26,"value":36919},{"type":21,"tag":209,"props":37830,"children":37831},{"style":222},[37832],{"type":26,"value":368},{"type":21,"tag":209,"props":37834,"children":37835},{"style":216},[37836],{"type":26,"value":21569},{"type":21,"tag":209,"props":37838,"children":37839},{"style":360},[37840],{"type":26,"value":9014},{"type":21,"tag":209,"props":37842,"children":37843},{"style":222},[37844],{"type":26,"value":36936},{"type":21,"tag":209,"props":37846,"children":37847},{"style":233},[37848],{"type":26,"value":36941},{"type":21,"tag":209,"props":37850,"children":37851},{"style":222},[37852],{"type":26,"value":36946},{"type":21,"tag":209,"props":37854,"children":37855},{"style":216},[37856],{"type":26,"value":4677},{"type":21,"tag":209,"props":37858,"children":37859},{"style":233},[37860],{"type":26,"value":36955},{"type":21,"tag":209,"props":37862,"children":37863},{"style":222},[37864],{"type":26,"value":36960},{"type":21,"tag":209,"props":37866,"children":37867},{"class":211,"line":2480},[37868],{"type":21,"tag":209,"props":37869,"children":37870},{"style":222},[37871],{"type":26,"value":331},{"type":21,"tag":209,"props":37873,"children":37874},{"class":211,"line":2489},[37875],{"type":21,"tag":209,"props":37876,"children":37877},{"emptyLinePlaceholder":248},[37878],{"type":26,"value":251},{"type":21,"tag":209,"props":37880,"children":37881},{"class":211,"line":2516},[37882,37886,37890,37894,37898,37902,37906,37910,37914,37918],{"type":21,"tag":209,"props":37883,"children":37884},{"style":216},[37885],{"type":26,"value":10853},{"type":21,"tag":209,"props":37887,"children":37888},{"style":222},[37889],{"type":26,"value":36986},{"type":21,"tag":209,"props":37891,"children":37892},{"style":216},[37893],{"type":26,"value":15578},{"type":21,"tag":209,"props":37895,"children":37896},{"style":222},[37897],{"type":26,"value":36995},{"type":21,"tag":209,"props":37899,"children":37900},{"style":216},[37901],{"type":26,"value":15578},{"type":21,"tag":209,"props":37903,"children":37904},{"style":216},[37905],{"type":26,"value":17157},{"type":21,"tag":209,"props":37907,"children":37908},{"style":263},[37909],{"type":26,"value":8957},{"type":21,"tag":209,"props":37911,"children":37912},{"style":222},[37913],{"type":26,"value":378},{"type":21,"tag":209,"props":37915,"children":37916},{"style":263},[37917],{"type":26,"value":37016},{"type":21,"tag":209,"props":37919,"children":37920},{"style":222},[37921],{"type":26,"value":37021},{"type":21,"tag":209,"props":37923,"children":37924},{"class":211,"line":2525},[37925],{"type":21,"tag":209,"props":37926,"children":37927},{"style":222},[37928],{"type":26,"value":37029},{"type":21,"tag":209,"props":37930,"children":37931},{"class":211,"line":2533},[37932,37936,37940,37944,37948,37952,37956,37960,37964],{"type":21,"tag":209,"props":37933,"children":37934},{"style":222},[37935],{"type":26,"value":37037},{"type":21,"tag":209,"props":37937,"children":37938},{"style":360},[37939],{"type":26,"value":37042},{"type":21,"tag":209,"props":37941,"children":37942},{"style":222},[37943],{"type":26,"value":368},{"type":21,"tag":209,"props":37945,"children":37946},{"style":263},[37947],{"type":26,"value":8957},{"type":21,"tag":209,"props":37949,"children":37950},{"style":222},[37951],{"type":26,"value":378},{"type":21,"tag":209,"props":37953,"children":37954},{"style":263},[37955],{"type":26,"value":37016},{"type":21,"tag":209,"props":37957,"children":37958},{"style":222},[37959],{"type":26,"value":408},{"type":21,"tag":209,"props":37961,"children":37962},{"style":233},[37963],{"type":26,"value":37067},{"type":21,"tag":209,"props":37965,"children":37966},{"style":222},[37967],{"type":26,"value":304},{"type":21,"tag":209,"props":37969,"children":37970},{"class":211,"line":2542},[37971],{"type":21,"tag":209,"props":37972,"children":37973},{"style":222},[37974],{"type":26,"value":7561},{"type":21,"tag":209,"props":37976,"children":37977},{"class":211,"line":2550},[37978],{"type":21,"tag":209,"props":37979,"children":37980},{"style":222},[37981],{"type":26,"value":37086},{"type":21,"tag":209,"props":37983,"children":37984},{"class":211,"line":2564},[37985],{"type":21,"tag":209,"props":37986,"children":37987},{"style":222},[37988],{"type":26,"value":5114},{"type":21,"tag":209,"props":37990,"children":37991},{"class":211,"line":2611},[37992],{"type":21,"tag":209,"props":37993,"children":37994},{"style":222},[37995],{"type":26,"value":331},{"type":21,"tag":209,"props":37997,"children":37998},{"class":211,"line":2619},[37999],{"type":21,"tag":209,"props":38000,"children":38001},{"style":222},[38002],{"type":26,"value":37108},{"type":21,"tag":22,"props":38004,"children":38005},{},[38006,38008,38015,38017,38024],{"type":26,"value":38007},"Okay, but now we're golden, right? But what if we have to support iOS? Oh my, there is a ",{"type":21,"tag":29,"props":38009,"children":38012},{"href":38010,"rel":38011},"https://www.google.ca/search?output=search&sclient=psy-ab&q=ios%20safari%20megapixel%20bug&=&=&oq=&gs_l=&pbx=1",[93],[38013],{"type":26,"value":38014},"world",{"type":26,"value":38016}," of ",{"type":21,"tag":29,"props":38018,"children":38021},{"href":38019,"rel":38020},"http://stackoverflow.com/questions/15542045/mobile-safari-downsamples-large-images-how-to-retain",[93],[38022],{"type":26,"value":38023},"hurt",{"type":26,"value":38025}," awaiting you. You'll need to handle subsampling and vertical squashing on megapixel images, exif orientation to correct the orientation of the image, and limitations on the size/resolution of the canvas.",{"type":21,"tag":22,"props":38027,"children":38028},{},[38029],{"type":26,"value":38030},"Long story short: what works in one place is not guaranteed to work in another - at least, not without significant effort in some cases. \"Write Once, Run Anywhere\" is still just a pleasant dream.",{"type":21,"tag":3549,"props":38032,"children":38034},{"id":38033},"so-what-does-this-mean-to-me",[38035],{"type":26,"value":38036},"So what does this mean to me?",{"type":21,"tag":22,"props":38038,"children":38039},{},[38040],{"type":26,"value":38041},"The net effect is that, once the cost of testing and supporting multiple browser platforms is considered, the benefits of a shared codebase are somewhat reduced relative to native apps.",{"type":21,"tag":22,"props":38043,"children":38044},{},[38045],{"type":26,"value":38046},"In all likelihood, it will still be faster and less expensive to create a webapp compared to a native application equivalent for each platform to be supported, assuming that platforms > 1, but it should not be expected that the difference will be drastic, especially if support of cutting-edge features is desired.",{"type":21,"tag":22,"props":38048,"children":38049},{},[38050],{"type":26,"value":38051},"This is something that needs to be made clear to your client up-front - put simply, making a webapp is not easier than making a native application. There are advantages, but that isn't one of them.",{"type":21,"tag":3490,"props":38053,"children":38054},{},[38055],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":38057},[38058,38059,38060,38061],{"id":35985,"depth":244,"text":35988},{"id":36027,"depth":244,"text":36030},{"id":36076,"depth":244,"text":36079},{"id":38033,"depth":244,"text":38036},"content:ckeefer:2015-1:writeonce.md","ckeefer/2015-1/writeonce.md","ckeefer/2015-1/writeonce",{"user":3518,"name":3519},{"_path":38067,"_dir":38068,"_draft":7,"_partial":7,"_locale":8,"title":38069,"description":38070,"publishDate":38071,"tags":38072,"excerpt":38070,"body":38073,"_type":3511,"_id":39196,"_source":3513,"_file":39197,"_stem":39198,"_extension":3516,"author":39199},"/ckeefer/2014-8/behold-views","2014-8","Behold! (JavaScript Views)","JavaScript has the propensity to be very untidy - if you let it, it will sprawl all over the place. Hundreds of global variables scattered across dozens of files, messy half-measures towards object-orientation, mixed in seemingly at random with ungrouped functions - anyone who's had a client bring them a failed project from some other development team knows just how bad it can get.","2015-01-07",[12],{"type":18,"children":38074,"toc":39188},[38075,38079,38084,38089,38094,38099,38121,38133,38138,38144,38191,38196,38216,38228,38233,38238,38243,38248,38266,38296,38301,38329,38334,38339,38358,38370,38375,38380,38486,38499,39155,39159,39171,39184],{"type":21,"tag":22,"props":38076,"children":38077},{},[38078],{"type":26,"value":38070},{"type":21,"tag":22,"props":38080,"children":38081},{},[38082],{"type":26,"value":38083},"JavaScript also has the potential to be neat and tidy, and keep private variables and methods truly private - if you know how. Closures and an understanding of prototypical inheritance are the secrets, of course - but these are general purpose tools. For more specific scenarios - say, attaching logic to an existing or dynamically created view - tidy encapsulation is just the beginning of the suite of features we covet.",{"type":21,"tag":22,"props":38085,"children":38086},{},[38087],{"type":26,"value":38088},"We'd like to be able to declare and bind to page elements all in one spot, so we never duplicate jQuery selectors unnecessarily, it's clear what we've bound when looking at the view, and we can easily re-use those bindings through a variety of functions. Heck, while we're at it, we'd like to be able to bind events to these elements using the same mapping we've just created (maybe with some nice syntactical sugar to simplify statements), and assign arbitrary functions within our view to handle the events.",{"type":21,"tag":22,"props":38090,"children":38091},{},[38092],{"type":26,"value":38093},"All of this should be neatly encapsulated within a JavaScript'class', and instantiable when and where we desire; and as long as we're dreaming, how about a nice, modular system that keeps private variables and methods from being exposed to other classes, automatically offers us safe, localized references to jQuery, underscore or whatever other libraries we're using, and offers us the ability to initialize the module under conditions of our choosing.",{"type":21,"tag":22,"props":38095,"children":38096},{},[38097],{"type":26,"value":38098},"Pinch yourself, it's not a dream. After a few projects working with Backbone and Marionette, I was loath to do without those tidy and functional views and all the features above (and more) on future projects, even those that aren't a good fit for Backbone. Thus, Behold! A view framework was written.",{"type":21,"tag":22,"props":38100,"children":38101},{},[38102,38104,38111,38112,38119],{"type":26,"value":38103},"Behold is for those who like the tidy encapsulation and functionality that frameworks like ",{"type":21,"tag":29,"props":38105,"children":38108},{"href":38106,"rel":38107},"https://github.com/chaplinjs/chaplin",[93],[38109],{"type":26,"value":38110},"Chaplin",{"type":26,"value":7274},{"type":21,"tag":29,"props":38113,"children":38116},{"href":38114,"rel":38115},"http://marionettejs.com/",[93],[38117],{"type":26,"value":38118},"Marionette",{"type":26,"value":38120}," provide for js views, but don't need everything that Backbone offers, and can't justify the extra weight of it.",{"type":21,"tag":22,"props":38122,"children":38123},{},[38124,38126,38132],{"type":26,"value":38125},"Sold on the concept already? Go take a look at the ",{"type":21,"tag":29,"props":38127,"children":38130},{"href":38128,"rel":38129},"https://github.com/SaneMethod/Behold",[93],[38131],{"type":26,"value":32918},{"type":26,"value":378},{"type":21,"tag":22,"props":38134,"children":38135},{},[38136],{"type":26,"value":38137},"Need more convincing? Carry on, then.",{"type":21,"tag":3549,"props":38139,"children":38141},{"id":38140},"contents",[38142],{"type":26,"value":38143},"Contents",{"type":21,"tag":3677,"props":38145,"children":38146},{},[38147,38156,38165,38174,38183],{"type":21,"tag":3681,"props":38148,"children":38149},{},[38150],{"type":21,"tag":29,"props":38151,"children":38153},{"href":38152},"#why-views",[38154],{"type":26,"value":38155},"Why Views?",{"type":21,"tag":3681,"props":38157,"children":38158},{},[38159],{"type":21,"tag":29,"props":38160,"children":38162},{"href":38161},"#why-behold",[38163],{"type":26,"value":38164},"Why Behold?",{"type":21,"tag":3681,"props":38166,"children":38167},{},[38168],{"type":21,"tag":29,"props":38169,"children":38171},{"href":38170},"#dependencies",[38172],{"type":26,"value":38173},"Dependencies",{"type":21,"tag":3681,"props":38175,"children":38176},{},[38177],{"type":21,"tag":29,"props":38178,"children":38180},{"href":38179},"#usage-example",[38181],{"type":26,"value":38182},"Usage Example",{"type":21,"tag":3681,"props":38184,"children":38185},{},[38186],{"type":21,"tag":29,"props":38187,"children":38189},{"href":38188},"#more-details",[38190],{"type":26,"value":3886},{"type":21,"tag":3549,"props":38192,"children":38194},{"id":38193},"why-views",[38195],{"type":26,"value":38155},{"type":21,"tag":22,"props":38197,"children":38198},{},[38199,38201,38207,38209,38214],{"type":26,"value":38200},"What are js views? In a nutshell, the intent of a js view is to provide a neat encapsulation for all the ui binding, event handling and functionality associated with a given page, or set of pages. Novice JavaScriptoften involves terrible spaghetti code, spread throuhgout ",{"type":21,"tag":63,"props":38202,"children":38204},{"className":38203},[],[38205],{"type":26,"value":38206},"onevent",{"type":26,"value":38208}," handlers in the html, bunches of ",{"type":21,"tag":63,"props":38210,"children":38212},{"className":38211},[],[38213],{"type":26,"value":2059},{"type":26,"value":38215}," tags littered randomly through the markup, and an ugly mess of global variables and functions sitting in a single master file.",{"type":21,"tag":22,"props":38217,"children":38218},{},[38219,38221,38226],{"type":26,"value":38220},"With Views enabled by a library like Behold, you instead have nicely encapsulated modules that don't leak private variables or declare any new global variables (unless you really want to, or forget to prepend ",{"type":21,"tag":63,"props":38222,"children":38224},{"className":38223},[],[38225],{"type":26,"value":8996},{"type":26,"value":38227}," to your variable declaration, since no framework can save you from sloppy coding).",{"type":21,"tag":22,"props":38229,"children":38230},{},[38231],{"type":26,"value":38232},"With Views, all of your ui binding is scoped to a root element, keeping selectors performant; all of your ui binding can be declared in a single object, keeping the bindings easy to find and use throughout the code, reducing wasteful rebinding across functions; all of your event binding can take advantage of existing ui binding, is also declared in a single, easy to find object, and keeps its functions enclosed within the view, eliminating the chance of overriding like named functions by declaring them globally, or conflicting with other libraries you've added.",{"type":21,"tag":22,"props":38234,"children":38235},{},[38236],{"type":26,"value":38237},"In other words, Views can be the answer to keeping your site's Javascript tidy and maintainable, whether you have a few pages that just need some animation added, a js-based browser plugin, or a complex webapp.",{"type":21,"tag":3549,"props":38239,"children":38241},{"id":38240},"why-behold",[38242],{"type":26,"value":38164},{"type":21,"tag":22,"props":38244,"children":38245},{},[38246],{"type":26,"value":38247},"If you need:",{"type":21,"tag":3677,"props":38249,"children":38250},{},[38251,38256,38261],{"type":21,"tag":3681,"props":38252,"children":38253},{},[38254],{"type":26,"value":38255},"routing,",{"type":21,"tag":3681,"props":38257,"children":38258},{},[38259],{"type":26,"value":38260},"Collections,",{"type":21,"tag":3681,"props":38262,"children":38263},{},[38264],{"type":26,"value":38265},"client-side models of db tables,",{"type":21,"tag":22,"props":38267,"children":38268},{},[38269,38271,38278,38280,38287,38288,38295],{"type":26,"value":38270},"you should check out a full MVC framework like ",{"type":21,"tag":29,"props":38272,"children":38275},{"href":38273,"rel":38274},"http://backbonejs.org/",[93],[38276],{"type":26,"value":38277},"Backbone",{"type":26,"value":38279}," and one of the many frameworks building on it, such as the two mentioned above, or similar frameworks like ",{"type":21,"tag":29,"props":38281,"children":38284},{"href":38282,"rel":38283},"https://angularjs.org/",[93],[38285],{"type":26,"value":38286},"Angular",{"type":26,"value":1922},{"type":21,"tag":29,"props":38289,"children":38292},{"href":38290,"rel":38291},"http://emberjs.com/",[93],[38293],{"type":26,"value":38294},"Ember",{"type":26,"value":378},{"type":21,"tag":22,"props":38297,"children":38298},{},[38299],{"type":26,"value":38300},"If, on the other hand, you just need:",{"type":21,"tag":3677,"props":38302,"children":38303},{},[38304,38309,38314,38319,38324],{"type":21,"tag":3681,"props":38305,"children":38306},{},[38307],{"type":26,"value":38308},"Modular encapsulation that keeps global objects to a minimum, and keeps private variables really private;",{"type":21,"tag":3681,"props":38310,"children":38311},{},[38312],{"type":26,"value":38313},"Easy, organized declaration of UI elements to bind to, with automatic binding and all the niceties that jQuery has to offer immediately available;",{"type":21,"tag":3681,"props":38315,"children":38316},{},[38317],{"type":26,"value":38318},"Similarly easy and organized event binding, which are automatically bound upon view initialization, can be bound and unbound as a unit, and are compatible with the jQuery style bindings you're used to (including supporting event name-spacing);",{"type":21,"tag":3681,"props":38320,"children":38321},{},[38322],{"type":26,"value":38323},"Clear organization and encapsulation of functions being bound to, or that operate on a given view;",{"type":21,"tag":3681,"props":38325,"children":38326},{},[38327],{"type":26,"value":38328},"and similar helpful functionality (see below for more details)",{"type":21,"tag":22,"props":38330,"children":38331},{},[38332],{"type":26,"value":38333},"then Behold is for you.",{"type":21,"tag":3549,"props":38335,"children":38337},{"id":38336},"dependencies",[38338],{"type":26,"value":38173},{"type":21,"tag":22,"props":38340,"children":38341},{},[38342,38348,38350,38357],{"type":21,"tag":29,"props":38343,"children":38346},{"href":38344,"rel":38345},"https://jquery.com",[93],[38347],{"type":26,"value":17958},{"type":26,"value":38349},", or API-compatible replacement library, such as ",{"type":21,"tag":29,"props":38351,"children":38354},{"href":38352,"rel":38353},"http://zeptojs.com/",[93],[38355],{"type":26,"value":38356},"Zepto",{"type":26,"value":378},{"type":21,"tag":22,"props":38359,"children":38360},{},[38361,38368],{"type":21,"tag":29,"props":38362,"children":38365},{"href":38363,"rel":38364},"http://underscorejs.org/",[93],[38366],{"type":26,"value":38367},"Underscore",{"type":26,"value":38369}," - Optional - if not supplied, Behold includes a stripped down, native-reliant re-implementation of some of underscore's functionality. See below for more details.",{"type":21,"tag":3549,"props":38371,"children":38373},{"id":38372},"usage-example",[38374],{"type":26,"value":38182},{"type":21,"tag":22,"props":38376,"children":38377},{},[38378],{"type":26,"value":38379},"In your JavaScriptentry point of execution:",{"type":21,"tag":200,"props":38381,"children":38383},{"className":9044,"code":38382,"language":9046,"meta":8,"style":8},"var gApp = new Behold.Application();\n\n$(document).ready(function() {\n    gApp.start(); // Initializes all registered modules\n});\n",[38384],{"type":21,"tag":63,"props":38385,"children":38386},{"__ignoreMap":8},[38387,38421,38428,38457,38479],{"type":21,"tag":209,"props":38388,"children":38389},{"class":211,"line":212},[38390,38394,38399,38403,38407,38412,38417],{"type":21,"tag":209,"props":38391,"children":38392},{"style":216},[38393],{"type":26,"value":8996},{"type":21,"tag":209,"props":38395,"children":38396},{"style":222},[38397],{"type":26,"value":38398}," gApp ",{"type":21,"tag":209,"props":38400,"children":38401},{"style":216},[38402],{"type":26,"value":1432},{"type":21,"tag":209,"props":38404,"children":38405},{"style":216},[38406],{"type":26,"value":4667},{"type":21,"tag":209,"props":38408,"children":38409},{"style":222},[38410],{"type":26,"value":38411}," Behold.",{"type":21,"tag":209,"props":38413,"children":38414},{"style":360},[38415],{"type":26,"value":38416},"Application",{"type":21,"tag":209,"props":38418,"children":38419},{"style":222},[38420],{"type":26,"value":4842},{"type":21,"tag":209,"props":38422,"children":38423},{"class":211,"line":244},[38424],{"type":21,"tag":209,"props":38425,"children":38426},{"emptyLinePlaceholder":248},[38427],{"type":26,"value":251},{"type":21,"tag":209,"props":38429,"children":38430},{"class":211,"line":254},[38431,38435,38440,38445,38449,38453],{"type":21,"tag":209,"props":38432,"children":38433},{"style":360},[38434],{"type":26,"value":10250},{"type":21,"tag":209,"props":38436,"children":38437},{"style":222},[38438],{"type":26,"value":38439},"(document).",{"type":21,"tag":209,"props":38441,"children":38442},{"style":360},[38443],{"type":26,"value":38444},"ready",{"type":21,"tag":209,"props":38446,"children":38447},{"style":222},[38448],{"type":26,"value":368},{"type":21,"tag":209,"props":38450,"children":38451},{"style":216},[38452],{"type":26,"value":5370},{"type":21,"tag":209,"props":38454,"children":38455},{"style":222},[38456],{"type":26,"value":5375},{"type":21,"tag":209,"props":38458,"children":38459},{"class":211,"line":279},[38460,38465,38469,38474],{"type":21,"tag":209,"props":38461,"children":38462},{"style":222},[38463],{"type":26,"value":38464},"    gApp.",{"type":21,"tag":209,"props":38466,"children":38467},{"style":360},[38468],{"type":26,"value":5082},{"type":21,"tag":209,"props":38470,"children":38471},{"style":222},[38472],{"type":26,"value":38473},"(); ",{"type":21,"tag":209,"props":38475,"children":38476},{"style":448},[38477],{"type":26,"value":38478},"// Initializes all registered modules\n",{"type":21,"tag":209,"props":38480,"children":38481},{"class":211,"line":288},[38482],{"type":21,"tag":209,"props":38483,"children":38484},{"style":222},[38485],{"type":26,"value":469},{"type":21,"tag":22,"props":38487,"children":38488},{},[38489,38491,38497],{"type":26,"value":38490},"Then, in any other JavaScriptfile included in the page (you can include it before or after your entry point, so long as it will be loaded before whatever criteria you've selected for executing ",{"type":21,"tag":63,"props":38492,"children":38494},{"className":38493},[],[38495],{"type":26,"value":38496},"start()",{"type":26,"value":38498}," on your application object):",{"type":21,"tag":200,"props":38500,"children":38502},{"className":9044,"code":38501,"language":9046,"meta":8,"style":8},"/**\n * Module constructor functions are passed four arguments by default.\n * self = A reference to the module.\n * app = A reference to the application object that the module has been registered on.\n * $ = A reference to the jQuery library.\n * _ = A reference to the underscore library, or our fill in if underscore is not present and passed in.\n * Additional parameters can be fed into the constructor function by adding them, comma separated, after the\n * constructor function (see below).\n */\ngApp.module(\"moduleName\", function(self, app, $, _) {\n    // Variables declared with var are private to this closure.\n    // Convention is to preface the variable name with an underscore to visually indicate this.\n    var _Header = Behold.extend({ // _Header is now a constructor for a new Behold View.\n            el: \"#header\", // Root element\n            ui: { // ui bindings\n                // the key 'fbLogin' will automatically be bound to the element with the id #fbHeaderLogin, found\n                // somewhere beneath the root element #header\n                // Any valid jQuery selector can be used\n                fbLogin: \"#fbHeaderLogin\",\n                gpLogin: \"#gpHeaderLogin\"\n            },\n            events: { // event bindings\n                // A click event will automatically be bound to the element with the key 'fbLogin' within the ui\n                // object, as seen above. When this event fires, the 'onClick' handler within this view will be triggered.\n                \"click @ui.fbLogin\": \"onClick\"\n            },\n            /**\n             * The initialize function will be called when this view is instantiated, and is the perfect place to put\n             * code that should be run at that time, like bindings that can't live in the events object for whatever\n             * reason, or function calls to make first-run changes.\n             */\n            initialize: function() {},\n            /**\n             * This is the event handler that we bound to in the events object, above. Notice it takes one parameter,\n             * event, which is the jQuery Event, as per usual handler behaviour.\n             */\n            onClick: function(event) {}\n        }),\n        _header; // We declare another local variable for the instantiated view.\n\n    /**\n     * Initialize this module. This function will be called automatically by Behold.Application.start().\n     * In this example, if we detect that the header element is present, we instantiate the Header view.\n     */\n    self.initialize = function() {\n        if ($(\"#header\").length) {\n            _header = new _Header({} /* We can pass in options in this object, that will be available via this.options in the view */ );\n        }\n    };\n    // Here we could add a comma separated series of variables to pass into the module constructor function, after the\n    // functions closing curly bracket, should we wish to.\n});\n",[38503],{"type":21,"tag":63,"props":38504,"children":38505},{"__ignoreMap":8},[38506,38513,38521,38529,38537,38545,38553,38561,38569,38576,38644,38652,38660,38695,38717,38730,38738,38746,38754,38771,38784,38792,38805,38813,38821,38838,38845,38853,38861,38869,38877,38885,38906,38913,38921,38929,38936,38965,38973,38986,38993,39000,39008,39016,39023,39047,39082,39118,39125,39132,39140,39148],{"type":21,"tag":209,"props":38507,"children":38508},{"class":211,"line":212},[38509],{"type":21,"tag":209,"props":38510,"children":38511},{"style":448},[38512],{"type":26,"value":731},{"type":21,"tag":209,"props":38514,"children":38515},{"class":211,"line":244},[38516],{"type":21,"tag":209,"props":38517,"children":38518},{"style":448},[38519],{"type":26,"value":38520}," * Module constructor functions are passed four arguments by default.\n",{"type":21,"tag":209,"props":38522,"children":38523},{"class":211,"line":254},[38524],{"type":21,"tag":209,"props":38525,"children":38526},{"style":448},[38527],{"type":26,"value":38528}," * self = A reference to the module.\n",{"type":21,"tag":209,"props":38530,"children":38531},{"class":211,"line":279},[38532],{"type":21,"tag":209,"props":38533,"children":38534},{"style":448},[38535],{"type":26,"value":38536}," * app = A reference to the application object that the module has been registered on.\n",{"type":21,"tag":209,"props":38538,"children":38539},{"class":211,"line":288},[38540],{"type":21,"tag":209,"props":38541,"children":38542},{"style":448},[38543],{"type":26,"value":38544}," * $ = A reference to the jQuery library.\n",{"type":21,"tag":209,"props":38546,"children":38547},{"class":211,"line":307},[38548],{"type":21,"tag":209,"props":38549,"children":38550},{"style":448},[38551],{"type":26,"value":38552}," * _ = A reference to the underscore library, or our fill in if underscore is not present and passed in.\n",{"type":21,"tag":209,"props":38554,"children":38555},{"class":211,"line":325},[38556],{"type":21,"tag":209,"props":38557,"children":38558},{"style":448},[38559],{"type":26,"value":38560}," * Additional parameters can be fed into the constructor function by adding them, comma separated, after the\n",{"type":21,"tag":209,"props":38562,"children":38563},{"class":211,"line":334},[38564],{"type":21,"tag":209,"props":38565,"children":38566},{"style":448},[38567],{"type":26,"value":38568}," * constructor function (see below).\n",{"type":21,"tag":209,"props":38570,"children":38571},{"class":211,"line":343},[38572],{"type":21,"tag":209,"props":38573,"children":38574},{"style":448},[38575],{"type":26,"value":755},{"type":21,"tag":209,"props":38577,"children":38578},{"class":211,"line":351},[38579,38584,38589,38593,38598,38602,38606,38610,38615,38619,38623,38627,38631,38635,38640],{"type":21,"tag":209,"props":38580,"children":38581},{"style":222},[38582],{"type":26,"value":38583},"gApp.",{"type":21,"tag":209,"props":38585,"children":38586},{"style":360},[38587],{"type":26,"value":38588},"module",{"type":21,"tag":209,"props":38590,"children":38591},{"style":222},[38592],{"type":26,"value":368},{"type":21,"tag":209,"props":38594,"children":38595},{"style":233},[38596],{"type":26,"value":38597},"\"moduleName\"",{"type":21,"tag":209,"props":38599,"children":38600},{"style":222},[38601],{"type":26,"value":408},{"type":21,"tag":209,"props":38603,"children":38604},{"style":216},[38605],{"type":26,"value":5370},{"type":21,"tag":209,"props":38607,"children":38608},{"style":222},[38609],{"type":26,"value":368},{"type":21,"tag":209,"props":38611,"children":38612},{"style":400},[38613],{"type":26,"value":38614},"self",{"type":21,"tag":209,"props":38616,"children":38617},{"style":222},[38618],{"type":26,"value":408},{"type":21,"tag":209,"props":38620,"children":38621},{"style":400},[38622],{"type":26,"value":34249},{"type":21,"tag":209,"props":38624,"children":38625},{"style":222},[38626],{"type":26,"value":408},{"type":21,"tag":209,"props":38628,"children":38629},{"style":400},[38630],{"type":26,"value":10250},{"type":21,"tag":209,"props":38632,"children":38633},{"style":222},[38634],{"type":26,"value":408},{"type":21,"tag":209,"props":38636,"children":38637},{"style":400},[38638],{"type":26,"value":38639},"_",{"type":21,"tag":209,"props":38641,"children":38642},{"style":222},[38643],{"type":26,"value":4786},{"type":21,"tag":209,"props":38645,"children":38646},{"class":211,"line":444},[38647],{"type":21,"tag":209,"props":38648,"children":38649},{"style":448},[38650],{"type":26,"value":38651},"    // Variables declared with var are private to this closure.\n",{"type":21,"tag":209,"props":38653,"children":38654},{"class":211,"line":454},[38655],{"type":21,"tag":209,"props":38656,"children":38657},{"style":448},[38658],{"type":26,"value":38659},"    // Convention is to preface the variable name with an underscore to visually indicate this.\n",{"type":21,"tag":209,"props":38661,"children":38662},{"class":211,"line":463},[38663,38667,38672,38676,38680,38685,38690],{"type":21,"tag":209,"props":38664,"children":38665},{"style":216},[38666],{"type":26,"value":10405},{"type":21,"tag":209,"props":38668,"children":38669},{"style":222},[38670],{"type":26,"value":38671}," _Header ",{"type":21,"tag":209,"props":38673,"children":38674},{"style":216},[38675],{"type":26,"value":1432},{"type":21,"tag":209,"props":38677,"children":38678},{"style":222},[38679],{"type":26,"value":38411},{"type":21,"tag":209,"props":38681,"children":38682},{"style":360},[38683],{"type":26,"value":38684},"extend",{"type":21,"tag":209,"props":38686,"children":38687},{"style":222},[38688],{"type":26,"value":38689},"({ ",{"type":21,"tag":209,"props":38691,"children":38692},{"style":448},[38693],{"type":26,"value":38694},"// _Header is now a constructor for a new Behold View.\n",{"type":21,"tag":209,"props":38696,"children":38697},{"class":211,"line":472},[38698,38703,38708,38712],{"type":21,"tag":209,"props":38699,"children":38700},{"style":222},[38701],{"type":26,"value":38702},"            el: ",{"type":21,"tag":209,"props":38704,"children":38705},{"style":233},[38706],{"type":26,"value":38707},"\"#header\"",{"type":21,"tag":209,"props":38709,"children":38710},{"style":222},[38711],{"type":26,"value":408},{"type":21,"tag":209,"props":38713,"children":38714},{"style":448},[38715],{"type":26,"value":38716},"// Root element\n",{"type":21,"tag":209,"props":38718,"children":38719},{"class":211,"line":480},[38720,38725],{"type":21,"tag":209,"props":38721,"children":38722},{"style":222},[38723],{"type":26,"value":38724},"            ui: { ",{"type":21,"tag":209,"props":38726,"children":38727},{"style":448},[38728],{"type":26,"value":38729},"// ui bindings\n",{"type":21,"tag":209,"props":38731,"children":38732},{"class":211,"line":489},[38733],{"type":21,"tag":209,"props":38734,"children":38735},{"style":448},[38736],{"type":26,"value":38737},"                // the key 'fbLogin' will automatically be bound to the element with the id #fbHeaderLogin, found\n",{"type":21,"tag":209,"props":38739,"children":38740},{"class":211,"line":847},[38741],{"type":21,"tag":209,"props":38742,"children":38743},{"style":448},[38744],{"type":26,"value":38745},"                // somewhere beneath the root element #header\n",{"type":21,"tag":209,"props":38747,"children":38748},{"class":211,"line":860},[38749],{"type":21,"tag":209,"props":38750,"children":38751},{"style":448},[38752],{"type":26,"value":38753},"                // Any valid jQuery selector can be used\n",{"type":21,"tag":209,"props":38755,"children":38756},{"class":211,"line":877},[38757,38762,38767],{"type":21,"tag":209,"props":38758,"children":38759},{"style":222},[38760],{"type":26,"value":38761},"                fbLogin: ",{"type":21,"tag":209,"props":38763,"children":38764},{"style":233},[38765],{"type":26,"value":38766},"\"#fbHeaderLogin\"",{"type":21,"tag":209,"props":38768,"children":38769},{"style":222},[38770],{"type":26,"value":304},{"type":21,"tag":209,"props":38772,"children":38773},{"class":211,"line":889},[38774,38779],{"type":21,"tag":209,"props":38775,"children":38776},{"style":222},[38777],{"type":26,"value":38778},"                gpLogin: ",{"type":21,"tag":209,"props":38780,"children":38781},{"style":233},[38782],{"type":26,"value":38783},"\"#gpHeaderLogin\"\n",{"type":21,"tag":209,"props":38785,"children":38786},{"class":211,"line":902},[38787],{"type":21,"tag":209,"props":38788,"children":38789},{"style":222},[38790],{"type":26,"value":38791},"            },\n",{"type":21,"tag":209,"props":38793,"children":38794},{"class":211,"line":914},[38795,38800],{"type":21,"tag":209,"props":38796,"children":38797},{"style":222},[38798],{"type":26,"value":38799},"            events: { ",{"type":21,"tag":209,"props":38801,"children":38802},{"style":448},[38803],{"type":26,"value":38804},"// event bindings\n",{"type":21,"tag":209,"props":38806,"children":38807},{"class":211,"line":922},[38808],{"type":21,"tag":209,"props":38809,"children":38810},{"style":448},[38811],{"type":26,"value":38812},"                // A click event will automatically be bound to the element with the key 'fbLogin' within the ui\n",{"type":21,"tag":209,"props":38814,"children":38815},{"class":211,"line":2312},[38816],{"type":21,"tag":209,"props":38817,"children":38818},{"style":448},[38819],{"type":26,"value":38820},"                // object, as seen above. When this event fires, the 'onClick' handler within this view will be triggered.\n",{"type":21,"tag":209,"props":38822,"children":38823},{"class":211,"line":2321},[38824,38829,38833],{"type":21,"tag":209,"props":38825,"children":38826},{"style":233},[38827],{"type":26,"value":38828},"                \"click @ui.fbLogin\"",{"type":21,"tag":209,"props":38830,"children":38831},{"style":222},[38832],{"type":26,"value":7427},{"type":21,"tag":209,"props":38834,"children":38835},{"style":233},[38836],{"type":26,"value":38837},"\"onClick\"\n",{"type":21,"tag":209,"props":38839,"children":38840},{"class":211,"line":2372},[38841],{"type":21,"tag":209,"props":38842,"children":38843},{"style":222},[38844],{"type":26,"value":38791},{"type":21,"tag":209,"props":38846,"children":38847},{"class":211,"line":2381},[38848],{"type":21,"tag":209,"props":38849,"children":38850},{"style":448},[38851],{"type":26,"value":38852},"            /**\n",{"type":21,"tag":209,"props":38854,"children":38855},{"class":211,"line":2389},[38856],{"type":21,"tag":209,"props":38857,"children":38858},{"style":448},[38859],{"type":26,"value":38860},"             * The initialize function will be called when this view is instantiated, and is the perfect place to put\n",{"type":21,"tag":209,"props":38862,"children":38863},{"class":211,"line":2397},[38864],{"type":21,"tag":209,"props":38865,"children":38866},{"style":448},[38867],{"type":26,"value":38868},"             * code that should be run at that time, like bindings that can't live in the events object for whatever\n",{"type":21,"tag":209,"props":38870,"children":38871},{"class":211,"line":2406},[38872],{"type":21,"tag":209,"props":38873,"children":38874},{"style":448},[38875],{"type":26,"value":38876},"             * reason, or function calls to make first-run changes.\n",{"type":21,"tag":209,"props":38878,"children":38879},{"class":211,"line":2415},[38880],{"type":21,"tag":209,"props":38881,"children":38882},{"style":448},[38883],{"type":26,"value":38884},"             */\n",{"type":21,"tag":209,"props":38886,"children":38887},{"class":211,"line":2424},[38888,38893,38897,38901],{"type":21,"tag":209,"props":38889,"children":38890},{"style":360},[38891],{"type":26,"value":38892},"            initialize",{"type":21,"tag":209,"props":38894,"children":38895},{"style":222},[38896],{"type":26,"value":7427},{"type":21,"tag":209,"props":38898,"children":38899},{"style":216},[38900],{"type":26,"value":5370},{"type":21,"tag":209,"props":38902,"children":38903},{"style":222},[38904],{"type":26,"value":38905},"() {},\n",{"type":21,"tag":209,"props":38907,"children":38908},{"class":211,"line":2433},[38909],{"type":21,"tag":209,"props":38910,"children":38911},{"style":448},[38912],{"type":26,"value":38852},{"type":21,"tag":209,"props":38914,"children":38915},{"class":211,"line":2442},[38916],{"type":21,"tag":209,"props":38917,"children":38918},{"style":448},[38919],{"type":26,"value":38920},"             * This is the event handler that we bound to in the events object, above. Notice it takes one parameter,\n",{"type":21,"tag":209,"props":38922,"children":38923},{"class":211,"line":2471},[38924],{"type":21,"tag":209,"props":38925,"children":38926},{"style":448},[38927],{"type":26,"value":38928},"             * event, which is the jQuery Event, as per usual handler behaviour.\n",{"type":21,"tag":209,"props":38930,"children":38931},{"class":211,"line":2480},[38932],{"type":21,"tag":209,"props":38933,"children":38934},{"style":448},[38935],{"type":26,"value":38884},{"type":21,"tag":209,"props":38937,"children":38938},{"class":211,"line":2489},[38939,38944,38948,38952,38956,38960],{"type":21,"tag":209,"props":38940,"children":38941},{"style":360},[38942],{"type":26,"value":38943},"            onClick",{"type":21,"tag":209,"props":38945,"children":38946},{"style":222},[38947],{"type":26,"value":7427},{"type":21,"tag":209,"props":38949,"children":38950},{"style":216},[38951],{"type":26,"value":5370},{"type":21,"tag":209,"props":38953,"children":38954},{"style":222},[38955],{"type":26,"value":368},{"type":21,"tag":209,"props":38957,"children":38958},{"style":400},[38959],{"type":26,"value":10794},{"type":21,"tag":209,"props":38961,"children":38962},{"style":222},[38963],{"type":26,"value":38964},") {}\n",{"type":21,"tag":209,"props":38966,"children":38967},{"class":211,"line":2516},[38968],{"type":21,"tag":209,"props":38969,"children":38970},{"style":222},[38971],{"type":26,"value":38972},"        }),\n",{"type":21,"tag":209,"props":38974,"children":38975},{"class":211,"line":2525},[38976,38981],{"type":21,"tag":209,"props":38977,"children":38978},{"style":222},[38979],{"type":26,"value":38980},"        _header; ",{"type":21,"tag":209,"props":38982,"children":38983},{"style":448},[38984],{"type":26,"value":38985},"// We declare another local variable for the instantiated view.\n",{"type":21,"tag":209,"props":38987,"children":38988},{"class":211,"line":2533},[38989],{"type":21,"tag":209,"props":38990,"children":38991},{"emptyLinePlaceholder":248},[38992],{"type":26,"value":251},{"type":21,"tag":209,"props":38994,"children":38995},{"class":211,"line":2542},[38996],{"type":21,"tag":209,"props":38997,"children":38998},{"style":448},[38999],{"type":26,"value":4697},{"type":21,"tag":209,"props":39001,"children":39002},{"class":211,"line":2550},[39003],{"type":21,"tag":209,"props":39004,"children":39005},{"style":448},[39006],{"type":26,"value":39007},"     * Initialize this module. This function will be called automatically by Behold.Application.start().\n",{"type":21,"tag":209,"props":39009,"children":39010},{"class":211,"line":2564},[39011],{"type":21,"tag":209,"props":39012,"children":39013},{"style":448},[39014],{"type":26,"value":39015},"     * In this example, if we detect that the header element is present, we instantiate the Header view.\n",{"type":21,"tag":209,"props":39017,"children":39018},{"class":211,"line":2611},[39019],{"type":21,"tag":209,"props":39020,"children":39021},{"style":448},[39022],{"type":26,"value":4753},{"type":21,"tag":209,"props":39024,"children":39025},{"class":211,"line":2619},[39026,39030,39035,39039,39043],{"type":21,"tag":209,"props":39027,"children":39028},{"style":222},[39029],{"type":26,"value":16863},{"type":21,"tag":209,"props":39031,"children":39032},{"style":360},[39033],{"type":26,"value":39034},"initialize",{"type":21,"tag":209,"props":39036,"children":39037},{"style":216},[39038],{"type":26,"value":271},{"type":21,"tag":209,"props":39040,"children":39041},{"style":216},[39042],{"type":26,"value":4766},{"type":21,"tag":209,"props":39044,"children":39045},{"style":222},[39046],{"type":26,"value":5375},{"type":21,"tag":209,"props":39048,"children":39049},{"class":211,"line":2627},[39050,39054,39058,39062,39066,39070,39074,39078],{"type":21,"tag":209,"props":39051,"children":39052},{"style":216},[39053],{"type":26,"value":5803},{"type":21,"tag":209,"props":39055,"children":39056},{"style":222},[39057],{"type":26,"value":4776},{"type":21,"tag":209,"props":39059,"children":39060},{"style":360},[39061],{"type":26,"value":10250},{"type":21,"tag":209,"props":39063,"children":39064},{"style":222},[39065],{"type":26,"value":368},{"type":21,"tag":209,"props":39067,"children":39068},{"style":233},[39069],{"type":26,"value":38707},{"type":21,"tag":209,"props":39071,"children":39072},{"style":222},[39073],{"type":26,"value":2699},{"type":21,"tag":209,"props":39075,"children":39076},{"style":263},[39077],{"type":26,"value":36467},{"type":21,"tag":209,"props":39079,"children":39080},{"style":222},[39081],{"type":26,"value":4786},{"type":21,"tag":209,"props":39083,"children":39084},{"class":211,"line":2636},[39085,39090,39094,39098,39103,39108,39113],{"type":21,"tag":209,"props":39086,"children":39087},{"style":222},[39088],{"type":26,"value":39089},"            _header ",{"type":21,"tag":209,"props":39091,"children":39092},{"style":216},[39093],{"type":26,"value":1432},{"type":21,"tag":209,"props":39095,"children":39096},{"style":216},[39097],{"type":26,"value":4667},{"type":21,"tag":209,"props":39099,"children":39100},{"style":360},[39101],{"type":26,"value":39102}," _Header",{"type":21,"tag":209,"props":39104,"children":39105},{"style":222},[39106],{"type":26,"value":39107},"({} ",{"type":21,"tag":209,"props":39109,"children":39110},{"style":448},[39111],{"type":26,"value":39112},"/* We can pass in options in this object, that will be available via this.options in the view */",{"type":21,"tag":209,"props":39114,"children":39115},{"style":222},[39116],{"type":26,"value":39117}," );\n",{"type":21,"tag":209,"props":39119,"children":39120},{"class":211,"line":2644},[39121],{"type":21,"tag":209,"props":39122,"children":39123},{"style":222},[39124],{"type":26,"value":2235},{"type":21,"tag":209,"props":39126,"children":39127},{"class":211,"line":2657},[39128],{"type":21,"tag":209,"props":39129,"children":39130},{"style":222},[39131],{"type":26,"value":4850},{"type":21,"tag":209,"props":39133,"children":39134},{"class":211,"line":2728},[39135],{"type":21,"tag":209,"props":39136,"children":39137},{"style":448},[39138],{"type":26,"value":39139},"    // Here we could add a comma separated series of variables to pass into the module constructor function, after the\n",{"type":21,"tag":209,"props":39141,"children":39142},{"class":211,"line":2758},[39143],{"type":21,"tag":209,"props":39144,"children":39145},{"style":448},[39146],{"type":26,"value":39147},"    // functions closing curly bracket, should we wish to.\n",{"type":21,"tag":209,"props":39149,"children":39150},{"class":211,"line":2776},[39151],{"type":21,"tag":209,"props":39152,"children":39153},{"style":222},[39154],{"type":26,"value":469},{"type":21,"tag":3549,"props":39156,"children":39157},{"id":3883},[39158],{"type":26,"value":3886},{"type":21,"tag":22,"props":39160,"children":39161},{},[39162,39164,39170],{"type":26,"value":39163},"View, download and/or Fork the code ",{"type":21,"tag":29,"props":39165,"children":39167},{"href":38128,"rel":39166},[93],[39168],{"type":26,"value":39169},"on GitHub",{"type":26,"value":378},{"type":21,"tag":22,"props":39172,"children":39173},{},[39174,39176,39183],{"type":26,"value":39175},"For a detailed view into the internals of Behold, ",{"type":21,"tag":29,"props":39177,"children":39180},{"href":39178,"rel":39179},"http://sanemethod.github.io/Behold/Behold.js.html",[93],[39181],{"type":26,"value":39182},"head to the doxx pages",{"type":26,"value":378},{"type":21,"tag":3490,"props":39185,"children":39186},{},[39187],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":39189},[39190,39191,39192,39193,39194,39195],{"id":38140,"depth":244,"text":38143},{"id":38193,"depth":244,"text":38155},{"id":38240,"depth":244,"text":38164},{"id":38336,"depth":244,"text":38173},{"id":38372,"depth":244,"text":38182},{"id":3883,"depth":244,"text":3886},"content:ckeefer:2014-8:behold-views.md","ckeefer/2014-8/behold-views.md","ckeefer/2014-8/behold-views",{"user":3518,"name":3519},{"_path":39201,"_dir":39202,"_draft":7,"_partial":7,"_locale":8,"title":39203,"description":39204,"publishDate":39205,"tags":39206,"excerpt":39204,"body":39207,"_type":3511,"_id":40882,"_source":3513,"_file":40883,"_stem":40884,"_extension":3516,"author":40885},"/ckeefer/2014-7/promises","2014-7","It's a (jQuery-style) Promise","Way back when I brought up the topic of promises (particularly, jQuery Deferred), and I promised we would come back to the topic someday.","2014-10-16",[12,13804],{"type":18,"children":39208,"toc":40849},[39209,39220,39232,39238,39243,39261,39284,39298,39312,39317,39322,39335,39341,39347,39368,39373,39378,39384,39432,39436,39442,39654,39657,39663,40065,40068,40074,40088,40250,40253,40259,40271,40277,40283,40343,40348,40378,40384,40389,40394,40399,40418,40424,40429,40469,40474,40554,40557,40563,40575,40581,40586,40592,40596,40646,40651,40765,40768,40772,40845],{"type":21,"tag":22,"props":39210,"children":39211},{},[39212,39218],{"type":21,"tag":29,"props":39213,"children":39215},{"href":39214},"/search/jquery/ajax/user:ckeefer",[39216],{"type":26,"value":39217},"Way back when",{"type":26,"value":39219}," I brought up the topic of promises (particularly, jQuery Deferred), and I promised we would come back to the topic someday.",{"type":21,"tag":22,"props":39221,"children":39222},{},[39223,39225,39230],{"type":26,"value":39224},"Well, that promise has finally resolved, and this is the done block. Don't get it? Don't worry, all shall be explained. If you do get it, and wish there ",{"type":21,"tag":1084,"props":39226,"children":39227},{},[39228],{"type":26,"value":39229},"were",{"type":26,"value":39231}," a done block in the Promise spec... well, read on.",{"type":21,"tag":3549,"props":39233,"children":39235},{"id":39234},"native-promises",[39236],{"type":26,"value":39237},"Native Promises",{"type":21,"tag":22,"props":39239,"children":39240},{},[39241],{"type":26,"value":39242},"Promises are pretty great.",{"type":21,"tag":22,"props":39244,"children":39245},{},[39246,39248,39253,39255,39260],{"type":26,"value":39247},"A lot of time and effort has been expended on explaining why - which would suggest that the answer might not be immediately obvious to everyone, especially if you haven't spent too much time with ",{"type":21,"tag":5270,"props":39249,"children":39250},{},[39251],{"type":26,"value":39252},"pyramid code",{"type":26,"value":39254}," languishing in ",{"type":21,"tag":5270,"props":39256,"children":39257},{},[39258],{"type":26,"value":39259},"callback hell",{"type":26,"value":378},{"type":21,"tag":22,"props":39262,"children":39263},{},[39264,39266,39273,39275,39282],{"type":26,"value":39265},"For the curious, I've included some further reading at the end of this post that should help. For the rest, suffice to say that there are no less than ",{"type":21,"tag":29,"props":39267,"children":39270},{"href":39268,"rel":39269},"https://github.com/promises-aplus/promises-spec/blob/master/implementations.md",[93],[39271],{"type":26,"value":39272},"37 different javascript promise implementations",{"type":26,"value":39274}," - and these are just the ones that conform to the ",{"type":21,"tag":29,"props":39276,"children":39279},{"href":39277,"rel":39278},"https://promisesaplus.com/",[93],[39280],{"type":26,"value":39281},"Promises/A+ spec",{"type":26,"value":39283},". Obviously, a lot of people are excited about promises.",{"type":21,"tag":22,"props":39285,"children":39286},{},[39287,39289,39296],{"type":26,"value":39288},"Most exciting for those interested in promises in js, however, is the fact that they'll soon be ",{"type":21,"tag":29,"props":39290,"children":39293},{"href":39291,"rel":39292},"https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Promise",[93],[39294],{"type":26,"value":39295},"available natively in a browser near you",{"type":26,"value":39297},", if indeed they're not already. The native implementations will be compliant to the spec, faster (as a result of being native code), and available without the inclusion of an additional library. Yay!",{"type":21,"tag":22,"props":39299,"children":39300},{},[39301,39303,39310],{"type":26,"value":39302},"However, if you head to the list of promise implementations linked above and scan through them, including those listed as part of frameworks, you'll notice that ",{"type":21,"tag":29,"props":39304,"children":39307},{"href":39305,"rel":39306},"http://api.jquery.com/category/deferred-object/",[93],[39308],{"type":26,"value":39309},"jQuery's Deferred",{"type":26,"value":39311}," isn't among them.",{"type":21,"tag":22,"props":39313,"children":39314},{},[39315],{"type":26,"value":39316},"You see, while jQuery's Deferred plays nicely internally, it isn't compliant with the Promises/A+ spec that all the cool kids are using. If we're including jQuery in our project, we could just keep on using Deferred - but what if we really like jQuery's Deferred API, but want to take advantage of native promises?",{"type":21,"tag":22,"props":39318,"children":39319},{},[39320],{"type":26,"value":39321},"Sounds like a problem. Let's solve it, shall we? I've written a little wrapper lib named Defer (original, I know), that let's you use native promises with an API very similar (although not identical!) to the jQuery Deferred API. Details below.",{"type":21,"tag":22,"props":39323,"children":39324},{},[39325,39327,39333],{"type":26,"value":39326},"Head to the ",{"type":21,"tag":29,"props":39328,"children":39331},{"href":39329,"rel":39330},"https://github.com/SaneMethod/Defer",[93],[39332],{"type":26,"value":14934},{"type":26,"value":39334}," for more details, and to see the code.",{"type":21,"tag":3549,"props":39336,"children":39338},{"id":39337},"defer",[39339],{"type":26,"value":39340},"Defer",{"type":21,"tag":51,"props":39342,"children":39344},{"id":39343},"native-promise-api-wrapper",[39345],{"type":26,"value":39346},"Native Promise API Wrapper",{"type":21,"tag":22,"props":39348,"children":39349},{},[39350,39352,39357,39359,39366],{"type":26,"value":39351},"Defer is for those who like the jQuery API for ",{"type":21,"tag":29,"props":39353,"children":39355},{"href":39305,"rel":39354},[93],[39356],{"type":26,"value":26910},{"type":26,"value":39358},", but want to take advantage of the new, native Promise API built into modern versions of Firefox, Chrome, Opera and Safari (but not ie - see ",{"type":21,"tag":29,"props":39360,"children":39363},{"href":39361,"rel":39362},"http://caniuse.com/#feat=promises",[93],[39364],{"type":26,"value":39365},"caniuse",{"type":26,"value":39367}," for up-to-date details).",{"type":21,"tag":22,"props":39369,"children":39370},{},[39371],{"type":26,"value":39372},"Defer is also for those who'd like a 'done' function (that is, one which executes after the entire promise chain is completed, which doesn't currently exist in the Promise specification), for those who like to call resolve or reject from outside the Promise constructor, and for those who consider one function per composition ideal, and two or more unbearably ugly (with the exception of .then, because reasons). See below for some more details on this.",{"type":21,"tag":22,"props":39374,"children":39375},{},[39376],{"type":26,"value":39377},"Defer is in an immediately-invoked closure, so you can pass whatever context you'd like it to live in to it. By default, it attaches itself to the global window.",{"type":21,"tag":3549,"props":39379,"children":39381},{"id":39380},"usage",[39382],{"type":26,"value":39383},"Usage:",{"type":21,"tag":3677,"props":39385,"children":39386},{},[39387,39396,39405,39414,39423],{"type":21,"tag":3681,"props":39388,"children":39389},{},[39390],{"type":21,"tag":29,"props":39391,"children":39393},{"href":39392},"#simple-example",[39394],{"type":26,"value":39395},"Simple Example",{"type":21,"tag":3681,"props":39397,"children":39398},{},[39399],{"type":21,"tag":29,"props":39400,"children":39402},{"href":39401},"#another-example",[39403],{"type":26,"value":39404},"Another Example",{"type":21,"tag":3681,"props":39406,"children":39407},{},[39408],{"type":21,"tag":29,"props":39409,"children":39411},{"href":39410},"#ajax-example",[39412],{"type":26,"value":39413},"Ajax Example",{"type":21,"tag":3681,"props":39415,"children":39416},{},[39417],{"type":21,"tag":29,"props":39418,"children":39420},{"href":39419},"#native-comparison",[39421],{"type":26,"value":39422},"Comparison with Native API",{"type":21,"tag":3681,"props":39424,"children":39425},{},[39426],{"type":21,"tag":29,"props":39427,"children":39429},{"href":39428},"#jquery-comparison",[39430],{"type":26,"value":39431},"Comparison with jQuery API",{"type":21,"tag":39433,"props":39434,"children":39435},"hr",{},[],{"type":21,"tag":51,"props":39437,"children":39439},{"id":39438},"simple-example",[39440],{"type":26,"value":39441},"Simple Example:",{"type":21,"tag":200,"props":39443,"children":39445},{"className":9044,"code":39444,"language":9046,"meta":8,"style":8},"var defer = Defer();\ndefer.then(function(value){\n// Do something with the value\n// Returning an altered value will propagate to succeeding then and done calls\n}).done(function(value){\n// Called when the promise chain is fully resolved\n}).fail(function(error){\n// Called when the promise is rejected, with any value passed into reject\n// A nice convention is to make that value a new Error()\n});\n\n// ... Do your async stuff ...\ndefer.resolve(value /* some value your async stuff gave you */);\n",[39446],{"type":21,"tag":63,"props":39447,"children":39448},{"__ignoreMap":8},[39449,39473,39505,39513,39521,39552,39560,39591,39599,39607,39614,39621,39629],{"type":21,"tag":209,"props":39450,"children":39451},{"class":211,"line":212},[39452,39456,39460,39464,39469],{"type":21,"tag":209,"props":39453,"children":39454},{"style":216},[39455],{"type":26,"value":8996},{"type":21,"tag":209,"props":39457,"children":39458},{"style":222},[39459],{"type":26,"value":28080},{"type":21,"tag":209,"props":39461,"children":39462},{"style":216},[39463],{"type":26,"value":1432},{"type":21,"tag":209,"props":39465,"children":39466},{"style":360},[39467],{"type":26,"value":39468}," Defer",{"type":21,"tag":209,"props":39470,"children":39471},{"style":222},[39472],{"type":26,"value":4842},{"type":21,"tag":209,"props":39474,"children":39475},{"class":211,"line":244},[39476,39481,39485,39489,39493,39497,39501],{"type":21,"tag":209,"props":39477,"children":39478},{"style":222},[39479],{"type":26,"value":39480},"defer.",{"type":21,"tag":209,"props":39482,"children":39483},{"style":360},[39484],{"type":26,"value":2704},{"type":21,"tag":209,"props":39486,"children":39487},{"style":222},[39488],{"type":26,"value":368},{"type":21,"tag":209,"props":39490,"children":39491},{"style":216},[39492],{"type":26,"value":5370},{"type":21,"tag":209,"props":39494,"children":39495},{"style":222},[39496],{"type":26,"value":368},{"type":21,"tag":209,"props":39498,"children":39499},{"style":400},[39500],{"type":26,"value":14695},{"type":21,"tag":209,"props":39502,"children":39503},{"style":222},[39504],{"type":26,"value":2369},{"type":21,"tag":209,"props":39506,"children":39507},{"class":211,"line":254},[39508],{"type":21,"tag":209,"props":39509,"children":39510},{"style":448},[39511],{"type":26,"value":39512},"// Do something with the value\n",{"type":21,"tag":209,"props":39514,"children":39515},{"class":211,"line":279},[39516],{"type":21,"tag":209,"props":39517,"children":39518},{"style":448},[39519],{"type":26,"value":39520},"// Returning an altered value will propagate to succeeding then and done calls\n",{"type":21,"tag":209,"props":39522,"children":39523},{"class":211,"line":288},[39524,39528,39532,39536,39540,39544,39548],{"type":21,"tag":209,"props":39525,"children":39526},{"style":222},[39527],{"type":26,"value":18037},{"type":21,"tag":209,"props":39529,"children":39530},{"style":360},[39531],{"type":26,"value":18042},{"type":21,"tag":209,"props":39533,"children":39534},{"style":222},[39535],{"type":26,"value":368},{"type":21,"tag":209,"props":39537,"children":39538},{"style":216},[39539],{"type":26,"value":5370},{"type":21,"tag":209,"props":39541,"children":39542},{"style":222},[39543],{"type":26,"value":368},{"type":21,"tag":209,"props":39545,"children":39546},{"style":400},[39547],{"type":26,"value":14695},{"type":21,"tag":209,"props":39549,"children":39550},{"style":222},[39551],{"type":26,"value":2369},{"type":21,"tag":209,"props":39553,"children":39554},{"class":211,"line":307},[39555],{"type":21,"tag":209,"props":39556,"children":39557},{"style":448},[39558],{"type":26,"value":39559},"// Called when the promise chain is fully resolved\n",{"type":21,"tag":209,"props":39561,"children":39562},{"class":211,"line":325},[39563,39567,39571,39575,39579,39583,39587],{"type":21,"tag":209,"props":39564,"children":39565},{"style":222},[39566],{"type":26,"value":18037},{"type":21,"tag":209,"props":39568,"children":39569},{"style":360},[39570],{"type":26,"value":18091},{"type":21,"tag":209,"props":39572,"children":39573},{"style":222},[39574],{"type":26,"value":368},{"type":21,"tag":209,"props":39576,"children":39577},{"style":216},[39578],{"type":26,"value":5370},{"type":21,"tag":209,"props":39580,"children":39581},{"style":222},[39582],{"type":26,"value":368},{"type":21,"tag":209,"props":39584,"children":39585},{"style":400},[39586],{"type":26,"value":10685},{"type":21,"tag":209,"props":39588,"children":39589},{"style":222},[39590],{"type":26,"value":2369},{"type":21,"tag":209,"props":39592,"children":39593},{"class":211,"line":334},[39594],{"type":21,"tag":209,"props":39595,"children":39596},{"style":448},[39597],{"type":26,"value":39598},"// Called when the promise is rejected, with any value passed into reject\n",{"type":21,"tag":209,"props":39600,"children":39601},{"class":211,"line":343},[39602],{"type":21,"tag":209,"props":39603,"children":39604},{"style":448},[39605],{"type":26,"value":39606},"// A nice convention is to make that value a new Error()\n",{"type":21,"tag":209,"props":39608,"children":39609},{"class":211,"line":351},[39610],{"type":21,"tag":209,"props":39611,"children":39612},{"style":222},[39613],{"type":26,"value":469},{"type":21,"tag":209,"props":39615,"children":39616},{"class":211,"line":444},[39617],{"type":21,"tag":209,"props":39618,"children":39619},{"emptyLinePlaceholder":248},[39620],{"type":26,"value":251},{"type":21,"tag":209,"props":39622,"children":39623},{"class":211,"line":454},[39624],{"type":21,"tag":209,"props":39625,"children":39626},{"style":448},[39627],{"type":26,"value":39628},"// ... Do your async stuff ...\n",{"type":21,"tag":209,"props":39630,"children":39631},{"class":211,"line":463},[39632,39636,39640,39645,39650],{"type":21,"tag":209,"props":39633,"children":39634},{"style":222},[39635],{"type":26,"value":39480},{"type":21,"tag":209,"props":39637,"children":39638},{"style":360},[39639],{"type":26,"value":5590},{"type":21,"tag":209,"props":39641,"children":39642},{"style":222},[39643],{"type":26,"value":39644},"(value ",{"type":21,"tag":209,"props":39646,"children":39647},{"style":448},[39648],{"type":26,"value":39649},"/* some value your async stuff gave you */",{"type":21,"tag":209,"props":39651,"children":39652},{"style":222},[39653],{"type":26,"value":2608},{"type":21,"tag":39433,"props":39655,"children":39656},{},[],{"type":21,"tag":51,"props":39658,"children":39660},{"id":39659},"another-example",[39661],{"type":26,"value":39662},"Another Example:",{"type":21,"tag":200,"props":39664,"children":39666},{"className":9044,"code":39665,"language":9046,"meta":8,"style":8},"var p2 = Defer(),\np1 = Defer();\n\np2.then(function (value) {\n    console.log(value); // 1\n    return value + 1;\n}).done(function(value){\n    console.log(value); // 3\n}).then(function (value) {\n    console.log(value); // 2\n    return value + 1;\n});\n\np2.resolve(1);\np1.resolve(2);\n\nPromise.all([p2, p1]).then(function(vals){\n    console.log(vals); // [3, 2]\n});\n",[39667],{"type":21,"tag":63,"props":39668,"children":39669},{"__ignoreMap":8},[39670,39694,39714,39721,39753,39774,39798,39829,39849,39880,39900,39923,39930,39937,39960,39984,39991,40037,40058],{"type":21,"tag":209,"props":39671,"children":39672},{"class":211,"line":212},[39673,39677,39682,39686,39690],{"type":21,"tag":209,"props":39674,"children":39675},{"style":216},[39676],{"type":26,"value":8996},{"type":21,"tag":209,"props":39678,"children":39679},{"style":222},[39680],{"type":26,"value":39681}," p2 ",{"type":21,"tag":209,"props":39683,"children":39684},{"style":216},[39685],{"type":26,"value":1432},{"type":21,"tag":209,"props":39687,"children":39688},{"style":360},[39689],{"type":26,"value":39468},{"type":21,"tag":209,"props":39691,"children":39692},{"style":222},[39693],{"type":26,"value":5405},{"type":21,"tag":209,"props":39695,"children":39696},{"class":211,"line":244},[39697,39702,39706,39710],{"type":21,"tag":209,"props":39698,"children":39699},{"style":222},[39700],{"type":26,"value":39701},"p1 ",{"type":21,"tag":209,"props":39703,"children":39704},{"style":216},[39705],{"type":26,"value":1432},{"type":21,"tag":209,"props":39707,"children":39708},{"style":360},[39709],{"type":26,"value":39468},{"type":21,"tag":209,"props":39711,"children":39712},{"style":222},[39713],{"type":26,"value":4842},{"type":21,"tag":209,"props":39715,"children":39716},{"class":211,"line":254},[39717],{"type":21,"tag":209,"props":39718,"children":39719},{"emptyLinePlaceholder":248},[39720],{"type":26,"value":251},{"type":21,"tag":209,"props":39722,"children":39723},{"class":211,"line":279},[39724,39729,39733,39737,39741,39745,39749],{"type":21,"tag":209,"props":39725,"children":39726},{"style":222},[39727],{"type":26,"value":39728},"p2.",{"type":21,"tag":209,"props":39730,"children":39731},{"style":360},[39732],{"type":26,"value":2704},{"type":21,"tag":209,"props":39734,"children":39735},{"style":222},[39736],{"type":26,"value":368},{"type":21,"tag":209,"props":39738,"children":39739},{"style":216},[39740],{"type":26,"value":5370},{"type":21,"tag":209,"props":39742,"children":39743},{"style":222},[39744],{"type":26,"value":4776},{"type":21,"tag":209,"props":39746,"children":39747},{"style":400},[39748],{"type":26,"value":14695},{"type":21,"tag":209,"props":39750,"children":39751},{"style":222},[39752],{"type":26,"value":4786},{"type":21,"tag":209,"props":39754,"children":39755},{"class":211,"line":288},[39756,39760,39764,39769],{"type":21,"tag":209,"props":39757,"children":39758},{"style":222},[39759],{"type":26,"value":1054},{"type":21,"tag":209,"props":39761,"children":39762},{"style":360},[39763],{"type":26,"value":1059},{"type":21,"tag":209,"props":39765,"children":39766},{"style":222},[39767],{"type":26,"value":39768},"(value); ",{"type":21,"tag":209,"props":39770,"children":39771},{"style":448},[39772],{"type":26,"value":39773},"// 1\n",{"type":21,"tag":209,"props":39775,"children":39776},{"class":211,"line":307},[39777,39781,39786,39790,39794],{"type":21,"tag":209,"props":39778,"children":39779},{"style":216},[39780],{"type":26,"value":1298},{"type":21,"tag":209,"props":39782,"children":39783},{"style":222},[39784],{"type":26,"value":39785}," value ",{"type":21,"tag":209,"props":39787,"children":39788},{"style":216},[39789],{"type":26,"value":10237},{"type":21,"tag":209,"props":39791,"children":39792},{"style":263},[39793],{"type":26,"value":11271},{"type":21,"tag":209,"props":39795,"children":39796},{"style":222},[39797],{"type":26,"value":241},{"type":21,"tag":209,"props":39799,"children":39800},{"class":211,"line":325},[39801,39805,39809,39813,39817,39821,39825],{"type":21,"tag":209,"props":39802,"children":39803},{"style":222},[39804],{"type":26,"value":18037},{"type":21,"tag":209,"props":39806,"children":39807},{"style":360},[39808],{"type":26,"value":18042},{"type":21,"tag":209,"props":39810,"children":39811},{"style":222},[39812],{"type":26,"value":368},{"type":21,"tag":209,"props":39814,"children":39815},{"style":216},[39816],{"type":26,"value":5370},{"type":21,"tag":209,"props":39818,"children":39819},{"style":222},[39820],{"type":26,"value":368},{"type":21,"tag":209,"props":39822,"children":39823},{"style":400},[39824],{"type":26,"value":14695},{"type":21,"tag":209,"props":39826,"children":39827},{"style":222},[39828],{"type":26,"value":2369},{"type":21,"tag":209,"props":39830,"children":39831},{"class":211,"line":334},[39832,39836,39840,39844],{"type":21,"tag":209,"props":39833,"children":39834},{"style":222},[39835],{"type":26,"value":1054},{"type":21,"tag":209,"props":39837,"children":39838},{"style":360},[39839],{"type":26,"value":1059},{"type":21,"tag":209,"props":39841,"children":39842},{"style":222},[39843],{"type":26,"value":39768},{"type":21,"tag":209,"props":39845,"children":39846},{"style":448},[39847],{"type":26,"value":39848},"// 3\n",{"type":21,"tag":209,"props":39850,"children":39851},{"class":211,"line":343},[39852,39856,39860,39864,39868,39872,39876],{"type":21,"tag":209,"props":39853,"children":39854},{"style":222},[39855],{"type":26,"value":18037},{"type":21,"tag":209,"props":39857,"children":39858},{"style":360},[39859],{"type":26,"value":2704},{"type":21,"tag":209,"props":39861,"children":39862},{"style":222},[39863],{"type":26,"value":368},{"type":21,"tag":209,"props":39865,"children":39866},{"style":216},[39867],{"type":26,"value":5370},{"type":21,"tag":209,"props":39869,"children":39870},{"style":222},[39871],{"type":26,"value":4776},{"type":21,"tag":209,"props":39873,"children":39874},{"style":400},[39875],{"type":26,"value":14695},{"type":21,"tag":209,"props":39877,"children":39878},{"style":222},[39879],{"type":26,"value":4786},{"type":21,"tag":209,"props":39881,"children":39882},{"class":211,"line":351},[39883,39887,39891,39895],{"type":21,"tag":209,"props":39884,"children":39885},{"style":222},[39886],{"type":26,"value":1054},{"type":21,"tag":209,"props":39888,"children":39889},{"style":360},[39890],{"type":26,"value":1059},{"type":21,"tag":209,"props":39892,"children":39893},{"style":222},[39894],{"type":26,"value":39768},{"type":21,"tag":209,"props":39896,"children":39897},{"style":448},[39898],{"type":26,"value":39899},"// 2\n",{"type":21,"tag":209,"props":39901,"children":39902},{"class":211,"line":444},[39903,39907,39911,39915,39919],{"type":21,"tag":209,"props":39904,"children":39905},{"style":216},[39906],{"type":26,"value":1298},{"type":21,"tag":209,"props":39908,"children":39909},{"style":222},[39910],{"type":26,"value":39785},{"type":21,"tag":209,"props":39912,"children":39913},{"style":216},[39914],{"type":26,"value":10237},{"type":21,"tag":209,"props":39916,"children":39917},{"style":263},[39918],{"type":26,"value":11271},{"type":21,"tag":209,"props":39920,"children":39921},{"style":222},[39922],{"type":26,"value":241},{"type":21,"tag":209,"props":39924,"children":39925},{"class":211,"line":454},[39926],{"type":21,"tag":209,"props":39927,"children":39928},{"style":222},[39929],{"type":26,"value":469},{"type":21,"tag":209,"props":39931,"children":39932},{"class":211,"line":463},[39933],{"type":21,"tag":209,"props":39934,"children":39935},{"emptyLinePlaceholder":248},[39936],{"type":26,"value":251},{"type":21,"tag":209,"props":39938,"children":39939},{"class":211,"line":472},[39940,39944,39948,39952,39956],{"type":21,"tag":209,"props":39941,"children":39942},{"style":222},[39943],{"type":26,"value":39728},{"type":21,"tag":209,"props":39945,"children":39946},{"style":360},[39947],{"type":26,"value":5590},{"type":21,"tag":209,"props":39949,"children":39950},{"style":222},[39951],{"type":26,"value":368},{"type":21,"tag":209,"props":39953,"children":39954},{"style":263},[39955],{"type":26,"value":3224},{"type":21,"tag":209,"props":39957,"children":39958},{"style":222},[39959],{"type":26,"value":2608},{"type":21,"tag":209,"props":39961,"children":39962},{"class":211,"line":480},[39963,39968,39972,39976,39980],{"type":21,"tag":209,"props":39964,"children":39965},{"style":222},[39966],{"type":26,"value":39967},"p1.",{"type":21,"tag":209,"props":39969,"children":39970},{"style":360},[39971],{"type":26,"value":5590},{"type":21,"tag":209,"props":39973,"children":39974},{"style":222},[39975],{"type":26,"value":368},{"type":21,"tag":209,"props":39977,"children":39978},{"style":263},[39979],{"type":26,"value":3233},{"type":21,"tag":209,"props":39981,"children":39982},{"style":222},[39983],{"type":26,"value":2608},{"type":21,"tag":209,"props":39985,"children":39986},{"class":211,"line":489},[39987],{"type":21,"tag":209,"props":39988,"children":39989},{"emptyLinePlaceholder":248},[39990],{"type":26,"value":251},{"type":21,"tag":209,"props":39992,"children":39993},{"class":211,"line":847},[39994,39999,40003,40007,40012,40016,40020,40024,40028,40033],{"type":21,"tag":209,"props":39995,"children":39996},{"style":263},[39997],{"type":26,"value":39998},"Promise",{"type":21,"tag":209,"props":40000,"children":40001},{"style":222},[40002],{"type":26,"value":378},{"type":21,"tag":209,"props":40004,"children":40005},{"style":360},[40006],{"type":26,"value":11955},{"type":21,"tag":209,"props":40008,"children":40009},{"style":222},[40010],{"type":26,"value":40011},"([p2, p1]).",{"type":21,"tag":209,"props":40013,"children":40014},{"style":360},[40015],{"type":26,"value":2704},{"type":21,"tag":209,"props":40017,"children":40018},{"style":222},[40019],{"type":26,"value":368},{"type":21,"tag":209,"props":40021,"children":40022},{"style":216},[40023],{"type":26,"value":5370},{"type":21,"tag":209,"props":40025,"children":40026},{"style":222},[40027],{"type":26,"value":368},{"type":21,"tag":209,"props":40029,"children":40030},{"style":400},[40031],{"type":26,"value":40032},"vals",{"type":21,"tag":209,"props":40034,"children":40035},{"style":222},[40036],{"type":26,"value":2369},{"type":21,"tag":209,"props":40038,"children":40039},{"class":211,"line":860},[40040,40044,40048,40053],{"type":21,"tag":209,"props":40041,"children":40042},{"style":222},[40043],{"type":26,"value":1054},{"type":21,"tag":209,"props":40045,"children":40046},{"style":360},[40047],{"type":26,"value":1059},{"type":21,"tag":209,"props":40049,"children":40050},{"style":222},[40051],{"type":26,"value":40052},"(vals); ",{"type":21,"tag":209,"props":40054,"children":40055},{"style":448},[40056],{"type":26,"value":40057},"// [3, 2]\n",{"type":21,"tag":209,"props":40059,"children":40060},{"class":211,"line":877},[40061],{"type":21,"tag":209,"props":40062,"children":40063},{"style":222},[40064],{"type":26,"value":469},{"type":21,"tag":39433,"props":40066,"children":40067},{},[],{"type":21,"tag":51,"props":40069,"children":40071},{"id":40070},"ajax-example",[40072],{"type":26,"value":40073},"Ajax Example:",{"type":21,"tag":22,"props":40075,"children":40076},{},[40077,40079,40086],{"type":26,"value":40078},"See the ",{"type":21,"tag":29,"props":40080,"children":40083},{"href":40081,"rel":40082},"https://github.com/SaneMethod/Defer/blob/master/DeferAjaxExample.js",[93],[40084],{"type":26,"value":40085},"ajax example",{"type":26,"value":40087}," for the ajax wrapper being used below.",{"type":21,"tag":200,"props":40089,"children":40091},{"className":9044,"code":40090,"language":9046,"meta":8,"style":8},"ajax({\n    url:/somewhere/,\n    type:GET,\n    dataType:arraybuffer\n}).then(function(res){\n    // alter the result in someway and return it\n    return res;\n}).done(function(res){\n    // Do something with the result which was altered in the then block.\n});\n",[40092],{"type":21,"tag":63,"props":40093,"children":40094},{"__ignoreMap":8},[40095,40106,40130,40146,40154,40185,40193,40204,40235,40243],{"type":21,"tag":209,"props":40096,"children":40097},{"class":211,"line":212},[40098,40102],{"type":21,"tag":209,"props":40099,"children":40100},{"style":360},[40101],{"type":26,"value":17978},{"type":21,"tag":209,"props":40103,"children":40104},{"style":222},[40105],{"type":26,"value":17983},{"type":21,"tag":209,"props":40107,"children":40108},{"class":211,"line":244},[40109,40113,40117,40122,40126],{"type":21,"tag":209,"props":40110,"children":40111},{"style":222},[40112],{"type":26,"value":18008},{"type":21,"tag":209,"props":40114,"children":40115},{"style":233},[40116],{"type":26,"value":9749},{"type":21,"tag":209,"props":40118,"children":40119},{"style":10204},[40120],{"type":26,"value":40121},"somewhere",{"type":21,"tag":209,"props":40123,"children":40124},{"style":233},[40125],{"type":26,"value":9749},{"type":21,"tag":209,"props":40127,"children":40128},{"style":222},[40129],{"type":26,"value":304},{"type":21,"tag":209,"props":40131,"children":40132},{"class":211,"line":254},[40133,40137,40142],{"type":21,"tag":209,"props":40134,"children":40135},{"style":222},[40136],{"type":26,"value":17991},{"type":21,"tag":209,"props":40138,"children":40139},{"style":263},[40140],{"type":26,"value":40141},"GET",{"type":21,"tag":209,"props":40143,"children":40144},{"style":222},[40145],{"type":26,"value":304},{"type":21,"tag":209,"props":40147,"children":40148},{"class":211,"line":279},[40149],{"type":21,"tag":209,"props":40150,"children":40151},{"style":222},[40152],{"type":26,"value":40153},"    dataType:arraybuffer\n",{"type":21,"tag":209,"props":40155,"children":40156},{"class":211,"line":288},[40157,40161,40165,40169,40173,40177,40181],{"type":21,"tag":209,"props":40158,"children":40159},{"style":222},[40160],{"type":26,"value":18037},{"type":21,"tag":209,"props":40162,"children":40163},{"style":360},[40164],{"type":26,"value":2704},{"type":21,"tag":209,"props":40166,"children":40167},{"style":222},[40168],{"type":26,"value":368},{"type":21,"tag":209,"props":40170,"children":40171},{"style":216},[40172],{"type":26,"value":5370},{"type":21,"tag":209,"props":40174,"children":40175},{"style":222},[40176],{"type":26,"value":368},{"type":21,"tag":209,"props":40178,"children":40179},{"style":400},[40180],{"type":26,"value":1385},{"type":21,"tag":209,"props":40182,"children":40183},{"style":222},[40184],{"type":26,"value":2369},{"type":21,"tag":209,"props":40186,"children":40187},{"class":211,"line":307},[40188],{"type":21,"tag":209,"props":40189,"children":40190},{"style":448},[40191],{"type":26,"value":40192},"    // alter the result in someway and return it\n",{"type":21,"tag":209,"props":40194,"children":40195},{"class":211,"line":325},[40196,40200],{"type":21,"tag":209,"props":40197,"children":40198},{"style":216},[40199],{"type":26,"value":1298},{"type":21,"tag":209,"props":40201,"children":40202},{"style":222},[40203],{"type":26,"value":1442},{"type":21,"tag":209,"props":40205,"children":40206},{"class":211,"line":334},[40207,40211,40215,40219,40223,40227,40231],{"type":21,"tag":209,"props":40208,"children":40209},{"style":222},[40210],{"type":26,"value":18037},{"type":21,"tag":209,"props":40212,"children":40213},{"style":360},[40214],{"type":26,"value":18042},{"type":21,"tag":209,"props":40216,"children":40217},{"style":222},[40218],{"type":26,"value":368},{"type":21,"tag":209,"props":40220,"children":40221},{"style":216},[40222],{"type":26,"value":5370},{"type":21,"tag":209,"props":40224,"children":40225},{"style":222},[40226],{"type":26,"value":368},{"type":21,"tag":209,"props":40228,"children":40229},{"style":400},[40230],{"type":26,"value":1385},{"type":21,"tag":209,"props":40232,"children":40233},{"style":222},[40234],{"type":26,"value":2369},{"type":21,"tag":209,"props":40236,"children":40237},{"class":211,"line":343},[40238],{"type":21,"tag":209,"props":40239,"children":40240},{"style":448},[40241],{"type":26,"value":40242},"    // Do something with the result which was altered in the then block.\n",{"type":21,"tag":209,"props":40244,"children":40245},{"class":211,"line":351},[40246],{"type":21,"tag":209,"props":40247,"children":40248},{"style":222},[40249],{"type":26,"value":469},{"type":21,"tag":39433,"props":40251,"children":40252},{},[],{"type":21,"tag":3549,"props":40254,"children":40256},{"id":40255},"native-comparison",[40257],{"type":26,"value":40258},"Native Comparison:",{"type":21,"tag":22,"props":40260,"children":40261},{},[40262,40263,40269],{"type":26,"value":40078},{"type":21,"tag":29,"props":40264,"children":40266},{"href":18365,"rel":40265},[93],[40267],{"type":26,"value":40268},"MDN Promise article",{"type":26,"value":40270},"for the current form of the Promise API.",{"type":21,"tag":51,"props":40272,"children":40274},{"id":40273},"constructor",[40275],{"type":26,"value":40276},"Constructor",{"type":21,"tag":193,"props":40278,"children":40280},{"id":40279},"native",[40281],{"type":26,"value":40282},"Native",{"type":21,"tag":200,"props":40284,"children":40286},{"className":9044,"code":40285,"language":9046,"meta":8,"style":8},"var promise = new Promise(function(resolve, reject){});\n",[40287],{"type":21,"tag":63,"props":40288,"children":40289},{"__ignoreMap":8},[40290],{"type":21,"tag":209,"props":40291,"children":40292},{"class":211,"line":212},[40293,40297,40302,40306,40310,40314,40318,40322,40326,40330,40334,40338],{"type":21,"tag":209,"props":40294,"children":40295},{"style":216},[40296],{"type":26,"value":8996},{"type":21,"tag":209,"props":40298,"children":40299},{"style":222},[40300],{"type":26,"value":40301}," promise ",{"type":21,"tag":209,"props":40303,"children":40304},{"style":216},[40305],{"type":26,"value":1432},{"type":21,"tag":209,"props":40307,"children":40308},{"style":216},[40309],{"type":26,"value":4667},{"type":21,"tag":209,"props":40311,"children":40312},{"style":263},[40313],{"type":26,"value":5581},{"type":21,"tag":209,"props":40315,"children":40316},{"style":222},[40317],{"type":26,"value":368},{"type":21,"tag":209,"props":40319,"children":40320},{"style":216},[40321],{"type":26,"value":5370},{"type":21,"tag":209,"props":40323,"children":40324},{"style":222},[40325],{"type":26,"value":368},{"type":21,"tag":209,"props":40327,"children":40328},{"style":400},[40329],{"type":26,"value":5590},{"type":21,"tag":209,"props":40331,"children":40332},{"style":222},[40333],{"type":26,"value":408},{"type":21,"tag":209,"props":40335,"children":40336},{"style":400},[40337],{"type":26,"value":5599},{"type":21,"tag":209,"props":40339,"children":40340},{"style":222},[40341],{"type":26,"value":40342},"){});\n",{"type":21,"tag":193,"props":40344,"children":40346},{"id":40345},"defer-1",[40347],{"type":26,"value":39340},{"type":21,"tag":200,"props":40349,"children":40351},{"className":9044,"code":40350,"language":9046,"meta":8,"style":8},"var promise = Defer();\n",[40352],{"type":21,"tag":63,"props":40353,"children":40354},{"__ignoreMap":8},[40355],{"type":21,"tag":209,"props":40356,"children":40357},{"class":211,"line":212},[40358,40362,40366,40370,40374],{"type":21,"tag":209,"props":40359,"children":40360},{"style":216},[40361],{"type":26,"value":8996},{"type":21,"tag":209,"props":40363,"children":40364},{"style":222},[40365],{"type":26,"value":40301},{"type":21,"tag":209,"props":40367,"children":40368},{"style":216},[40369],{"type":26,"value":1432},{"type":21,"tag":209,"props":40371,"children":40372},{"style":360},[40373],{"type":26,"value":39468},{"type":21,"tag":209,"props":40375,"children":40376},{"style":222},[40377],{"type":26,"value":4842},{"type":21,"tag":51,"props":40379,"children":40381},{"id":40380},"resolve-or-reject",[40382],{"type":26,"value":40383},"Resolve or Reject",{"type":21,"tag":193,"props":40385,"children":40387},{"id":40386},"native-1",[40388],{"type":26,"value":40282},{"type":21,"tag":22,"props":40390,"children":40391},{},[40392],{"type":26,"value":40393},"Must be done within the Promise constructor.",{"type":21,"tag":193,"props":40395,"children":40397},{"id":40396},"defer-2",[40398],{"type":26,"value":39340},{"type":21,"tag":22,"props":40400,"children":40401},{},[40402,40404,40410,40411,40417],{"type":26,"value":40403},"Can be done anywhere the variable in question is in scope, via ",{"type":21,"tag":63,"props":40405,"children":40407},{"className":40406},[],[40408],{"type":26,"value":40409},".resolve()",{"type":26,"value":1922},{"type":21,"tag":63,"props":40412,"children":40414},{"className":40413},[],[40415],{"type":26,"value":40416},".reject()",{"type":26,"value":378},{"type":21,"tag":51,"props":40419,"children":40421},{"id":40420},"adding-successfailure-handlers",[40422],{"type":26,"value":40423},"Adding success/failure handlers",{"type":21,"tag":193,"props":40425,"children":40427},{"id":40426},"native-2",[40428],{"type":26,"value":40282},{"type":21,"tag":200,"props":40430,"children":40432},{"className":9044,"code":40431,"language":9046,"meta":8,"style":8},"promise.then(successHandler, optionalFailureHandler);\npromise.catch(failureHandler);\n",[40433],{"type":21,"tag":63,"props":40434,"children":40435},{"__ignoreMap":8},[40436,40453],{"type":21,"tag":209,"props":40437,"children":40438},{"class":211,"line":212},[40439,40444,40448],{"type":21,"tag":209,"props":40440,"children":40441},{"style":222},[40442],{"type":26,"value":40443},"promise.",{"type":21,"tag":209,"props":40445,"children":40446},{"style":360},[40447],{"type":26,"value":2704},{"type":21,"tag":209,"props":40449,"children":40450},{"style":222},[40451],{"type":26,"value":40452},"(successHandler, optionalFailureHandler);\n",{"type":21,"tag":209,"props":40454,"children":40455},{"class":211,"line":244},[40456,40460,40464],{"type":21,"tag":209,"props":40457,"children":40458},{"style":222},[40459],{"type":26,"value":40443},{"type":21,"tag":209,"props":40461,"children":40462},{"style":360},[40463],{"type":26,"value":6823},{"type":21,"tag":209,"props":40465,"children":40466},{"style":222},[40467],{"type":26,"value":40468},"(failureHandler);\n",{"type":21,"tag":193,"props":40470,"children":40472},{"id":40471},"defer-3",[40473],{"type":26,"value":39340},{"type":21,"tag":200,"props":40475,"children":40477},{"className":9044,"code":40476,"language":9046,"meta":8,"style":8},"promise.then(successHandler, optionalFailureHandler);\npromise.fail(failureHandler);\npromise.done(doneHandler); // Called when the promise chain fully resolves - not present in native Promise\npromise.always(alwaysHandler); // Called when the promise chain fully resolves, or is rejected - not present in native Promise\n",[40478],{"type":21,"tag":63,"props":40479,"children":40480},{"__ignoreMap":8},[40481,40496,40511,40532],{"type":21,"tag":209,"props":40482,"children":40483},{"class":211,"line":212},[40484,40488,40492],{"type":21,"tag":209,"props":40485,"children":40486},{"style":222},[40487],{"type":26,"value":40443},{"type":21,"tag":209,"props":40489,"children":40490},{"style":360},[40491],{"type":26,"value":2704},{"type":21,"tag":209,"props":40493,"children":40494},{"style":222},[40495],{"type":26,"value":40452},{"type":21,"tag":209,"props":40497,"children":40498},{"class":211,"line":244},[40499,40503,40507],{"type":21,"tag":209,"props":40500,"children":40501},{"style":222},[40502],{"type":26,"value":40443},{"type":21,"tag":209,"props":40504,"children":40505},{"style":360},[40506],{"type":26,"value":18091},{"type":21,"tag":209,"props":40508,"children":40509},{"style":222},[40510],{"type":26,"value":40468},{"type":21,"tag":209,"props":40512,"children":40513},{"class":211,"line":254},[40514,40518,40522,40527],{"type":21,"tag":209,"props":40515,"children":40516},{"style":222},[40517],{"type":26,"value":40443},{"type":21,"tag":209,"props":40519,"children":40520},{"style":360},[40521],{"type":26,"value":18042},{"type":21,"tag":209,"props":40523,"children":40524},{"style":222},[40525],{"type":26,"value":40526},"(doneHandler); ",{"type":21,"tag":209,"props":40528,"children":40529},{"style":448},[40530],{"type":26,"value":40531},"// Called when the promise chain fully resolves - not present in native Promise\n",{"type":21,"tag":209,"props":40533,"children":40534},{"class":211,"line":279},[40535,40539,40544,40549],{"type":21,"tag":209,"props":40536,"children":40537},{"style":222},[40538],{"type":26,"value":40443},{"type":21,"tag":209,"props":40540,"children":40541},{"style":360},[40542],{"type":26,"value":40543},"always",{"type":21,"tag":209,"props":40545,"children":40546},{"style":222},[40547],{"type":26,"value":40548},"(alwaysHandler); ",{"type":21,"tag":209,"props":40550,"children":40551},{"style":448},[40552],{"type":26,"value":40553},"// Called when the promise chain fully resolves, or is rejected - not present in native Promise\n",{"type":21,"tag":39433,"props":40555,"children":40556},{},[],{"type":21,"tag":3549,"props":40558,"children":40560},{"id":40559},"jquery-comparison",[40561],{"type":26,"value":40562},"jQuery Comparison:",{"type":21,"tag":22,"props":40564,"children":40565},{},[40566,40567,40573],{"type":26,"value":40078},{"type":21,"tag":29,"props":40568,"children":40570},{"href":39305,"rel":40569},[93],[40571],{"type":26,"value":40572},"jQuery Deferred documentation",{"type":26,"value":40574}," for the full Deferred API.",{"type":21,"tag":51,"props":40576,"children":40578},{"id":40577},"adding-handlers",[40579],{"type":26,"value":40580},"Adding handlers",{"type":21,"tag":22,"props":40582,"children":40583},{},[40584],{"type":26,"value":40585},"jQuery allows you to add an array of handlers, or a comma-seperated series of handlers, for most calls. Defer does not, for purely personal, aesthetic-preference reasons. If you want to add multiple handlers, make multiple calls to .done, .then, etc.",{"type":21,"tag":51,"props":40587,"children":40589},{"id":40588},"when-and-race",[40590],{"type":26,"value":40591},"When and race",{"type":21,"tag":193,"props":40593,"children":40594},{"id":13804},[40595],{"type":26,"value":17958},{"type":21,"tag":200,"props":40597,"children":40599},{"className":9044,"code":40598,"language":9046,"meta":8,"style":8},"jQuery.when(comma, separated, deferreds).done(function(valuesArray){});\n",[40600],{"type":21,"tag":63,"props":40601,"children":40602},{"__ignoreMap":8},[40603],{"type":21,"tag":209,"props":40604,"children":40605},{"class":211,"line":212},[40606,40611,40616,40621,40625,40629,40633,40637,40642],{"type":21,"tag":209,"props":40607,"children":40608},{"style":222},[40609],{"type":26,"value":40610},"jQuery.",{"type":21,"tag":209,"props":40612,"children":40613},{"style":360},[40614],{"type":26,"value":40615},"when",{"type":21,"tag":209,"props":40617,"children":40618},{"style":222},[40619],{"type":26,"value":40620},"(comma, separated, deferreds).",{"type":21,"tag":209,"props":40622,"children":40623},{"style":360},[40624],{"type":26,"value":18042},{"type":21,"tag":209,"props":40626,"children":40627},{"style":222},[40628],{"type":26,"value":368},{"type":21,"tag":209,"props":40630,"children":40631},{"style":216},[40632],{"type":26,"value":5370},{"type":21,"tag":209,"props":40634,"children":40635},{"style":222},[40636],{"type":26,"value":368},{"type":21,"tag":209,"props":40638,"children":40639},{"style":400},[40640],{"type":26,"value":40641},"valuesArray",{"type":21,"tag":209,"props":40643,"children":40644},{"style":222},[40645],{"type":26,"value":40342},{"type":21,"tag":193,"props":40647,"children":40649},{"id":40648},"defer-4",[40650],{"type":26,"value":39340},{"type":21,"tag":200,"props":40652,"children":40654},{"className":9044,"code":40653,"language":9046,"meta":8,"style":8},"Promise.all([array, of, Defer, Objects]).then(function(valuesArray){});\nPromise.race([array, of, Defer, Objects]).then(function(firstDeferToResolveValue){});\n",[40655],{"type":21,"tag":63,"props":40656,"children":40657},{"__ignoreMap":8},[40658,40712],{"type":21,"tag":209,"props":40659,"children":40660},{"class":211,"line":212},[40661,40665,40669,40673,40678,40683,40688,40692,40696,40700,40704,40708],{"type":21,"tag":209,"props":40662,"children":40663},{"style":263},[40664],{"type":26,"value":39998},{"type":21,"tag":209,"props":40666,"children":40667},{"style":222},[40668],{"type":26,"value":378},{"type":21,"tag":209,"props":40670,"children":40671},{"style":360},[40672],{"type":26,"value":11955},{"type":21,"tag":209,"props":40674,"children":40675},{"style":222},[40676],{"type":26,"value":40677},"([array, ",{"type":21,"tag":209,"props":40679,"children":40680},{"style":216},[40681],{"type":26,"value":40682},"of",{"type":21,"tag":209,"props":40684,"children":40685},{"style":222},[40686],{"type":26,"value":40687},", Defer, Objects]).",{"type":21,"tag":209,"props":40689,"children":40690},{"style":360},[40691],{"type":26,"value":2704},{"type":21,"tag":209,"props":40693,"children":40694},{"style":222},[40695],{"type":26,"value":368},{"type":21,"tag":209,"props":40697,"children":40698},{"style":216},[40699],{"type":26,"value":5370},{"type":21,"tag":209,"props":40701,"children":40702},{"style":222},[40703],{"type":26,"value":368},{"type":21,"tag":209,"props":40705,"children":40706},{"style":400},[40707],{"type":26,"value":40641},{"type":21,"tag":209,"props":40709,"children":40710},{"style":222},[40711],{"type":26,"value":40342},{"type":21,"tag":209,"props":40713,"children":40714},{"class":211,"line":244},[40715,40719,40723,40728,40732,40736,40740,40744,40748,40752,40756,40761],{"type":21,"tag":209,"props":40716,"children":40717},{"style":263},[40718],{"type":26,"value":39998},{"type":21,"tag":209,"props":40720,"children":40721},{"style":222},[40722],{"type":26,"value":378},{"type":21,"tag":209,"props":40724,"children":40725},{"style":360},[40726],{"type":26,"value":40727},"race",{"type":21,"tag":209,"props":40729,"children":40730},{"style":222},[40731],{"type":26,"value":40677},{"type":21,"tag":209,"props":40733,"children":40734},{"style":216},[40735],{"type":26,"value":40682},{"type":21,"tag":209,"props":40737,"children":40738},{"style":222},[40739],{"type":26,"value":40687},{"type":21,"tag":209,"props":40741,"children":40742},{"style":360},[40743],{"type":26,"value":2704},{"type":21,"tag":209,"props":40745,"children":40746},{"style":222},[40747],{"type":26,"value":368},{"type":21,"tag":209,"props":40749,"children":40750},{"style":216},[40751],{"type":26,"value":5370},{"type":21,"tag":209,"props":40753,"children":40754},{"style":222},[40755],{"type":26,"value":368},{"type":21,"tag":209,"props":40757,"children":40758},{"style":400},[40759],{"type":26,"value":40760},"firstDeferToResolveValue",{"type":21,"tag":209,"props":40762,"children":40763},{"style":222},[40764],{"type":26,"value":40342},{"type":21,"tag":39433,"props":40766,"children":40767},{},[],{"type":21,"tag":3549,"props":40769,"children":40770},{"id":13753},[40771],{"type":26,"value":13756},{"type":21,"tag":3677,"props":40773,"children":40774},{},[40775,40786,40798,40810,40821,40833],{"type":21,"tag":3681,"props":40776,"children":40777},{},[40778,40784],{"type":21,"tag":29,"props":40779,"children":40781},{"href":39277,"rel":40780},[93],[40782],{"type":26,"value":40783},"Promises/A+",{"type":26,"value":40785}," - The Promises spec.",{"type":21,"tag":3681,"props":40787,"children":40788},{},[40789,40796],{"type":21,"tag":29,"props":40790,"children":40793},{"href":40791,"rel":40792},"http://people.mozilla.org/~jorendorff/es6-draft.html#sec-promise-objects",[93],[40794],{"type":26,"value":40795},"Es6 Promise Draft",{"type":26,"value":40797}," - The draft of the promise spec being implemented by browsers.",{"type":21,"tag":3681,"props":40799,"children":40800},{},[40801,40808],{"type":21,"tag":29,"props":40802,"children":40805},{"href":40803,"rel":40804},"https://github.com/kriskowal/q/wiki/Coming-from-jQuery",[93],[40806],{"type":26,"value":40807},"Coming from jQuery to Q",{"type":26,"value":40809}," - Discusses some of the differences between jQuery Deferred and a Promise/A+ compliant library.",{"type":21,"tag":3681,"props":40811,"children":40812},{},[40813,40819],{"type":21,"tag":29,"props":40814,"children":40816},{"href":39291,"rel":40815},[93],[40817],{"type":26,"value":40818},"MDN Promises",{"type":26,"value":40820}," - MDN reference on native Promises.",{"type":21,"tag":3681,"props":40822,"children":40823},{},[40824,40831],{"type":21,"tag":29,"props":40825,"children":40828},{"href":40826,"rel":40827},"http://www.html5rocks.com/en/tutorials/es6/promises/",[93],[40829],{"type":26,"value":40830},"HTML5rocks article",{"type":26,"value":40832}," - Article on 3s6 promises.",{"type":21,"tag":3681,"props":40834,"children":40835},{},[40836,40843],{"type":21,"tag":29,"props":40837,"children":40840},{"href":40838,"rel":40839},"http://www.mattgreer.org/articles/promises-in-wicked-detail/",[93],[40841],{"type":26,"value":40842},"Javascript Promises in Wicked Detail",{"type":26,"value":40844}," - Excellent article breaking down the what, if not the why, of promises.",{"type":21,"tag":3490,"props":40846,"children":40847},{},[40848],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":40850},[40851,40852,40855,40860,40874,40881],{"id":39234,"depth":244,"text":39237},{"id":39337,"depth":244,"text":39340,"children":40853},[40854],{"id":39343,"depth":254,"text":39346},{"id":39380,"depth":244,"text":39383,"children":40856},[40857,40858,40859],{"id":39438,"depth":254,"text":39441},{"id":39659,"depth":254,"text":39662},{"id":40070,"depth":254,"text":40073},{"id":40255,"depth":244,"text":40258,"children":40861},[40862,40866,40870],{"id":40273,"depth":254,"text":40276,"children":40863},[40864,40865],{"id":40279,"depth":279,"text":40282},{"id":40345,"depth":279,"text":39340},{"id":40380,"depth":254,"text":40383,"children":40867},[40868,40869],{"id":40386,"depth":279,"text":40282},{"id":40396,"depth":279,"text":39340},{"id":40420,"depth":254,"text":40423,"children":40871},[40872,40873],{"id":40426,"depth":279,"text":40282},{"id":40471,"depth":279,"text":39340},{"id":40559,"depth":244,"text":40562,"children":40875},[40876,40877],{"id":40577,"depth":254,"text":40580},{"id":40588,"depth":254,"text":40591,"children":40878},[40879,40880],{"id":13804,"depth":279,"text":17958},{"id":40648,"depth":279,"text":39340},{"id":13753,"depth":244,"text":13756},"content:ckeefer:2014-7:promises.md","ckeefer/2014-7/promises.md","ckeefer/2014-7/promises",{"user":3518,"name":3519},{"_path":40887,"_dir":40888,"_draft":7,"_partial":7,"_locale":8,"title":40889,"description":40890,"publishDate":40891,"tags":40892,"image":40894,"excerpt":40890,"body":40895,"_type":3511,"_id":46724,"_source":3513,"_file":46725,"_stem":46726,"_extension":3516,"author":46727},"/ckeefer/2014-6/backbonesocketsync","2014-6","Websockets for Backbone","Backbone's had some of its thunder stolen lately by trendier frameworks like Meteor and Angular; for good reason, in most cases, as without the prosthetic functionality offered by the likes of Marionette, Backbone's view handling (amongst a few other lacks and warts) is really just 'roughed in'.","2014-06-25",[12,18917,40893],"backbone","/ckeefer/2014-6/img/WebsocketsPlusBackbone.png",{"type":18,"children":40896,"toc":46722},[40897,40910,40915,40920,40933,40964,40969,42673,42678,42859,42864,42975,42994,42999,43050,43395,43415,43612,43617,43832,43859,43871,43883,43936,43950,44046,44051,44268,44273,44530,44542,44547,44552,46713,46718],{"type":21,"tag":22,"props":40898,"children":40899},{},[40900,40902,40908],{"type":26,"value":40901},"Backbone's had some of its thunder stolen lately by trendier frameworks like Meteor and Angular; for good reason, in most cases, as without the prosthetic functionality offered by the likes of ",{"type":21,"tag":29,"props":40903,"children":40906},{"href":40904,"rel":40905},"http://marionettejs.com",[93],[40907],{"type":26,"value":38118},{"type":26,"value":40909},", Backbone's view handling (amongst a few other lacks and warts) is really just 'roughed in'.",{"type":21,"tag":22,"props":40911,"children":40912},{},[40913],{"type":26,"value":40914},"But the fact that a framework like marionette can be built on top of Backbone is a testament to Backbone's flexibility - after all, as the name suggests, Backbone is really just the 'skeleton' of your app, and it's willing to be fit into place however you need it to be.",{"type":21,"tag":22,"props":40916,"children":40917},{},[40918],{"type":26,"value":40919},"For instance: Backbone's default persistance method is via jQuery's ajax - make a request to the server using one of the standard HTTP methods to persists changes to models in a collection to the server-side db. Works great, but maybe you need something faster/better/stronger/etc.",{"type":21,"tag":22,"props":40921,"children":40922},{},[40923,40925,40932],{"type":26,"value":40924},"Like, say, ",{"type":21,"tag":29,"props":40926,"children":40929},{"href":40927,"rel":40928},"https://developer.mozilla.org/en/docs/WebSockets",[93],[40930],{"type":26,"value":40931},"WebSockets",{"type":26,"value":378},{"type":21,"tag":22,"props":40934,"children":40935},{},[40936,40938,40945,40947,40953,40955,40962],{"type":26,"value":40937},"Let's replace Backbone's standard method of persistance via ajax with WebSockets! To do this, we'll take advantage of the excellent ",{"type":21,"tag":29,"props":40939,"children":40942},{"href":40940,"rel":40941},"http://socket.io",[93],[40943],{"type":26,"value":40944},"socket.io",{"type":26,"value":40946}," client library (and, of course, you'll need the appropriate server-side library for your chosen language - via ",{"type":21,"tag":63,"props":40948,"children":40950},{"className":40949},[],[40951],{"type":26,"value":40952},"npm install socket.io",{"type":26,"value":40954}," if you're using Node.js, a package like ",{"type":21,"tag":29,"props":40956,"children":40959},{"href":40957,"rel":40958},"https://github.com/abourget/gevent-socketio",[93],[40960],{"type":26,"value":40961},"Gevent Socket.io",{"type":26,"value":40963}," if you're using Python, etc.).",{"type":21,"tag":22,"props":40965,"children":40966},{},[40967],{"type":26,"value":40968},"Let's take a look at the code, and then break it down:",{"type":21,"tag":200,"props":40970,"children":40972},{"className":9044,"code":40971,"language":9046,"meta":8,"style":8},"/**\n * Copyright (c) Christopher Keefer. All Rights Reserved.\n *\n * Overrides the default transport for Backbone syncing to use websockets via socket.io.\n */\n(function(Backbone, $, _, io){\n    var urlError = function(){\n        throw new Error('A \"url\" property or function must be specified.');\n    },\n        eventEmit = io.EventEmitter.prototype.emit,\n        ajaxSync = Backbone.sync;\n\n    /**\n     * Preserve the standard, jquery ajax based persistance method as ajaxSync.\n     */\n    Backbone.ajaxSync = function(method, model, options){\n        return ajaxSync.call(this, method, model, options);\n    };\n\n    /**\n     * Replace the standard sync function with our new, websocket/socket.io based solution.\n     */\n    Backbone.sync = function(method, model, options){\n        var opts = _.extend({}, options),\n            defer = $.Deferred(),\n            promise = defer.promise(),\n            namespace,\n            socket;\n\n        opts.url = (opts.url) ? _.result(opts, 'url') : (model.url) ? _.result(model, 'url') : void 0;\n        // If no url property has been specified, throw an error, as per the standard Backbone sync\n        if (!opts.url) urlError();\n        // Transform the url into a namespace\n        namespace = Backbone.Model.prototype.namespace.call(this, opts.url);\n        // Determine what data we're sending, and ensure id is present if we're performing a PATCH call\n        if (!opts.data && model) opts.data = opts.attrs || model.toJSON(options) || {};\n        if ((opts.data.id === null || opts.data.id === void 0) && opts.patch === true && model){\n            opts.data.id = model.id;\n        }\n        // Determine which websocket to use - set in options or on model\n        socket = opts.socket || model.socket;\n        // Add a listener for our namespaced method, and resolve or reject our deferred based on the response\n        socket.once(namespace+method, function(res){\n            var success = (res && res.success); // Expects server json response to contain a boolean 'success' field\n            if (success)\n            {\n                if (_.isFunction(options.success)) options.success(res);\n                defer.resolve(res);\n                return;\n            }\n            if (_.isFunction(options.error)) options.error(res);\n            defer.reject(res);\n        });\n\n        // Emit our namespaced method and the model+opts data\n        socket.emit(namespace+method, opts.data);\n\n        // Trigger the request event on the model, as per backbone spec\n        model.trigger('request', model, promise, opts);\n        // Return the promise for us to use as per usual (hanging .done blocks off, add to a .when, etc.)\n        return promise;\n    };\n\n    /**\n     * Break url apart to create namespace - every '/' save any pre/post-fixing the url will become a ':' indicating\n     * namespace - so a collection that maps to /api/posts will now have its events on the namespace\n     * api:posts: (ie. api:posts:create, api:posts:delete, etc.), and a model that maps to /api/posts/21\n     * will have events on api:posts:21: (ie. api:posts:21:update, api:posts:21:patch, etc.)\n     * @param {string=} url\n     */\n    Backbone.Model.prototype.namespace = function(url){\n        url = url || this.url();\n        return _.trim(url, '/').replace('/', ':') + \":\";\n    };\n\n    /**\n     * Override EventEmitter.emit and SocketNamespace reference for socket.io to add a catch all case for the\n     * wildcard ('*') character. Now, socket.on('*') will catch any event, with the name of the caught event\n     * passed to the handler as the first argument.\n    */\n    io.EventEmitter.prototype.emit = function(name){\n        var args = Array.prototype.slice.call(arguments, 1);\n\n        eventEmit.apply(this, ['*', name].concat(args));\n        eventEmit.apply(this, [name].concat(args));\n    };\n    io.SocketNamespace.prototype.$emit = io.EventEmitter.prototype.emit;\n})(Backbone, jQuery, _, io);\n",[40973],{"type":21,"tag":63,"props":40974,"children":40975},{"__ignoreMap":8},[40976,40983,40991,40998,41006,41013,41061,41085,41113,41120,41146,41163,41170,41177,41185,41192,41243,41273,41280,41287,41294,41302,41309,41357,41387,41411,41435,41443,41451,41458,41552,41560,41589,41597,41640,41648,41713,41785,41802,41809,41817,41843,41851,41894,41929,41941,41948,41979,41994,42005,42012,42040,42055,42062,42069,42077,42102,42109,42117,42142,42150,42162,42169,42176,42183,42191,42199,42207,42215,42236,42243,42284,42320,42388,42395,42402,42409,42417,42425,42433,42440,42480,42539,42546,42592,42624,42631,42665],{"type":21,"tag":209,"props":40977,"children":40978},{"class":211,"line":212},[40979],{"type":21,"tag":209,"props":40980,"children":40981},{"style":448},[40982],{"type":26,"value":731},{"type":21,"tag":209,"props":40984,"children":40985},{"class":211,"line":244},[40986],{"type":21,"tag":209,"props":40987,"children":40988},{"style":448},[40989],{"type":26,"value":40990}," * Copyright (c) Christopher Keefer. All Rights Reserved.\n",{"type":21,"tag":209,"props":40992,"children":40993},{"class":211,"line":254},[40994],{"type":21,"tag":209,"props":40995,"children":40996},{"style":448},[40997],{"type":26,"value":14974},{"type":21,"tag":209,"props":40999,"children":41000},{"class":211,"line":279},[41001],{"type":21,"tag":209,"props":41002,"children":41003},{"style":448},[41004],{"type":26,"value":41005}," * Overrides the default transport for Backbone syncing to use websockets via socket.io.\n",{"type":21,"tag":209,"props":41007,"children":41008},{"class":211,"line":288},[41009],{"type":21,"tag":209,"props":41010,"children":41011},{"style":448},[41012],{"type":26,"value":755},{"type":21,"tag":209,"props":41014,"children":41015},{"class":211,"line":307},[41016,41020,41024,41028,41032,41036,41040,41044,41048,41052,41057],{"type":21,"tag":209,"props":41017,"children":41018},{"style":222},[41019],{"type":26,"value":368},{"type":21,"tag":209,"props":41021,"children":41022},{"style":216},[41023],{"type":26,"value":5370},{"type":21,"tag":209,"props":41025,"children":41026},{"style":222},[41027],{"type":26,"value":368},{"type":21,"tag":209,"props":41029,"children":41030},{"style":400},[41031],{"type":26,"value":38277},{"type":21,"tag":209,"props":41033,"children":41034},{"style":222},[41035],{"type":26,"value":408},{"type":21,"tag":209,"props":41037,"children":41038},{"style":400},[41039],{"type":26,"value":10250},{"type":21,"tag":209,"props":41041,"children":41042},{"style":222},[41043],{"type":26,"value":408},{"type":21,"tag":209,"props":41045,"children":41046},{"style":400},[41047],{"type":26,"value":38639},{"type":21,"tag":209,"props":41049,"children":41050},{"style":222},[41051],{"type":26,"value":408},{"type":21,"tag":209,"props":41053,"children":41054},{"style":400},[41055],{"type":26,"value":41056},"io",{"type":21,"tag":209,"props":41058,"children":41059},{"style":222},[41060],{"type":26,"value":2369},{"type":21,"tag":209,"props":41062,"children":41063},{"class":211,"line":325},[41064,41068,41073,41077,41081],{"type":21,"tag":209,"props":41065,"children":41066},{"style":216},[41067],{"type":26,"value":10405},{"type":21,"tag":209,"props":41069,"children":41070},{"style":360},[41071],{"type":26,"value":41072}," urlError",{"type":21,"tag":209,"props":41074,"children":41075},{"style":216},[41076],{"type":26,"value":271},{"type":21,"tag":209,"props":41078,"children":41079},{"style":216},[41080],{"type":26,"value":4766},{"type":21,"tag":209,"props":41082,"children":41083},{"style":222},[41084],{"type":26,"value":2561},{"type":21,"tag":209,"props":41086,"children":41087},{"class":211,"line":334},[41088,41092,41096,41100,41104,41109],{"type":21,"tag":209,"props":41089,"children":41090},{"style":216},[41091],{"type":26,"value":15619},{"type":21,"tag":209,"props":41093,"children":41094},{"style":216},[41095],{"type":26,"value":4667},{"type":21,"tag":209,"props":41097,"children":41098},{"style":360},[41099],{"type":26,"value":18752},{"type":21,"tag":209,"props":41101,"children":41102},{"style":222},[41103],{"type":26,"value":368},{"type":21,"tag":209,"props":41105,"children":41106},{"style":233},[41107],{"type":26,"value":41108},"'A \"url\" property or function must be specified.'",{"type":21,"tag":209,"props":41110,"children":41111},{"style":222},[41112],{"type":26,"value":2608},{"type":21,"tag":209,"props":41114,"children":41115},{"class":211,"line":343},[41116],{"type":21,"tag":209,"props":41117,"children":41118},{"style":222},[41119],{"type":26,"value":2251},{"type":21,"tag":209,"props":41121,"children":41122},{"class":211,"line":351},[41123,41128,41132,41137,41141],{"type":21,"tag":209,"props":41124,"children":41125},{"style":222},[41126],{"type":26,"value":41127},"        eventEmit ",{"type":21,"tag":209,"props":41129,"children":41130},{"style":216},[41131],{"type":26,"value":1432},{"type":21,"tag":209,"props":41133,"children":41134},{"style":222},[41135],{"type":26,"value":41136}," io.EventEmitter.",{"type":21,"tag":209,"props":41138,"children":41139},{"style":263},[41140],{"type":26,"value":37016},{"type":21,"tag":209,"props":41142,"children":41143},{"style":222},[41144],{"type":26,"value":41145},".emit,\n",{"type":21,"tag":209,"props":41147,"children":41148},{"class":211,"line":444},[41149,41154,41158],{"type":21,"tag":209,"props":41150,"children":41151},{"style":222},[41152],{"type":26,"value":41153},"        ajaxSync ",{"type":21,"tag":209,"props":41155,"children":41156},{"style":216},[41157],{"type":26,"value":1432},{"type":21,"tag":209,"props":41159,"children":41160},{"style":222},[41161],{"type":26,"value":41162}," Backbone.sync;\n",{"type":21,"tag":209,"props":41164,"children":41165},{"class":211,"line":454},[41166],{"type":21,"tag":209,"props":41167,"children":41168},{"emptyLinePlaceholder":248},[41169],{"type":26,"value":251},{"type":21,"tag":209,"props":41171,"children":41172},{"class":211,"line":463},[41173],{"type":21,"tag":209,"props":41174,"children":41175},{"style":448},[41176],{"type":26,"value":4697},{"type":21,"tag":209,"props":41178,"children":41179},{"class":211,"line":472},[41180],{"type":21,"tag":209,"props":41181,"children":41182},{"style":448},[41183],{"type":26,"value":41184},"     * Preserve the standard, jquery ajax based persistance method as ajaxSync.\n",{"type":21,"tag":209,"props":41186,"children":41187},{"class":211,"line":480},[41188],{"type":21,"tag":209,"props":41189,"children":41190},{"style":448},[41191],{"type":26,"value":4753},{"type":21,"tag":209,"props":41193,"children":41194},{"class":211,"line":489},[41195,41200,41205,41209,41213,41217,41222,41226,41231,41235,41239],{"type":21,"tag":209,"props":41196,"children":41197},{"style":222},[41198],{"type":26,"value":41199},"    Backbone.",{"type":21,"tag":209,"props":41201,"children":41202},{"style":360},[41203],{"type":26,"value":41204},"ajaxSync",{"type":21,"tag":209,"props":41206,"children":41207},{"style":216},[41208],{"type":26,"value":271},{"type":21,"tag":209,"props":41210,"children":41211},{"style":216},[41212],{"type":26,"value":4766},{"type":21,"tag":209,"props":41214,"children":41215},{"style":222},[41216],{"type":26,"value":368},{"type":21,"tag":209,"props":41218,"children":41219},{"style":400},[41220],{"type":26,"value":41221},"method",{"type":21,"tag":209,"props":41223,"children":41224},{"style":222},[41225],{"type":26,"value":408},{"type":21,"tag":209,"props":41227,"children":41228},{"style":400},[41229],{"type":26,"value":41230},"model",{"type":21,"tag":209,"props":41232,"children":41233},{"style":222},[41234],{"type":26,"value":408},{"type":21,"tag":209,"props":41236,"children":41237},{"style":400},[41238],{"type":26,"value":29825},{"type":21,"tag":209,"props":41240,"children":41241},{"style":222},[41242],{"type":26,"value":2369},{"type":21,"tag":209,"props":41244,"children":41245},{"class":211,"line":847},[41246,41250,41255,41260,41264,41268],{"type":21,"tag":209,"props":41247,"children":41248},{"style":216},[41249],{"type":26,"value":3069},{"type":21,"tag":209,"props":41251,"children":41252},{"style":222},[41253],{"type":26,"value":41254}," ajaxSync.",{"type":21,"tag":209,"props":41256,"children":41257},{"style":360},[41258],{"type":26,"value":41259},"call",{"type":21,"tag":209,"props":41261,"children":41262},{"style":222},[41263],{"type":26,"value":368},{"type":21,"tag":209,"props":41265,"children":41266},{"style":263},[41267],{"type":26,"value":2508},{"type":21,"tag":209,"props":41269,"children":41270},{"style":222},[41271],{"type":26,"value":41272},", method, model, options);\n",{"type":21,"tag":209,"props":41274,"children":41275},{"class":211,"line":860},[41276],{"type":21,"tag":209,"props":41277,"children":41278},{"style":222},[41279],{"type":26,"value":4850},{"type":21,"tag":209,"props":41281,"children":41282},{"class":211,"line":877},[41283],{"type":21,"tag":209,"props":41284,"children":41285},{"emptyLinePlaceholder":248},[41286],{"type":26,"value":251},{"type":21,"tag":209,"props":41288,"children":41289},{"class":211,"line":889},[41290],{"type":21,"tag":209,"props":41291,"children":41292},{"style":448},[41293],{"type":26,"value":4697},{"type":21,"tag":209,"props":41295,"children":41296},{"class":211,"line":902},[41297],{"type":21,"tag":209,"props":41298,"children":41299},{"style":448},[41300],{"type":26,"value":41301},"     * Replace the standard sync function with our new, websocket/socket.io based solution.\n",{"type":21,"tag":209,"props":41303,"children":41304},{"class":211,"line":914},[41305],{"type":21,"tag":209,"props":41306,"children":41307},{"style":448},[41308],{"type":26,"value":4753},{"type":21,"tag":209,"props":41310,"children":41311},{"class":211,"line":922},[41312,41316,41321,41325,41329,41333,41337,41341,41345,41349,41353],{"type":21,"tag":209,"props":41313,"children":41314},{"style":222},[41315],{"type":26,"value":41199},{"type":21,"tag":209,"props":41317,"children":41318},{"style":360},[41319],{"type":26,"value":41320},"sync",{"type":21,"tag":209,"props":41322,"children":41323},{"style":216},[41324],{"type":26,"value":271},{"type":21,"tag":209,"props":41326,"children":41327},{"style":216},[41328],{"type":26,"value":4766},{"type":21,"tag":209,"props":41330,"children":41331},{"style":222},[41332],{"type":26,"value":368},{"type":21,"tag":209,"props":41334,"children":41335},{"style":400},[41336],{"type":26,"value":41221},{"type":21,"tag":209,"props":41338,"children":41339},{"style":222},[41340],{"type":26,"value":408},{"type":21,"tag":209,"props":41342,"children":41343},{"style":400},[41344],{"type":26,"value":41230},{"type":21,"tag":209,"props":41346,"children":41347},{"style":222},[41348],{"type":26,"value":408},{"type":21,"tag":209,"props":41350,"children":41351},{"style":400},[41352],{"type":26,"value":29825},{"type":21,"tag":209,"props":41354,"children":41355},{"style":222},[41356],{"type":26,"value":2369},{"type":21,"tag":209,"props":41358,"children":41359},{"class":211,"line":2312},[41360,41364,41369,41373,41378,41382],{"type":21,"tag":209,"props":41361,"children":41362},{"style":216},[41363],{"type":26,"value":5925},{"type":21,"tag":209,"props":41365,"children":41366},{"style":222},[41367],{"type":26,"value":41368}," opts ",{"type":21,"tag":209,"props":41370,"children":41371},{"style":216},[41372],{"type":26,"value":1432},{"type":21,"tag":209,"props":41374,"children":41375},{"style":222},[41376],{"type":26,"value":41377}," _.",{"type":21,"tag":209,"props":41379,"children":41380},{"style":360},[41381],{"type":26,"value":38684},{"type":21,"tag":209,"props":41383,"children":41384},{"style":222},[41385],{"type":26,"value":41386},"({}, options),\n",{"type":21,"tag":209,"props":41388,"children":41389},{"class":211,"line":2321},[41390,41395,41399,41403,41407],{"type":21,"tag":209,"props":41391,"children":41392},{"style":222},[41393],{"type":26,"value":41394},"            defer ",{"type":21,"tag":209,"props":41396,"children":41397},{"style":216},[41398],{"type":26,"value":1432},{"type":21,"tag":209,"props":41400,"children":41401},{"style":222},[41402],{"type":26,"value":26905},{"type":21,"tag":209,"props":41404,"children":41405},{"style":360},[41406],{"type":26,"value":26910},{"type":21,"tag":209,"props":41408,"children":41409},{"style":222},[41410],{"type":26,"value":5405},{"type":21,"tag":209,"props":41412,"children":41413},{"class":211,"line":2372},[41414,41419,41423,41427,41431],{"type":21,"tag":209,"props":41415,"children":41416},{"style":222},[41417],{"type":26,"value":41418},"            promise ",{"type":21,"tag":209,"props":41420,"children":41421},{"style":216},[41422],{"type":26,"value":1432},{"type":21,"tag":209,"props":41424,"children":41425},{"style":222},[41426],{"type":26,"value":28259},{"type":21,"tag":209,"props":41428,"children":41429},{"style":360},[41430],{"type":26,"value":27809},{"type":21,"tag":209,"props":41432,"children":41433},{"style":222},[41434],{"type":26,"value":5405},{"type":21,"tag":209,"props":41436,"children":41437},{"class":211,"line":2381},[41438],{"type":21,"tag":209,"props":41439,"children":41440},{"style":222},[41441],{"type":26,"value":41442},"            namespace,\n",{"type":21,"tag":209,"props":41444,"children":41445},{"class":211,"line":2389},[41446],{"type":21,"tag":209,"props":41447,"children":41448},{"style":222},[41449],{"type":26,"value":41450},"            socket;\n",{"type":21,"tag":209,"props":41452,"children":41453},{"class":211,"line":2397},[41454],{"type":21,"tag":209,"props":41455,"children":41456},{"emptyLinePlaceholder":248},[41457],{"type":26,"value":251},{"type":21,"tag":209,"props":41459,"children":41460},{"class":211,"line":2406},[41461,41466,41470,41475,41479,41483,41487,41492,41497,41501,41505,41510,41514,41518,41522,41527,41531,41535,41539,41544,41548],{"type":21,"tag":209,"props":41462,"children":41463},{"style":222},[41464],{"type":26,"value":41465},"        opts.url ",{"type":21,"tag":209,"props":41467,"children":41468},{"style":216},[41469],{"type":26,"value":1432},{"type":21,"tag":209,"props":41471,"children":41472},{"style":222},[41473],{"type":26,"value":41474}," (opts.url) ",{"type":21,"tag":209,"props":41476,"children":41477},{"style":216},[41478],{"type":26,"value":15218},{"type":21,"tag":209,"props":41480,"children":41481},{"style":222},[41482],{"type":26,"value":41377},{"type":21,"tag":209,"props":41484,"children":41485},{"style":360},[41486],{"type":26,"value":32249},{"type":21,"tag":209,"props":41488,"children":41489},{"style":222},[41490],{"type":26,"value":41491},"(opts, ",{"type":21,"tag":209,"props":41493,"children":41494},{"style":233},[41495],{"type":26,"value":41496},"'url'",{"type":21,"tag":209,"props":41498,"children":41499},{"style":222},[41500],{"type":26,"value":432},{"type":21,"tag":209,"props":41502,"children":41503},{"style":216},[41504],{"type":26,"value":191},{"type":21,"tag":209,"props":41506,"children":41507},{"style":222},[41508],{"type":26,"value":41509}," (model.url) ",{"type":21,"tag":209,"props":41511,"children":41512},{"style":216},[41513],{"type":26,"value":15218},{"type":21,"tag":209,"props":41515,"children":41516},{"style":222},[41517],{"type":26,"value":41377},{"type":21,"tag":209,"props":41519,"children":41520},{"style":360},[41521],{"type":26,"value":32249},{"type":21,"tag":209,"props":41523,"children":41524},{"style":222},[41525],{"type":26,"value":41526},"(model, ",{"type":21,"tag":209,"props":41528,"children":41529},{"style":233},[41530],{"type":26,"value":41496},{"type":21,"tag":209,"props":41532,"children":41533},{"style":222},[41534],{"type":26,"value":432},{"type":21,"tag":209,"props":41536,"children":41537},{"style":216},[41538],{"type":26,"value":191},{"type":21,"tag":209,"props":41540,"children":41541},{"style":216},[41542],{"type":26,"value":41543}," void",{"type":21,"tag":209,"props":41545,"children":41546},{"style":263},[41547],{"type":26,"value":17197},{"type":21,"tag":209,"props":41549,"children":41550},{"style":222},[41551],{"type":26,"value":241},{"type":21,"tag":209,"props":41553,"children":41554},{"class":211,"line":2415},[41555],{"type":21,"tag":209,"props":41556,"children":41557},{"style":448},[41558],{"type":26,"value":41559},"        // If no url property has been specified, throw an error, as per the standard Backbone sync\n",{"type":21,"tag":209,"props":41561,"children":41562},{"class":211,"line":2424},[41563,41567,41571,41575,41580,41585],{"type":21,"tag":209,"props":41564,"children":41565},{"style":216},[41566],{"type":26,"value":5803},{"type":21,"tag":209,"props":41568,"children":41569},{"style":222},[41570],{"type":26,"value":4776},{"type":21,"tag":209,"props":41572,"children":41573},{"style":216},[41574],{"type":26,"value":15052},{"type":21,"tag":209,"props":41576,"children":41577},{"style":222},[41578],{"type":26,"value":41579},"opts.url) ",{"type":21,"tag":209,"props":41581,"children":41582},{"style":360},[41583],{"type":26,"value":41584},"urlError",{"type":21,"tag":209,"props":41586,"children":41587},{"style":222},[41588],{"type":26,"value":4842},{"type":21,"tag":209,"props":41590,"children":41591},{"class":211,"line":2433},[41592],{"type":21,"tag":209,"props":41593,"children":41594},{"style":448},[41595],{"type":26,"value":41596},"        // Transform the url into a namespace\n",{"type":21,"tag":209,"props":41598,"children":41599},{"class":211,"line":2442},[41600,41605,41609,41614,41618,41623,41627,41631,41635],{"type":21,"tag":209,"props":41601,"children":41602},{"style":222},[41603],{"type":26,"value":41604},"        namespace ",{"type":21,"tag":209,"props":41606,"children":41607},{"style":216},[41608],{"type":26,"value":1432},{"type":21,"tag":209,"props":41610,"children":41611},{"style":222},[41612],{"type":26,"value":41613}," Backbone.Model.",{"type":21,"tag":209,"props":41615,"children":41616},{"style":263},[41617],{"type":26,"value":37016},{"type":21,"tag":209,"props":41619,"children":41620},{"style":222},[41621],{"type":26,"value":41622},".namespace.",{"type":21,"tag":209,"props":41624,"children":41625},{"style":360},[41626],{"type":26,"value":41259},{"type":21,"tag":209,"props":41628,"children":41629},{"style":222},[41630],{"type":26,"value":368},{"type":21,"tag":209,"props":41632,"children":41633},{"style":263},[41634],{"type":26,"value":2508},{"type":21,"tag":209,"props":41636,"children":41637},{"style":222},[41638],{"type":26,"value":41639},", opts.url);\n",{"type":21,"tag":209,"props":41641,"children":41642},{"class":211,"line":2471},[41643],{"type":21,"tag":209,"props":41644,"children":41645},{"style":448},[41646],{"type":26,"value":41647},"        // Determine what data we're sending, and ensure id is present if we're performing a PATCH call\n",{"type":21,"tag":209,"props":41649,"children":41650},{"class":211,"line":2480},[41651,41655,41659,41663,41668,41672,41677,41681,41686,41690,41695,41700,41705,41709],{"type":21,"tag":209,"props":41652,"children":41653},{"style":216},[41654],{"type":26,"value":5803},{"type":21,"tag":209,"props":41656,"children":41657},{"style":222},[41658],{"type":26,"value":4776},{"type":21,"tag":209,"props":41660,"children":41661},{"style":216},[41662],{"type":26,"value":15052},{"type":21,"tag":209,"props":41664,"children":41665},{"style":222},[41666],{"type":26,"value":41667},"opts.data ",{"type":21,"tag":209,"props":41669,"children":41670},{"style":216},[41671],{"type":26,"value":15578},{"type":21,"tag":209,"props":41673,"children":41674},{"style":222},[41675],{"type":26,"value":41676}," model) opts.data ",{"type":21,"tag":209,"props":41678,"children":41679},{"style":216},[41680],{"type":26,"value":1432},{"type":21,"tag":209,"props":41682,"children":41683},{"style":222},[41684],{"type":26,"value":41685}," opts.attrs ",{"type":21,"tag":209,"props":41687,"children":41688},{"style":216},[41689],{"type":26,"value":4677},{"type":21,"tag":209,"props":41691,"children":41692},{"style":222},[41693],{"type":26,"value":41694}," model.",{"type":21,"tag":209,"props":41696,"children":41697},{"style":360},[41698],{"type":26,"value":41699},"toJSON",{"type":21,"tag":209,"props":41701,"children":41702},{"style":222},[41703],{"type":26,"value":41704},"(options) ",{"type":21,"tag":209,"props":41706,"children":41707},{"style":216},[41708],{"type":26,"value":4677},{"type":21,"tag":209,"props":41710,"children":41711},{"style":222},[41712],{"type":26,"value":32274},{"type":21,"tag":209,"props":41714,"children":41715},{"class":211,"line":2489},[41716,41720,41725,41729,41734,41738,41743,41747,41751,41755,41759,41763,41768,41772,41776,41780],{"type":21,"tag":209,"props":41717,"children":41718},{"style":216},[41719],{"type":26,"value":5803},{"type":21,"tag":209,"props":41721,"children":41722},{"style":222},[41723],{"type":26,"value":41724}," ((opts.data.id ",{"type":21,"tag":209,"props":41726,"children":41727},{"style":216},[41728],{"type":26,"value":6102},{"type":21,"tag":209,"props":41730,"children":41731},{"style":263},[41732],{"type":26,"value":41733}," null",{"type":21,"tag":209,"props":41735,"children":41736},{"style":216},[41737],{"type":26,"value":18721},{"type":21,"tag":209,"props":41739,"children":41740},{"style":222},[41741],{"type":26,"value":41742}," opts.data.id ",{"type":21,"tag":209,"props":41744,"children":41745},{"style":216},[41746],{"type":26,"value":6102},{"type":21,"tag":209,"props":41748,"children":41749},{"style":216},[41750],{"type":26,"value":41543},{"type":21,"tag":209,"props":41752,"children":41753},{"style":263},[41754],{"type":26,"value":17197},{"type":21,"tag":209,"props":41756,"children":41757},{"style":222},[41758],{"type":26,"value":432},{"type":21,"tag":209,"props":41760,"children":41761},{"style":216},[41762],{"type":26,"value":15578},{"type":21,"tag":209,"props":41764,"children":41765},{"style":222},[41766],{"type":26,"value":41767}," opts.patch ",{"type":21,"tag":209,"props":41769,"children":41770},{"style":216},[41771],{"type":26,"value":6102},{"type":21,"tag":209,"props":41773,"children":41774},{"style":263},[41775],{"type":26,"value":6243},{"type":21,"tag":209,"props":41777,"children":41778},{"style":216},[41779],{"type":26,"value":15539},{"type":21,"tag":209,"props":41781,"children":41782},{"style":222},[41783],{"type":26,"value":41784}," model){\n",{"type":21,"tag":209,"props":41786,"children":41787},{"class":211,"line":2516},[41788,41793,41797],{"type":21,"tag":209,"props":41789,"children":41790},{"style":222},[41791],{"type":26,"value":41792},"            opts.data.id ",{"type":21,"tag":209,"props":41794,"children":41795},{"style":216},[41796],{"type":26,"value":1432},{"type":21,"tag":209,"props":41798,"children":41799},{"style":222},[41800],{"type":26,"value":41801}," model.id;\n",{"type":21,"tag":209,"props":41803,"children":41804},{"class":211,"line":2525},[41805],{"type":21,"tag":209,"props":41806,"children":41807},{"style":222},[41808],{"type":26,"value":2235},{"type":21,"tag":209,"props":41810,"children":41811},{"class":211,"line":2533},[41812],{"type":21,"tag":209,"props":41813,"children":41814},{"style":448},[41815],{"type":26,"value":41816},"        // Determine which websocket to use - set in options or on model\n",{"type":21,"tag":209,"props":41818,"children":41819},{"class":211,"line":2542},[41820,41825,41829,41834,41838],{"type":21,"tag":209,"props":41821,"children":41822},{"style":222},[41823],{"type":26,"value":41824},"        socket ",{"type":21,"tag":209,"props":41826,"children":41827},{"style":216},[41828],{"type":26,"value":1432},{"type":21,"tag":209,"props":41830,"children":41831},{"style":222},[41832],{"type":26,"value":41833}," opts.socket ",{"type":21,"tag":209,"props":41835,"children":41836},{"style":216},[41837],{"type":26,"value":4677},{"type":21,"tag":209,"props":41839,"children":41840},{"style":222},[41841],{"type":26,"value":41842}," model.socket;\n",{"type":21,"tag":209,"props":41844,"children":41845},{"class":211,"line":2550},[41846],{"type":21,"tag":209,"props":41847,"children":41848},{"style":448},[41849],{"type":26,"value":41850},"        // Add a listener for our namespaced method, and resolve or reject our deferred based on the response\n",{"type":21,"tag":209,"props":41852,"children":41853},{"class":211,"line":2564},[41854,41859,41864,41869,41873,41878,41882,41886,41890],{"type":21,"tag":209,"props":41855,"children":41856},{"style":222},[41857],{"type":26,"value":41858},"        socket.",{"type":21,"tag":209,"props":41860,"children":41861},{"style":360},[41862],{"type":26,"value":41863},"once",{"type":21,"tag":209,"props":41865,"children":41866},{"style":222},[41867],{"type":26,"value":41868},"(namespace",{"type":21,"tag":209,"props":41870,"children":41871},{"style":216},[41872],{"type":26,"value":10237},{"type":21,"tag":209,"props":41874,"children":41875},{"style":222},[41876],{"type":26,"value":41877},"method, ",{"type":21,"tag":209,"props":41879,"children":41880},{"style":216},[41881],{"type":26,"value":5370},{"type":21,"tag":209,"props":41883,"children":41884},{"style":222},[41885],{"type":26,"value":368},{"type":21,"tag":209,"props":41887,"children":41888},{"style":400},[41889],{"type":26,"value":1385},{"type":21,"tag":209,"props":41891,"children":41892},{"style":222},[41893],{"type":26,"value":2369},{"type":21,"tag":209,"props":41895,"children":41896},{"class":211,"line":2611},[41897,41901,41906,41910,41915,41919,41924],{"type":21,"tag":209,"props":41898,"children":41899},{"style":216},[41900],{"type":26,"value":5959},{"type":21,"tag":209,"props":41902,"children":41903},{"style":222},[41904],{"type":26,"value":41905}," success ",{"type":21,"tag":209,"props":41907,"children":41908},{"style":216},[41909],{"type":26,"value":1432},{"type":21,"tag":209,"props":41911,"children":41912},{"style":222},[41913],{"type":26,"value":41914}," (res ",{"type":21,"tag":209,"props":41916,"children":41917},{"style":216},[41918],{"type":26,"value":15578},{"type":21,"tag":209,"props":41920,"children":41921},{"style":222},[41922],{"type":26,"value":41923}," res.success); ",{"type":21,"tag":209,"props":41925,"children":41926},{"style":448},[41927],{"type":26,"value":41928},"// Expects server json response to contain a boolean 'success' field\n",{"type":21,"tag":209,"props":41930,"children":41931},{"class":211,"line":2619},[41932,41936],{"type":21,"tag":209,"props":41933,"children":41934},{"style":216},[41935],{"type":26,"value":6083},{"type":21,"tag":209,"props":41937,"children":41938},{"style":222},[41939],{"type":26,"value":41940}," (success)\n",{"type":21,"tag":209,"props":41942,"children":41943},{"class":211,"line":2627},[41944],{"type":21,"tag":209,"props":41945,"children":41946},{"style":222},[41947],{"type":26,"value":16576},{"type":21,"tag":209,"props":41949,"children":41950},{"class":211,"line":2636},[41951,41956,41961,41966,41971,41975],{"type":21,"tag":209,"props":41952,"children":41953},{"style":216},[41954],{"type":26,"value":41955},"                if",{"type":21,"tag":209,"props":41957,"children":41958},{"style":222},[41959],{"type":26,"value":41960}," (_.",{"type":21,"tag":209,"props":41962,"children":41963},{"style":360},[41964],{"type":26,"value":41965},"isFunction",{"type":21,"tag":209,"props":41967,"children":41968},{"style":222},[41969],{"type":26,"value":41970},"(options.success)) options.",{"type":21,"tag":209,"props":41972,"children":41973},{"style":360},[41974],{"type":26,"value":31639},{"type":21,"tag":209,"props":41976,"children":41977},{"style":222},[41978],{"type":26,"value":25195},{"type":21,"tag":209,"props":41980,"children":41981},{"class":211,"line":2644},[41982,41986,41990],{"type":21,"tag":209,"props":41983,"children":41984},{"style":222},[41985],{"type":26,"value":28462},{"type":21,"tag":209,"props":41987,"children":41988},{"style":360},[41989],{"type":26,"value":5590},{"type":21,"tag":209,"props":41991,"children":41992},{"style":222},[41993],{"type":26,"value":25195},{"type":21,"tag":209,"props":41995,"children":41996},{"class":211,"line":2657},[41997,42001],{"type":21,"tag":209,"props":41998,"children":41999},{"style":216},[42000],{"type":26,"value":5653},{"type":21,"tag":209,"props":42002,"children":42003},{"style":222},[42004],{"type":26,"value":241},{"type":21,"tag":209,"props":42006,"children":42007},{"class":211,"line":2728},[42008],{"type":21,"tag":209,"props":42009,"children":42010},{"style":222},[42011],{"type":26,"value":6136},{"type":21,"tag":209,"props":42013,"children":42014},{"class":211,"line":2758},[42015,42019,42023,42027,42032,42036],{"type":21,"tag":209,"props":42016,"children":42017},{"style":216},[42018],{"type":26,"value":6083},{"type":21,"tag":209,"props":42020,"children":42021},{"style":222},[42022],{"type":26,"value":41960},{"type":21,"tag":209,"props":42024,"children":42025},{"style":360},[42026],{"type":26,"value":41965},{"type":21,"tag":209,"props":42028,"children":42029},{"style":222},[42030],{"type":26,"value":42031},"(options.error)) options.",{"type":21,"tag":209,"props":42033,"children":42034},{"style":360},[42035],{"type":26,"value":10685},{"type":21,"tag":209,"props":42037,"children":42038},{"style":222},[42039],{"type":26,"value":25195},{"type":21,"tag":209,"props":42041,"children":42042},{"class":211,"line":2776},[42043,42047,42051],{"type":21,"tag":209,"props":42044,"children":42045},{"style":222},[42046],{"type":26,"value":30916},{"type":21,"tag":209,"props":42048,"children":42049},{"style":360},[42050],{"type":26,"value":5599},{"type":21,"tag":209,"props":42052,"children":42053},{"style":222},[42054],{"type":26,"value":25195},{"type":21,"tag":209,"props":42056,"children":42057},{"class":211,"line":2785},[42058],{"type":21,"tag":209,"props":42059,"children":42060},{"style":222},[42061],{"type":26,"value":5114},{"type":21,"tag":209,"props":42063,"children":42064},{"class":211,"line":2793},[42065],{"type":21,"tag":209,"props":42066,"children":42067},{"emptyLinePlaceholder":248},[42068],{"type":26,"value":251},{"type":21,"tag":209,"props":42070,"children":42071},{"class":211,"line":2801},[42072],{"type":21,"tag":209,"props":42073,"children":42074},{"style":448},[42075],{"type":26,"value":42076},"        // Emit our namespaced method and the model+opts data\n",{"type":21,"tag":209,"props":42078,"children":42079},{"class":211,"line":2809},[42080,42084,42089,42093,42097],{"type":21,"tag":209,"props":42081,"children":42082},{"style":222},[42083],{"type":26,"value":41858},{"type":21,"tag":209,"props":42085,"children":42086},{"style":360},[42087],{"type":26,"value":42088},"emit",{"type":21,"tag":209,"props":42090,"children":42091},{"style":222},[42092],{"type":26,"value":41868},{"type":21,"tag":209,"props":42094,"children":42095},{"style":216},[42096],{"type":26,"value":10237},{"type":21,"tag":209,"props":42098,"children":42099},{"style":222},[42100],{"type":26,"value":42101},"method, opts.data);\n",{"type":21,"tag":209,"props":42103,"children":42104},{"class":211,"line":6219},[42105],{"type":21,"tag":209,"props":42106,"children":42107},{"emptyLinePlaceholder":248},[42108],{"type":26,"value":251},{"type":21,"tag":209,"props":42110,"children":42111},{"class":211,"line":6228},[42112],{"type":21,"tag":209,"props":42113,"children":42114},{"style":448},[42115],{"type":26,"value":42116},"        // Trigger the request event on the model, as per backbone spec\n",{"type":21,"tag":209,"props":42118,"children":42119},{"class":211,"line":6250},[42120,42125,42129,42133,42137],{"type":21,"tag":209,"props":42121,"children":42122},{"style":222},[42123],{"type":26,"value":42124},"        model.",{"type":21,"tag":209,"props":42126,"children":42127},{"style":360},[42128],{"type":26,"value":499},{"type":21,"tag":209,"props":42130,"children":42131},{"style":222},[42132],{"type":26,"value":368},{"type":21,"tag":209,"props":42134,"children":42135},{"style":233},[42136],{"type":26,"value":35705},{"type":21,"tag":209,"props":42138,"children":42139},{"style":222},[42140],{"type":26,"value":42141},", model, promise, opts);\n",{"type":21,"tag":209,"props":42143,"children":42144},{"class":211,"line":6258},[42145],{"type":21,"tag":209,"props":42146,"children":42147},{"style":448},[42148],{"type":26,"value":42149},"        // Return the promise for us to use as per usual (hanging .done blocks off, add to a .when, etc.)\n",{"type":21,"tag":209,"props":42151,"children":42152},{"class":211,"line":6267},[42153,42157],{"type":21,"tag":209,"props":42154,"children":42155},{"style":216},[42156],{"type":26,"value":3069},{"type":21,"tag":209,"props":42158,"children":42159},{"style":222},[42160],{"type":26,"value":42161}," promise;\n",{"type":21,"tag":209,"props":42163,"children":42164},{"class":211,"line":6303},[42165],{"type":21,"tag":209,"props":42166,"children":42167},{"style":222},[42168],{"type":26,"value":4850},{"type":21,"tag":209,"props":42170,"children":42171},{"class":211,"line":6336},[42172],{"type":21,"tag":209,"props":42173,"children":42174},{"emptyLinePlaceholder":248},[42175],{"type":26,"value":251},{"type":21,"tag":209,"props":42177,"children":42178},{"class":211,"line":6369},[42179],{"type":21,"tag":209,"props":42180,"children":42181},{"style":448},[42182],{"type":26,"value":4697},{"type":21,"tag":209,"props":42184,"children":42185},{"class":211,"line":6378},[42186],{"type":21,"tag":209,"props":42187,"children":42188},{"style":448},[42189],{"type":26,"value":42190},"     * Break url apart to create namespace - every '/' save any pre/post-fixing the url will become a ':' indicating\n",{"type":21,"tag":209,"props":42192,"children":42193},{"class":211,"line":6387},[42194],{"type":21,"tag":209,"props":42195,"children":42196},{"style":448},[42197],{"type":26,"value":42198},"     * namespace - so a collection that maps to /api/posts will now have its events on the namespace\n",{"type":21,"tag":209,"props":42200,"children":42201},{"class":211,"line":6395},[42202],{"type":21,"tag":209,"props":42203,"children":42204},{"style":448},[42205],{"type":26,"value":42206},"     * api:posts: (ie. api:posts:create, api:posts:delete, etc.), and a model that maps to /api/posts/21\n",{"type":21,"tag":209,"props":42208,"children":42209},{"class":211,"line":6404},[42210],{"type":21,"tag":209,"props":42211,"children":42212},{"style":448},[42213],{"type":26,"value":42214},"     * will have events on api:posts:21: (ie. api:posts:21:update, api:posts:21:patch, etc.)\n",{"type":21,"tag":209,"props":42216,"children":42217},{"class":211,"line":6413},[42218,42222,42226,42231],{"type":21,"tag":209,"props":42219,"children":42220},{"style":448},[42221],{"type":26,"value":4713},{"type":21,"tag":209,"props":42223,"children":42224},{"style":216},[42225],{"type":26,"value":4718},{"type":21,"tag":209,"props":42227,"children":42228},{"style":360},[42229],{"type":26,"value":42230}," {string=}",{"type":21,"tag":209,"props":42232,"children":42233},{"style":222},[42234],{"type":26,"value":42235}," url\n",{"type":21,"tag":209,"props":42237,"children":42238},{"class":211,"line":6447},[42239],{"type":21,"tag":209,"props":42240,"children":42241},{"style":448},[42242],{"type":26,"value":4753},{"type":21,"tag":209,"props":42244,"children":42245},{"class":211,"line":6479},[42246,42251,42255,42259,42264,42268,42272,42276,42280],{"type":21,"tag":209,"props":42247,"children":42248},{"style":222},[42249],{"type":26,"value":42250},"    Backbone.Model.",{"type":21,"tag":209,"props":42252,"children":42253},{"style":263},[42254],{"type":26,"value":37016},{"type":21,"tag":209,"props":42256,"children":42257},{"style":222},[42258],{"type":26,"value":378},{"type":21,"tag":209,"props":42260,"children":42261},{"style":360},[42262],{"type":26,"value":42263},"namespace",{"type":21,"tag":209,"props":42265,"children":42266},{"style":216},[42267],{"type":26,"value":271},{"type":21,"tag":209,"props":42269,"children":42270},{"style":216},[42271],{"type":26,"value":4766},{"type":21,"tag":209,"props":42273,"children":42274},{"style":222},[42275],{"type":26,"value":368},{"type":21,"tag":209,"props":42277,"children":42278},{"style":400},[42279],{"type":26,"value":15147},{"type":21,"tag":209,"props":42281,"children":42282},{"style":222},[42283],{"type":26,"value":2369},{"type":21,"tag":209,"props":42285,"children":42286},{"class":211,"line":6511},[42287,42292,42296,42300,42304,42308,42312,42316],{"type":21,"tag":209,"props":42288,"children":42289},{"style":222},[42290],{"type":26,"value":42291},"        url ",{"type":21,"tag":209,"props":42293,"children":42294},{"style":216},[42295],{"type":26,"value":1432},{"type":21,"tag":209,"props":42297,"children":42298},{"style":222},[42299],{"type":26,"value":15277},{"type":21,"tag":209,"props":42301,"children":42302},{"style":216},[42303],{"type":26,"value":4677},{"type":21,"tag":209,"props":42305,"children":42306},{"style":263},[42307],{"type":26,"value":17698},{"type":21,"tag":209,"props":42309,"children":42310},{"style":222},[42311],{"type":26,"value":378},{"type":21,"tag":209,"props":42313,"children":42314},{"style":360},[42315],{"type":26,"value":15147},{"type":21,"tag":209,"props":42317,"children":42318},{"style":222},[42319],{"type":26,"value":4842},{"type":21,"tag":209,"props":42321,"children":42322},{"class":211,"line":6519},[42323,42327,42331,42336,42341,42346,42350,42354,42358,42362,42366,42371,42375,42379,42384],{"type":21,"tag":209,"props":42324,"children":42325},{"style":216},[42326],{"type":26,"value":3069},{"type":21,"tag":209,"props":42328,"children":42329},{"style":222},[42330],{"type":26,"value":41377},{"type":21,"tag":209,"props":42332,"children":42333},{"style":360},[42334],{"type":26,"value":42335},"trim",{"type":21,"tag":209,"props":42337,"children":42338},{"style":222},[42339],{"type":26,"value":42340},"(url, ",{"type":21,"tag":209,"props":42342,"children":42343},{"style":233},[42344],{"type":26,"value":42345},"'/'",{"type":21,"tag":209,"props":42347,"children":42348},{"style":222},[42349],{"type":26,"value":2699},{"type":21,"tag":209,"props":42351,"children":42352},{"style":360},[42353],{"type":26,"value":29854},{"type":21,"tag":209,"props":42355,"children":42356},{"style":222},[42357],{"type":26,"value":368},{"type":21,"tag":209,"props":42359,"children":42360},{"style":233},[42361],{"type":26,"value":42345},{"type":21,"tag":209,"props":42363,"children":42364},{"style":222},[42365],{"type":26,"value":408},{"type":21,"tag":209,"props":42367,"children":42368},{"style":233},[42369],{"type":26,"value":42370},"':'",{"type":21,"tag":209,"props":42372,"children":42373},{"style":222},[42374],{"type":26,"value":432},{"type":21,"tag":209,"props":42376,"children":42377},{"style":216},[42378],{"type":26,"value":10237},{"type":21,"tag":209,"props":42380,"children":42381},{"style":233},[42382],{"type":26,"value":42383}," \":\"",{"type":21,"tag":209,"props":42385,"children":42386},{"style":222},[42387],{"type":26,"value":241},{"type":21,"tag":209,"props":42389,"children":42390},{"class":211,"line":6527},[42391],{"type":21,"tag":209,"props":42392,"children":42393},{"style":222},[42394],{"type":26,"value":4850},{"type":21,"tag":209,"props":42396,"children":42397},{"class":211,"line":6535},[42398],{"type":21,"tag":209,"props":42399,"children":42400},{"emptyLinePlaceholder":248},[42401],{"type":26,"value":251},{"type":21,"tag":209,"props":42403,"children":42404},{"class":211,"line":6543},[42405],{"type":21,"tag":209,"props":42406,"children":42407},{"style":448},[42408],{"type":26,"value":4697},{"type":21,"tag":209,"props":42410,"children":42411},{"class":211,"line":6552},[42412],{"type":21,"tag":209,"props":42413,"children":42414},{"style":448},[42415],{"type":26,"value":42416},"     * Override EventEmitter.emit and SocketNamespace reference for socket.io to add a catch all case for the\n",{"type":21,"tag":209,"props":42418,"children":42419},{"class":211,"line":6572},[42420],{"type":21,"tag":209,"props":42421,"children":42422},{"style":448},[42423],{"type":26,"value":42424},"     * wildcard ('*') character. Now, socket.on('*') will catch any event, with the name of the caught event\n",{"type":21,"tag":209,"props":42426,"children":42427},{"class":211,"line":6589},[42428],{"type":21,"tag":209,"props":42429,"children":42430},{"style":448},[42431],{"type":26,"value":42432},"     * passed to the handler as the first argument.\n",{"type":21,"tag":209,"props":42434,"children":42435},{"class":211,"line":6597},[42436],{"type":21,"tag":209,"props":42437,"children":42438},{"style":448},[42439],{"type":26,"value":14136},{"type":21,"tag":209,"props":42441,"children":42442},{"class":211,"line":6625},[42443,42448,42452,42456,42460,42464,42468,42472,42476],{"type":21,"tag":209,"props":42444,"children":42445},{"style":222},[42446],{"type":26,"value":42447},"    io.EventEmitter.",{"type":21,"tag":209,"props":42449,"children":42450},{"style":263},[42451],{"type":26,"value":37016},{"type":21,"tag":209,"props":42453,"children":42454},{"style":222},[42455],{"type":26,"value":378},{"type":21,"tag":209,"props":42457,"children":42458},{"style":360},[42459],{"type":26,"value":42088},{"type":21,"tag":209,"props":42461,"children":42462},{"style":216},[42463],{"type":26,"value":271},{"type":21,"tag":209,"props":42465,"children":42466},{"style":216},[42467],{"type":26,"value":4766},{"type":21,"tag":209,"props":42469,"children":42470},{"style":222},[42471],{"type":26,"value":368},{"type":21,"tag":209,"props":42473,"children":42474},{"style":400},[42475],{"type":26,"value":7820},{"type":21,"tag":209,"props":42477,"children":42478},{"style":222},[42479],{"type":26,"value":2369},{"type":21,"tag":209,"props":42481,"children":42482},{"class":211,"line":6648},[42483,42487,42492,42496,42501,42505,42509,42514,42518,42522,42527,42531,42535],{"type":21,"tag":209,"props":42484,"children":42485},{"style":216},[42486],{"type":26,"value":5925},{"type":21,"tag":209,"props":42488,"children":42489},{"style":222},[42490],{"type":26,"value":42491}," args ",{"type":21,"tag":209,"props":42493,"children":42494},{"style":216},[42495],{"type":26,"value":1432},{"type":21,"tag":209,"props":42497,"children":42498},{"style":263},[42499],{"type":26,"value":42500}," Array",{"type":21,"tag":209,"props":42502,"children":42503},{"style":222},[42504],{"type":26,"value":378},{"type":21,"tag":209,"props":42506,"children":42507},{"style":263},[42508],{"type":26,"value":37016},{"type":21,"tag":209,"props":42510,"children":42511},{"style":222},[42512],{"type":26,"value":42513},".slice.",{"type":21,"tag":209,"props":42515,"children":42516},{"style":360},[42517],{"type":26,"value":41259},{"type":21,"tag":209,"props":42519,"children":42520},{"style":222},[42521],{"type":26,"value":368},{"type":21,"tag":209,"props":42523,"children":42524},{"style":263},[42525],{"type":26,"value":42526},"arguments",{"type":21,"tag":209,"props":42528,"children":42529},{"style":222},[42530],{"type":26,"value":408},{"type":21,"tag":209,"props":42532,"children":42533},{"style":263},[42534],{"type":26,"value":3224},{"type":21,"tag":209,"props":42536,"children":42537},{"style":222},[42538],{"type":26,"value":2608},{"type":21,"tag":209,"props":42540,"children":42541},{"class":211,"line":6670},[42542],{"type":21,"tag":209,"props":42543,"children":42544},{"emptyLinePlaceholder":248},[42545],{"type":26,"value":251},{"type":21,"tag":209,"props":42547,"children":42548},{"class":211,"line":6678},[42549,42554,42559,42563,42567,42572,42577,42582,42587],{"type":21,"tag":209,"props":42550,"children":42551},{"style":222},[42552],{"type":26,"value":42553},"        eventEmit.",{"type":21,"tag":209,"props":42555,"children":42556},{"style":360},[42557],{"type":26,"value":42558},"apply",{"type":21,"tag":209,"props":42560,"children":42561},{"style":222},[42562],{"type":26,"value":368},{"type":21,"tag":209,"props":42564,"children":42565},{"style":263},[42566],{"type":26,"value":2508},{"type":21,"tag":209,"props":42568,"children":42569},{"style":222},[42570],{"type":26,"value":42571},", [",{"type":21,"tag":209,"props":42573,"children":42574},{"style":233},[42575],{"type":26,"value":42576},"'*'",{"type":21,"tag":209,"props":42578,"children":42579},{"style":222},[42580],{"type":26,"value":42581},", name].",{"type":21,"tag":209,"props":42583,"children":42584},{"style":360},[42585],{"type":26,"value":42586},"concat",{"type":21,"tag":209,"props":42588,"children":42589},{"style":222},[42590],{"type":26,"value":42591},"(args));\n",{"type":21,"tag":209,"props":42593,"children":42594},{"class":211,"line":6686},[42595,42599,42603,42607,42611,42616,42620],{"type":21,"tag":209,"props":42596,"children":42597},{"style":222},[42598],{"type":26,"value":42553},{"type":21,"tag":209,"props":42600,"children":42601},{"style":360},[42602],{"type":26,"value":42558},{"type":21,"tag":209,"props":42604,"children":42605},{"style":222},[42606],{"type":26,"value":368},{"type":21,"tag":209,"props":42608,"children":42609},{"style":263},[42610],{"type":26,"value":2508},{"type":21,"tag":209,"props":42612,"children":42613},{"style":222},[42614],{"type":26,"value":42615},", [name].",{"type":21,"tag":209,"props":42617,"children":42618},{"style":360},[42619],{"type":26,"value":42586},{"type":21,"tag":209,"props":42621,"children":42622},{"style":222},[42623],{"type":26,"value":42591},{"type":21,"tag":209,"props":42625,"children":42626},{"class":211,"line":6714},[42627],{"type":21,"tag":209,"props":42628,"children":42629},{"style":222},[42630],{"type":26,"value":4850},{"type":21,"tag":209,"props":42632,"children":42633},{"class":211,"line":6747},[42634,42639,42643,42648,42652,42656,42660],{"type":21,"tag":209,"props":42635,"children":42636},{"style":222},[42637],{"type":26,"value":42638},"    io.SocketNamespace.",{"type":21,"tag":209,"props":42640,"children":42641},{"style":263},[42642],{"type":26,"value":37016},{"type":21,"tag":209,"props":42644,"children":42645},{"style":222},[42646],{"type":26,"value":42647},".$emit ",{"type":21,"tag":209,"props":42649,"children":42650},{"style":216},[42651],{"type":26,"value":1432},{"type":21,"tag":209,"props":42653,"children":42654},{"style":222},[42655],{"type":26,"value":41136},{"type":21,"tag":209,"props":42657,"children":42658},{"style":263},[42659],{"type":26,"value":37016},{"type":21,"tag":209,"props":42661,"children":42662},{"style":222},[42663],{"type":26,"value":42664},".emit;\n",{"type":21,"tag":209,"props":42666,"children":42667},{"class":211,"line":6761},[42668],{"type":21,"tag":209,"props":42669,"children":42670},{"style":222},[42671],{"type":26,"value":42672},"})(Backbone, jQuery, _, io);\n",{"type":21,"tag":22,"props":42674,"children":42675},{},[42676],{"type":26,"value":42677},"So, let's start at the top (and the very bottom).",{"type":21,"tag":200,"props":42679,"children":42681},{"className":9044,"code":42680,"language":9046,"meta":8,"style":8},"(function(Backbone, $, _, io){\n    var urlError = function(){\n        throw new Error('A \"url\" property or function must be specified.');\n    },\n    eventEmit = io.EventEmitter.prototype.emit,\n    ajaxSync = Backbone.sync;\n\n    //... More code ...\n\n    })(Backbone, jQuery, _, io);\n",[42682],{"type":21,"tag":63,"props":42683,"children":42684},{"__ignoreMap":8},[42685,42732,42755,42782,42789,42813,42829,42836,42844,42851],{"type":21,"tag":209,"props":42686,"children":42687},{"class":211,"line":212},[42688,42692,42696,42700,42704,42708,42712,42716,42720,42724,42728],{"type":21,"tag":209,"props":42689,"children":42690},{"style":222},[42691],{"type":26,"value":368},{"type":21,"tag":209,"props":42693,"children":42694},{"style":216},[42695],{"type":26,"value":5370},{"type":21,"tag":209,"props":42697,"children":42698},{"style":222},[42699],{"type":26,"value":368},{"type":21,"tag":209,"props":42701,"children":42702},{"style":400},[42703],{"type":26,"value":38277},{"type":21,"tag":209,"props":42705,"children":42706},{"style":222},[42707],{"type":26,"value":408},{"type":21,"tag":209,"props":42709,"children":42710},{"style":400},[42711],{"type":26,"value":10250},{"type":21,"tag":209,"props":42713,"children":42714},{"style":222},[42715],{"type":26,"value":408},{"type":21,"tag":209,"props":42717,"children":42718},{"style":400},[42719],{"type":26,"value":38639},{"type":21,"tag":209,"props":42721,"children":42722},{"style":222},[42723],{"type":26,"value":408},{"type":21,"tag":209,"props":42725,"children":42726},{"style":400},[42727],{"type":26,"value":41056},{"type":21,"tag":209,"props":42729,"children":42730},{"style":222},[42731],{"type":26,"value":2369},{"type":21,"tag":209,"props":42733,"children":42734},{"class":211,"line":244},[42735,42739,42743,42747,42751],{"type":21,"tag":209,"props":42736,"children":42737},{"style":216},[42738],{"type":26,"value":10405},{"type":21,"tag":209,"props":42740,"children":42741},{"style":360},[42742],{"type":26,"value":41072},{"type":21,"tag":209,"props":42744,"children":42745},{"style":216},[42746],{"type":26,"value":271},{"type":21,"tag":209,"props":42748,"children":42749},{"style":216},[42750],{"type":26,"value":4766},{"type":21,"tag":209,"props":42752,"children":42753},{"style":222},[42754],{"type":26,"value":2561},{"type":21,"tag":209,"props":42756,"children":42757},{"class":211,"line":254},[42758,42762,42766,42770,42774,42778],{"type":21,"tag":209,"props":42759,"children":42760},{"style":216},[42761],{"type":26,"value":15619},{"type":21,"tag":209,"props":42763,"children":42764},{"style":216},[42765],{"type":26,"value":4667},{"type":21,"tag":209,"props":42767,"children":42768},{"style":360},[42769],{"type":26,"value":18752},{"type":21,"tag":209,"props":42771,"children":42772},{"style":222},[42773],{"type":26,"value":368},{"type":21,"tag":209,"props":42775,"children":42776},{"style":233},[42777],{"type":26,"value":41108},{"type":21,"tag":209,"props":42779,"children":42780},{"style":222},[42781],{"type":26,"value":2608},{"type":21,"tag":209,"props":42783,"children":42784},{"class":211,"line":279},[42785],{"type":21,"tag":209,"props":42786,"children":42787},{"style":222},[42788],{"type":26,"value":2251},{"type":21,"tag":209,"props":42790,"children":42791},{"class":211,"line":288},[42792,42797,42801,42805,42809],{"type":21,"tag":209,"props":42793,"children":42794},{"style":222},[42795],{"type":26,"value":42796},"    eventEmit ",{"type":21,"tag":209,"props":42798,"children":42799},{"style":216},[42800],{"type":26,"value":1432},{"type":21,"tag":209,"props":42802,"children":42803},{"style":222},[42804],{"type":26,"value":41136},{"type":21,"tag":209,"props":42806,"children":42807},{"style":263},[42808],{"type":26,"value":37016},{"type":21,"tag":209,"props":42810,"children":42811},{"style":222},[42812],{"type":26,"value":41145},{"type":21,"tag":209,"props":42814,"children":42815},{"class":211,"line":307},[42816,42821,42825],{"type":21,"tag":209,"props":42817,"children":42818},{"style":222},[42819],{"type":26,"value":42820},"    ajaxSync ",{"type":21,"tag":209,"props":42822,"children":42823},{"style":216},[42824],{"type":26,"value":1432},{"type":21,"tag":209,"props":42826,"children":42827},{"style":222},[42828],{"type":26,"value":41162},{"type":21,"tag":209,"props":42830,"children":42831},{"class":211,"line":325},[42832],{"type":21,"tag":209,"props":42833,"children":42834},{"emptyLinePlaceholder":248},[42835],{"type":26,"value":251},{"type":21,"tag":209,"props":42837,"children":42838},{"class":211,"line":334},[42839],{"type":21,"tag":209,"props":42840,"children":42841},{"style":448},[42842],{"type":26,"value":42843},"    //... More code ...\n",{"type":21,"tag":209,"props":42845,"children":42846},{"class":211,"line":343},[42847],{"type":21,"tag":209,"props":42848,"children":42849},{"emptyLinePlaceholder":248},[42850],{"type":26,"value":251},{"type":21,"tag":209,"props":42852,"children":42853},{"class":211,"line":351},[42854],{"type":21,"tag":209,"props":42855,"children":42856},{"style":222},[42857],{"type":26,"value":42858},"    })(Backbone, jQuery, _, io);\n",{"type":21,"tag":22,"props":42860,"children":42861},{},[42862],{"type":26,"value":42863},"We create a function expression, and feed it the expected globals - a reference to Backbone, jQuery, underscore and socket.io, in that order. At the top, we're reproducing backbone's standard urlError function, and then we're saving a reference to io's emit (more on that in a bit), and to the original, ajax-based sync.",{"type":21,"tag":200,"props":42865,"children":42867},{"className":9044,"code":42866,"language":9046,"meta":8,"style":8},"/**\n * Preserve the standard, jquery ajax based persistance method as ajaxSync.\n */\nBackbone.ajaxSync = function(method, model, options){\n    return ajaxSync.call(this, method, model, options);\n};\n",[42868],{"type":21,"tag":63,"props":42869,"children":42870},{"__ignoreMap":8},[42871,42878,42886,42893,42941,42968],{"type":21,"tag":209,"props":42872,"children":42873},{"class":211,"line":212},[42874],{"type":21,"tag":209,"props":42875,"children":42876},{"style":448},[42877],{"type":26,"value":731},{"type":21,"tag":209,"props":42879,"children":42880},{"class":211,"line":244},[42881],{"type":21,"tag":209,"props":42882,"children":42883},{"style":448},[42884],{"type":26,"value":42885}," * Preserve the standard, jquery ajax based persistance method as ajaxSync.\n",{"type":21,"tag":209,"props":42887,"children":42888},{"class":211,"line":254},[42889],{"type":21,"tag":209,"props":42890,"children":42891},{"style":448},[42892],{"type":26,"value":755},{"type":21,"tag":209,"props":42894,"children":42895},{"class":211,"line":279},[42896,42901,42905,42909,42913,42917,42921,42925,42929,42933,42937],{"type":21,"tag":209,"props":42897,"children":42898},{"style":222},[42899],{"type":26,"value":42900},"Backbone.",{"type":21,"tag":209,"props":42902,"children":42903},{"style":360},[42904],{"type":26,"value":41204},{"type":21,"tag":209,"props":42906,"children":42907},{"style":216},[42908],{"type":26,"value":271},{"type":21,"tag":209,"props":42910,"children":42911},{"style":216},[42912],{"type":26,"value":4766},{"type":21,"tag":209,"props":42914,"children":42915},{"style":222},[42916],{"type":26,"value":368},{"type":21,"tag":209,"props":42918,"children":42919},{"style":400},[42920],{"type":26,"value":41221},{"type":21,"tag":209,"props":42922,"children":42923},{"style":222},[42924],{"type":26,"value":408},{"type":21,"tag":209,"props":42926,"children":42927},{"style":400},[42928],{"type":26,"value":41230},{"type":21,"tag":209,"props":42930,"children":42931},{"style":222},[42932],{"type":26,"value":408},{"type":21,"tag":209,"props":42934,"children":42935},{"style":400},[42936],{"type":26,"value":29825},{"type":21,"tag":209,"props":42938,"children":42939},{"style":222},[42940],{"type":26,"value":2369},{"type":21,"tag":209,"props":42942,"children":42943},{"class":211,"line":288},[42944,42948,42952,42956,42960,42964],{"type":21,"tag":209,"props":42945,"children":42946},{"style":216},[42947],{"type":26,"value":1298},{"type":21,"tag":209,"props":42949,"children":42950},{"style":222},[42951],{"type":26,"value":41254},{"type":21,"tag":209,"props":42953,"children":42954},{"style":360},[42955],{"type":26,"value":41259},{"type":21,"tag":209,"props":42957,"children":42958},{"style":222},[42959],{"type":26,"value":368},{"type":21,"tag":209,"props":42961,"children":42962},{"style":263},[42963],{"type":26,"value":2508},{"type":21,"tag":209,"props":42965,"children":42966},{"style":222},[42967],{"type":26,"value":41272},{"type":21,"tag":209,"props":42969,"children":42970},{"class":211,"line":307},[42971],{"type":21,"tag":209,"props":42972,"children":42973},{"style":222},[42974],{"type":26,"value":340},{"type":21,"tag":22,"props":42976,"children":42977},{},[42978,42980,42985,42987,42992],{"type":26,"value":42979},"The comment says it all - we're preserving the standard ",{"type":21,"tag":63,"props":42981,"children":42983},{"className":42982},[],[42984],{"type":26,"value":41320},{"type":26,"value":42986}," as ",{"type":21,"tag":63,"props":42988,"children":42990},{"className":42989},[],[42991],{"type":26,"value":41204},{"type":26,"value":42993},", so if we want some collection or model to use the standard persistence method, we can.",{"type":21,"tag":22,"props":42995,"children":42996},{},[42997],{"type":26,"value":42998},"We can specify ajaxSync as our preferred sync method when we extend the collection:",{"type":21,"tag":200,"props":43000,"children":43002},{"className":9044,"code":43001,"language":9046,"meta":8,"style":8},"var collection = new (Backbone.Collection.extend({url:'/api/url', model:Backbone.Model, sync:Backbone.ajaxSync}))();\n",[43003],{"type":21,"tag":63,"props":43004,"children":43005},{"__ignoreMap":8},[43006],{"type":21,"tag":209,"props":43007,"children":43008},{"class":211,"line":212},[43009,43013,43018,43022,43026,43031,43035,43040,43045],{"type":21,"tag":209,"props":43010,"children":43011},{"style":216},[43012],{"type":26,"value":8996},{"type":21,"tag":209,"props":43014,"children":43015},{"style":222},[43016],{"type":26,"value":43017}," collection ",{"type":21,"tag":209,"props":43019,"children":43020},{"style":216},[43021],{"type":26,"value":1432},{"type":21,"tag":209,"props":43023,"children":43024},{"style":216},[43025],{"type":26,"value":4667},{"type":21,"tag":209,"props":43027,"children":43028},{"style":222},[43029],{"type":26,"value":43030}," (Backbone.Collection.",{"type":21,"tag":209,"props":43032,"children":43033},{"style":360},[43034],{"type":26,"value":38684},{"type":21,"tag":209,"props":43036,"children":43037},{"style":222},[43038],{"type":26,"value":43039},"({url:",{"type":21,"tag":209,"props":43041,"children":43042},{"style":233},[43043],{"type":26,"value":43044},"'/api/url'",{"type":21,"tag":209,"props":43046,"children":43047},{"style":222},[43048],{"type":26,"value":43049},", model:Backbone.Model, sync:Backbone.ajaxSync}))();\n",{"type":21,"tag":200,"props":43051,"children":43053},{"className":9044,"code":43052,"language":9046,"meta":8,"style":8},"/**\n * Replace the standard sync function with our new, websocket/socket.io based solution.\n */\nBackbone.sync = function(method, model, options){\n    var opts = _.extend({}, options),\n    defer = $.Deferred(),\n    promise = defer.promise(),\n    namespace,\n    socket;\n\n    opts.url = (opts.url) ? _.result(opts, 'url') : (model.url) ? _.result(model, 'url') : void 0;\n    // If no url property has been specified, throw an error, as per the standard Backbone sync\n    if (!opts.url) urlError();\n    // Transform the url into a namespace\n    namespace = Backbone.Model.prototype.namespace.call(this, opts.url);\n",[43054],{"type":21,"tag":63,"props":43055,"children":43056},{"__ignoreMap":8},[43057,43064,43072,43079,43126,43153,43177,43201,43209,43217,43224,43312,43320,43347,43355],{"type":21,"tag":209,"props":43058,"children":43059},{"class":211,"line":212},[43060],{"type":21,"tag":209,"props":43061,"children":43062},{"style":448},[43063],{"type":26,"value":731},{"type":21,"tag":209,"props":43065,"children":43066},{"class":211,"line":244},[43067],{"type":21,"tag":209,"props":43068,"children":43069},{"style":448},[43070],{"type":26,"value":43071}," * Replace the standard sync function with our new, websocket/socket.io based solution.\n",{"type":21,"tag":209,"props":43073,"children":43074},{"class":211,"line":254},[43075],{"type":21,"tag":209,"props":43076,"children":43077},{"style":448},[43078],{"type":26,"value":755},{"type":21,"tag":209,"props":43080,"children":43081},{"class":211,"line":279},[43082,43086,43090,43094,43098,43102,43106,43110,43114,43118,43122],{"type":21,"tag":209,"props":43083,"children":43084},{"style":222},[43085],{"type":26,"value":42900},{"type":21,"tag":209,"props":43087,"children":43088},{"style":360},[43089],{"type":26,"value":41320},{"type":21,"tag":209,"props":43091,"children":43092},{"style":216},[43093],{"type":26,"value":271},{"type":21,"tag":209,"props":43095,"children":43096},{"style":216},[43097],{"type":26,"value":4766},{"type":21,"tag":209,"props":43099,"children":43100},{"style":222},[43101],{"type":26,"value":368},{"type":21,"tag":209,"props":43103,"children":43104},{"style":400},[43105],{"type":26,"value":41221},{"type":21,"tag":209,"props":43107,"children":43108},{"style":222},[43109],{"type":26,"value":408},{"type":21,"tag":209,"props":43111,"children":43112},{"style":400},[43113],{"type":26,"value":41230},{"type":21,"tag":209,"props":43115,"children":43116},{"style":222},[43117],{"type":26,"value":408},{"type":21,"tag":209,"props":43119,"children":43120},{"style":400},[43121],{"type":26,"value":29825},{"type":21,"tag":209,"props":43123,"children":43124},{"style":222},[43125],{"type":26,"value":2369},{"type":21,"tag":209,"props":43127,"children":43128},{"class":211,"line":288},[43129,43133,43137,43141,43145,43149],{"type":21,"tag":209,"props":43130,"children":43131},{"style":216},[43132],{"type":26,"value":10405},{"type":21,"tag":209,"props":43134,"children":43135},{"style":222},[43136],{"type":26,"value":41368},{"type":21,"tag":209,"props":43138,"children":43139},{"style":216},[43140],{"type":26,"value":1432},{"type":21,"tag":209,"props":43142,"children":43143},{"style":222},[43144],{"type":26,"value":41377},{"type":21,"tag":209,"props":43146,"children":43147},{"style":360},[43148],{"type":26,"value":38684},{"type":21,"tag":209,"props":43150,"children":43151},{"style":222},[43152],{"type":26,"value":41386},{"type":21,"tag":209,"props":43154,"children":43155},{"class":211,"line":307},[43156,43161,43165,43169,43173],{"type":21,"tag":209,"props":43157,"children":43158},{"style":222},[43159],{"type":26,"value":43160},"    defer ",{"type":21,"tag":209,"props":43162,"children":43163},{"style":216},[43164],{"type":26,"value":1432},{"type":21,"tag":209,"props":43166,"children":43167},{"style":222},[43168],{"type":26,"value":26905},{"type":21,"tag":209,"props":43170,"children":43171},{"style":360},[43172],{"type":26,"value":26910},{"type":21,"tag":209,"props":43174,"children":43175},{"style":222},[43176],{"type":26,"value":5405},{"type":21,"tag":209,"props":43178,"children":43179},{"class":211,"line":325},[43180,43185,43189,43193,43197],{"type":21,"tag":209,"props":43181,"children":43182},{"style":222},[43183],{"type":26,"value":43184},"    promise ",{"type":21,"tag":209,"props":43186,"children":43187},{"style":216},[43188],{"type":26,"value":1432},{"type":21,"tag":209,"props":43190,"children":43191},{"style":222},[43192],{"type":26,"value":28259},{"type":21,"tag":209,"props":43194,"children":43195},{"style":360},[43196],{"type":26,"value":27809},{"type":21,"tag":209,"props":43198,"children":43199},{"style":222},[43200],{"type":26,"value":5405},{"type":21,"tag":209,"props":43202,"children":43203},{"class":211,"line":334},[43204],{"type":21,"tag":209,"props":43205,"children":43206},{"style":222},[43207],{"type":26,"value":43208},"    namespace,\n",{"type":21,"tag":209,"props":43210,"children":43211},{"class":211,"line":343},[43212],{"type":21,"tag":209,"props":43213,"children":43214},{"style":222},[43215],{"type":26,"value":43216},"    socket;\n",{"type":21,"tag":209,"props":43218,"children":43219},{"class":211,"line":351},[43220],{"type":21,"tag":209,"props":43221,"children":43222},{"emptyLinePlaceholder":248},[43223],{"type":26,"value":251},{"type":21,"tag":209,"props":43225,"children":43226},{"class":211,"line":444},[43227,43232,43236,43240,43244,43248,43252,43256,43260,43264,43268,43272,43276,43280,43284,43288,43292,43296,43300,43304,43308],{"type":21,"tag":209,"props":43228,"children":43229},{"style":222},[43230],{"type":26,"value":43231},"    opts.url ",{"type":21,"tag":209,"props":43233,"children":43234},{"style":216},[43235],{"type":26,"value":1432},{"type":21,"tag":209,"props":43237,"children":43238},{"style":222},[43239],{"type":26,"value":41474},{"type":21,"tag":209,"props":43241,"children":43242},{"style":216},[43243],{"type":26,"value":15218},{"type":21,"tag":209,"props":43245,"children":43246},{"style":222},[43247],{"type":26,"value":41377},{"type":21,"tag":209,"props":43249,"children":43250},{"style":360},[43251],{"type":26,"value":32249},{"type":21,"tag":209,"props":43253,"children":43254},{"style":222},[43255],{"type":26,"value":41491},{"type":21,"tag":209,"props":43257,"children":43258},{"style":233},[43259],{"type":26,"value":41496},{"type":21,"tag":209,"props":43261,"children":43262},{"style":222},[43263],{"type":26,"value":432},{"type":21,"tag":209,"props":43265,"children":43266},{"style":216},[43267],{"type":26,"value":191},{"type":21,"tag":209,"props":43269,"children":43270},{"style":222},[43271],{"type":26,"value":41509},{"type":21,"tag":209,"props":43273,"children":43274},{"style":216},[43275],{"type":26,"value":15218},{"type":21,"tag":209,"props":43277,"children":43278},{"style":222},[43279],{"type":26,"value":41377},{"type":21,"tag":209,"props":43281,"children":43282},{"style":360},[43283],{"type":26,"value":32249},{"type":21,"tag":209,"props":43285,"children":43286},{"style":222},[43287],{"type":26,"value":41526},{"type":21,"tag":209,"props":43289,"children":43290},{"style":233},[43291],{"type":26,"value":41496},{"type":21,"tag":209,"props":43293,"children":43294},{"style":222},[43295],{"type":26,"value":432},{"type":21,"tag":209,"props":43297,"children":43298},{"style":216},[43299],{"type":26,"value":191},{"type":21,"tag":209,"props":43301,"children":43302},{"style":216},[43303],{"type":26,"value":41543},{"type":21,"tag":209,"props":43305,"children":43306},{"style":263},[43307],{"type":26,"value":17197},{"type":21,"tag":209,"props":43309,"children":43310},{"style":222},[43311],{"type":26,"value":241},{"type":21,"tag":209,"props":43313,"children":43314},{"class":211,"line":454},[43315],{"type":21,"tag":209,"props":43316,"children":43317},{"style":448},[43318],{"type":26,"value":43319},"    // If no url property has been specified, throw an error, as per the standard Backbone sync\n",{"type":21,"tag":209,"props":43321,"children":43322},{"class":211,"line":463},[43323,43327,43331,43335,43339,43343],{"type":21,"tag":209,"props":43324,"children":43325},{"style":216},[43326],{"type":26,"value":10853},{"type":21,"tag":209,"props":43328,"children":43329},{"style":222},[43330],{"type":26,"value":4776},{"type":21,"tag":209,"props":43332,"children":43333},{"style":216},[43334],{"type":26,"value":15052},{"type":21,"tag":209,"props":43336,"children":43337},{"style":222},[43338],{"type":26,"value":41579},{"type":21,"tag":209,"props":43340,"children":43341},{"style":360},[43342],{"type":26,"value":41584},{"type":21,"tag":209,"props":43344,"children":43345},{"style":222},[43346],{"type":26,"value":4842},{"type":21,"tag":209,"props":43348,"children":43349},{"class":211,"line":472},[43350],{"type":21,"tag":209,"props":43351,"children":43352},{"style":448},[43353],{"type":26,"value":43354},"    // Transform the url into a namespace\n",{"type":21,"tag":209,"props":43356,"children":43357},{"class":211,"line":480},[43358,43363,43367,43371,43375,43379,43383,43387,43391],{"type":21,"tag":209,"props":43359,"children":43360},{"style":222},[43361],{"type":26,"value":43362},"    namespace ",{"type":21,"tag":209,"props":43364,"children":43365},{"style":216},[43366],{"type":26,"value":1432},{"type":21,"tag":209,"props":43368,"children":43369},{"style":222},[43370],{"type":26,"value":41613},{"type":21,"tag":209,"props":43372,"children":43373},{"style":263},[43374],{"type":26,"value":37016},{"type":21,"tag":209,"props":43376,"children":43377},{"style":222},[43378],{"type":26,"value":41622},{"type":21,"tag":209,"props":43380,"children":43381},{"style":360},[43382],{"type":26,"value":41259},{"type":21,"tag":209,"props":43384,"children":43385},{"style":222},[43386],{"type":26,"value":368},{"type":21,"tag":209,"props":43388,"children":43389},{"style":263},[43390],{"type":26,"value":2508},{"type":21,"tag":209,"props":43392,"children":43393},{"style":222},[43394],{"type":26,"value":41639},{"type":21,"tag":22,"props":43396,"children":43397},{},[43398,43400,43406,43408,43413],{"type":26,"value":43399},"So, we ensure options is an object (potentially empty, if no options have been passed to us), create a jQuery Deferred object and it's promise, and declare namespace and socket for later use. Then, we attempt to determine the url, from the options first or, if not set there, from the model. Note the use of underscore's ",{"type":21,"tag":29,"props":43401,"children":43404},{"href":43402,"rel":43403},"http://underscorejs.org/#result",[93],[43405],{"type":26,"value":32249},{"type":26,"value":43407}," function - ",{"type":21,"tag":63,"props":43409,"children":43411},{"className":43410},[],[43412],{"type":26,"value":15147},{"type":26,"value":43414}," can be either a function returning a string, or a string itself. If no url is found, we throw the backbone standard error. Otherwise, we translate the url into a namespace, using backbone conventions - more on that later.",{"type":21,"tag":200,"props":43416,"children":43418},{"className":9044,"code":43417,"language":9046,"meta":8,"style":8},"// Determine what data we're sending, and ensure id is present if we're performing a PATCH call\nif (!opts.data && model) opts.data = opts.attrs || model.toJSON(options) || {};\nif ((opts.data.id === null || opts.data.id === void 0) && opts.patch === true && model){\n    opts.data.id = model.id;\n}\n// Determine which websocket to use - set in options or on model\nsocket = opts.socket || model.socket;\n",[43419],{"type":21,"tag":63,"props":43420,"children":43421},{"__ignoreMap":8},[43422,43430,43490,43557,43573,43580,43588],{"type":21,"tag":209,"props":43423,"children":43424},{"class":211,"line":212},[43425],{"type":21,"tag":209,"props":43426,"children":43427},{"style":448},[43428],{"type":26,"value":43429},"// Determine what data we're sending, and ensure id is present if we're performing a PATCH call\n",{"type":21,"tag":209,"props":43431,"children":43432},{"class":211,"line":244},[43433,43438,43442,43446,43450,43454,43458,43462,43466,43470,43474,43478,43482,43486],{"type":21,"tag":209,"props":43434,"children":43435},{"style":216},[43436],{"type":26,"value":43437},"if",{"type":21,"tag":209,"props":43439,"children":43440},{"style":222},[43441],{"type":26,"value":4776},{"type":21,"tag":209,"props":43443,"children":43444},{"style":216},[43445],{"type":26,"value":15052},{"type":21,"tag":209,"props":43447,"children":43448},{"style":222},[43449],{"type":26,"value":41667},{"type":21,"tag":209,"props":43451,"children":43452},{"style":216},[43453],{"type":26,"value":15578},{"type":21,"tag":209,"props":43455,"children":43456},{"style":222},[43457],{"type":26,"value":41676},{"type":21,"tag":209,"props":43459,"children":43460},{"style":216},[43461],{"type":26,"value":1432},{"type":21,"tag":209,"props":43463,"children":43464},{"style":222},[43465],{"type":26,"value":41685},{"type":21,"tag":209,"props":43467,"children":43468},{"style":216},[43469],{"type":26,"value":4677},{"type":21,"tag":209,"props":43471,"children":43472},{"style":222},[43473],{"type":26,"value":41694},{"type":21,"tag":209,"props":43475,"children":43476},{"style":360},[43477],{"type":26,"value":41699},{"type":21,"tag":209,"props":43479,"children":43480},{"style":222},[43481],{"type":26,"value":41704},{"type":21,"tag":209,"props":43483,"children":43484},{"style":216},[43485],{"type":26,"value":4677},{"type":21,"tag":209,"props":43487,"children":43488},{"style":222},[43489],{"type":26,"value":32274},{"type":21,"tag":209,"props":43491,"children":43492},{"class":211,"line":254},[43493,43497,43501,43505,43509,43513,43517,43521,43525,43529,43533,43537,43541,43545,43549,43553],{"type":21,"tag":209,"props":43494,"children":43495},{"style":216},[43496],{"type":26,"value":43437},{"type":21,"tag":209,"props":43498,"children":43499},{"style":222},[43500],{"type":26,"value":41724},{"type":21,"tag":209,"props":43502,"children":43503},{"style":216},[43504],{"type":26,"value":6102},{"type":21,"tag":209,"props":43506,"children":43507},{"style":263},[43508],{"type":26,"value":41733},{"type":21,"tag":209,"props":43510,"children":43511},{"style":216},[43512],{"type":26,"value":18721},{"type":21,"tag":209,"props":43514,"children":43515},{"style":222},[43516],{"type":26,"value":41742},{"type":21,"tag":209,"props":43518,"children":43519},{"style":216},[43520],{"type":26,"value":6102},{"type":21,"tag":209,"props":43522,"children":43523},{"style":216},[43524],{"type":26,"value":41543},{"type":21,"tag":209,"props":43526,"children":43527},{"style":263},[43528],{"type":26,"value":17197},{"type":21,"tag":209,"props":43530,"children":43531},{"style":222},[43532],{"type":26,"value":432},{"type":21,"tag":209,"props":43534,"children":43535},{"style":216},[43536],{"type":26,"value":15578},{"type":21,"tag":209,"props":43538,"children":43539},{"style":222},[43540],{"type":26,"value":41767},{"type":21,"tag":209,"props":43542,"children":43543},{"style":216},[43544],{"type":26,"value":6102},{"type":21,"tag":209,"props":43546,"children":43547},{"style":263},[43548],{"type":26,"value":6243},{"type":21,"tag":209,"props":43550,"children":43551},{"style":216},[43552],{"type":26,"value":15539},{"type":21,"tag":209,"props":43554,"children":43555},{"style":222},[43556],{"type":26,"value":41784},{"type":21,"tag":209,"props":43558,"children":43559},{"class":211,"line":279},[43560,43565,43569],{"type":21,"tag":209,"props":43561,"children":43562},{"style":222},[43563],{"type":26,"value":43564},"    opts.data.id ",{"type":21,"tag":209,"props":43566,"children":43567},{"style":216},[43568],{"type":26,"value":1432},{"type":21,"tag":209,"props":43570,"children":43571},{"style":222},[43572],{"type":26,"value":41801},{"type":21,"tag":209,"props":43574,"children":43575},{"class":211,"line":288},[43576],{"type":21,"tag":209,"props":43577,"children":43578},{"style":222},[43579],{"type":26,"value":7798},{"type":21,"tag":209,"props":43581,"children":43582},{"class":211,"line":307},[43583],{"type":21,"tag":209,"props":43584,"children":43585},{"style":448},[43586],{"type":26,"value":43587},"// Determine which websocket to use - set in options or on model\n",{"type":21,"tag":209,"props":43589,"children":43590},{"class":211,"line":325},[43591,43596,43600,43604,43608],{"type":21,"tag":209,"props":43592,"children":43593},{"style":222},[43594],{"type":26,"value":43595},"socket ",{"type":21,"tag":209,"props":43597,"children":43598},{"style":216},[43599],{"type":26,"value":1432},{"type":21,"tag":209,"props":43601,"children":43602},{"style":222},[43603],{"type":26,"value":41833},{"type":21,"tag":209,"props":43605,"children":43606},{"style":216},[43607],{"type":26,"value":4677},{"type":21,"tag":209,"props":43609,"children":43610},{"style":222},[43611],{"type":26,"value":41842},{"type":21,"tag":22,"props":43613,"children":43614},{},[43615],{"type":26,"value":43616},"Note that we're deciding what socket to use in the same order as we determined url - first checking the options for the socket to have been passed in with this sync request, then checking the model. If you expect that socket may not be set on either, you may want to add a check at this point. If you intend to use a globally available socket, this is also where you'd add that as a default.",{"type":21,"tag":200,"props":43618,"children":43620},{"className":9044,"code":43619,"language":9046,"meta":8,"style":8}," // Add a listener for our namespaced method, and resolve or reject our deferred based on the response\nsocket.once(namespace+method, function(res){\n    var success = (res && res.success); // Expects server json response to contain a boolean 'success' field\n    if (success)\n    {\n        if (_.isFunction(options.success)) options.success(res);\n        defer.resolve(res);\n        return;\n    }\n    if (_.isFunction(options.error)) options.error(res);\n    defer.reject(res);\n});\n",[43621],{"type":21,"tag":63,"props":43622,"children":43623},{"__ignoreMap":8},[43624,43632,43672,43703,43714,43721,43748,43764,43775,43782,43809,43825],{"type":21,"tag":209,"props":43625,"children":43626},{"class":211,"line":212},[43627],{"type":21,"tag":209,"props":43628,"children":43629},{"style":448},[43630],{"type":26,"value":43631}," // Add a listener for our namespaced method, and resolve or reject our deferred based on the response\n",{"type":21,"tag":209,"props":43633,"children":43634},{"class":211,"line":244},[43635,43640,43644,43648,43652,43656,43660,43664,43668],{"type":21,"tag":209,"props":43636,"children":43637},{"style":222},[43638],{"type":26,"value":43639},"socket.",{"type":21,"tag":209,"props":43641,"children":43642},{"style":360},[43643],{"type":26,"value":41863},{"type":21,"tag":209,"props":43645,"children":43646},{"style":222},[43647],{"type":26,"value":41868},{"type":21,"tag":209,"props":43649,"children":43650},{"style":216},[43651],{"type":26,"value":10237},{"type":21,"tag":209,"props":43653,"children":43654},{"style":222},[43655],{"type":26,"value":41877},{"type":21,"tag":209,"props":43657,"children":43658},{"style":216},[43659],{"type":26,"value":5370},{"type":21,"tag":209,"props":43661,"children":43662},{"style":222},[43663],{"type":26,"value":368},{"type":21,"tag":209,"props":43665,"children":43666},{"style":400},[43667],{"type":26,"value":1385},{"type":21,"tag":209,"props":43669,"children":43670},{"style":222},[43671],{"type":26,"value":2369},{"type":21,"tag":209,"props":43673,"children":43674},{"class":211,"line":254},[43675,43679,43683,43687,43691,43695,43699],{"type":21,"tag":209,"props":43676,"children":43677},{"style":216},[43678],{"type":26,"value":10405},{"type":21,"tag":209,"props":43680,"children":43681},{"style":222},[43682],{"type":26,"value":41905},{"type":21,"tag":209,"props":43684,"children":43685},{"style":216},[43686],{"type":26,"value":1432},{"type":21,"tag":209,"props":43688,"children":43689},{"style":222},[43690],{"type":26,"value":41914},{"type":21,"tag":209,"props":43692,"children":43693},{"style":216},[43694],{"type":26,"value":15578},{"type":21,"tag":209,"props":43696,"children":43697},{"style":222},[43698],{"type":26,"value":41923},{"type":21,"tag":209,"props":43700,"children":43701},{"style":448},[43702],{"type":26,"value":41928},{"type":21,"tag":209,"props":43704,"children":43705},{"class":211,"line":279},[43706,43710],{"type":21,"tag":209,"props":43707,"children":43708},{"style":216},[43709],{"type":26,"value":10853},{"type":21,"tag":209,"props":43711,"children":43712},{"style":222},[43713],{"type":26,"value":41940},{"type":21,"tag":209,"props":43715,"children":43716},{"class":211,"line":288},[43717],{"type":21,"tag":209,"props":43718,"children":43719},{"style":222},[43720],{"type":26,"value":37029},{"type":21,"tag":209,"props":43722,"children":43723},{"class":211,"line":307},[43724,43728,43732,43736,43740,43744],{"type":21,"tag":209,"props":43725,"children":43726},{"style":216},[43727],{"type":26,"value":5803},{"type":21,"tag":209,"props":43729,"children":43730},{"style":222},[43731],{"type":26,"value":41960},{"type":21,"tag":209,"props":43733,"children":43734},{"style":360},[43735],{"type":26,"value":41965},{"type":21,"tag":209,"props":43737,"children":43738},{"style":222},[43739],{"type":26,"value":41970},{"type":21,"tag":209,"props":43741,"children":43742},{"style":360},[43743],{"type":26,"value":31639},{"type":21,"tag":209,"props":43745,"children":43746},{"style":222},[43747],{"type":26,"value":25195},{"type":21,"tag":209,"props":43749,"children":43750},{"class":211,"line":325},[43751,43756,43760],{"type":21,"tag":209,"props":43752,"children":43753},{"style":222},[43754],{"type":26,"value":43755},"        defer.",{"type":21,"tag":209,"props":43757,"children":43758},{"style":360},[43759],{"type":26,"value":5590},{"type":21,"tag":209,"props":43761,"children":43762},{"style":222},[43763],{"type":26,"value":25195},{"type":21,"tag":209,"props":43765,"children":43766},{"class":211,"line":334},[43767,43771],{"type":21,"tag":209,"props":43768,"children":43769},{"style":216},[43770],{"type":26,"value":3069},{"type":21,"tag":209,"props":43772,"children":43773},{"style":222},[43774],{"type":26,"value":241},{"type":21,"tag":209,"props":43776,"children":43777},{"class":211,"line":343},[43778],{"type":21,"tag":209,"props":43779,"children":43780},{"style":222},[43781],{"type":26,"value":331},{"type":21,"tag":209,"props":43783,"children":43784},{"class":211,"line":351},[43785,43789,43793,43797,43801,43805],{"type":21,"tag":209,"props":43786,"children":43787},{"style":216},[43788],{"type":26,"value":10853},{"type":21,"tag":209,"props":43790,"children":43791},{"style":222},[43792],{"type":26,"value":41960},{"type":21,"tag":209,"props":43794,"children":43795},{"style":360},[43796],{"type":26,"value":41965},{"type":21,"tag":209,"props":43798,"children":43799},{"style":222},[43800],{"type":26,"value":42031},{"type":21,"tag":209,"props":43802,"children":43803},{"style":360},[43804],{"type":26,"value":10685},{"type":21,"tag":209,"props":43806,"children":43807},{"style":222},[43808],{"type":26,"value":25195},{"type":21,"tag":209,"props":43810,"children":43811},{"class":211,"line":444},[43812,43817,43821],{"type":21,"tag":209,"props":43813,"children":43814},{"style":222},[43815],{"type":26,"value":43816},"    defer.",{"type":21,"tag":209,"props":43818,"children":43819},{"style":360},[43820],{"type":26,"value":5599},{"type":21,"tag":209,"props":43822,"children":43823},{"style":222},[43824],{"type":26,"value":25195},{"type":21,"tag":209,"props":43826,"children":43827},{"class":211,"line":454},[43828],{"type":21,"tag":209,"props":43829,"children":43830},{"style":222},[43831],{"type":26,"value":469},{"type":21,"tag":22,"props":43833,"children":43834},{},[43835,43837,43843,43845,43851,43852,43858],{"type":26,"value":43836},"Now, we add a listener for our namespace and request method. I'll go into more detail on this shortly, but the general form will look like ",{"type":21,"tag":63,"props":43838,"children":43840},{"className":43839},[],[43841],{"type":26,"value":43842},"url:components:method",{"type":26,"value":43844},", e.g. ",{"type":21,"tag":63,"props":43846,"children":43848},{"className":43847},[],[43849],{"type":26,"value":43850},"api:json:get",{"type":26,"value":1922},{"type":21,"tag":63,"props":43853,"children":43855},{"className":43854},[],[43856],{"type":26,"value":43857},"api:json:post",{"type":26,"value":378},{"type":21,"tag":22,"props":43860,"children":43861},{},[43862,43864,43869],{"type":26,"value":43863},"We expect the server to reply with json that will include a boolean ",{"type":21,"tag":63,"props":43865,"children":43867},{"className":43866},[],[43868],{"type":26,"value":31639},{"type":26,"value":43870}," field, and decide whether to trigger any success or error functions based on whether we've received a response and that response indicates success. We at this point also resolve or reject the promise we created earlier, and will return shortly.",{"type":21,"tag":22,"props":43872,"children":43873},{},[43874,43876,43881],{"type":26,"value":43875},"An earlier version of the code used the ",{"type":21,"tag":63,"props":43877,"children":43879},{"className":43878},[],[43880],{"type":26,"value":36323},{"type":26,"value":43882}," method of emitting, that looks like:",{"type":21,"tag":200,"props":43884,"children":43886},{"className":9044,"code":43885,"language":9046,"meta":8,"style":8},"socket.emit(namespace+method, opts.data, function(res){ // ... resolve promise ...  }\n",[43887],{"type":21,"tag":63,"props":43888,"children":43889},{"__ignoreMap":8},[43890],{"type":21,"tag":209,"props":43891,"children":43892},{"class":211,"line":212},[43893,43897,43901,43905,43909,43914,43918,43922,43926,43931],{"type":21,"tag":209,"props":43894,"children":43895},{"style":222},[43896],{"type":26,"value":43639},{"type":21,"tag":209,"props":43898,"children":43899},{"style":360},[43900],{"type":26,"value":42088},{"type":21,"tag":209,"props":43902,"children":43903},{"style":222},[43904],{"type":26,"value":41868},{"type":21,"tag":209,"props":43906,"children":43907},{"style":216},[43908],{"type":26,"value":10237},{"type":21,"tag":209,"props":43910,"children":43911},{"style":222},[43912],{"type":26,"value":43913},"method, opts.data, ",{"type":21,"tag":209,"props":43915,"children":43916},{"style":216},[43917],{"type":26,"value":5370},{"type":21,"tag":209,"props":43919,"children":43920},{"style":222},[43921],{"type":26,"value":368},{"type":21,"tag":209,"props":43923,"children":43924},{"style":400},[43925],{"type":26,"value":1385},{"type":21,"tag":209,"props":43927,"children":43928},{"style":222},[43929],{"type":26,"value":43930},"){ ",{"type":21,"tag":209,"props":43932,"children":43933},{"style":448},[43934],{"type":26,"value":43935},"// ... resolve promise ...  }\n",{"type":21,"tag":22,"props":43937,"children":43938},{},[43939,43941,43948],{"type":26,"value":43940},"Why the change? This type of request emits a ",{"type":21,"tag":29,"props":43942,"children":43945},{"href":43943,"rel":43944},"https://github.com/automattic/socket.io-protocol",[93],[43946],{"type":26,"value":43947},"Data ACK packet",{"type":26,"value":43949},", which combines the ack packet (acknowledging the request) with the data expected of the response. It seems straightforward, but the protocol dictates that communication is BLOCKED until the ack packet is received, and now you've mandated that the ack packet not get sent until its ready to send the data along with it. Not an issue if you don't mind serving in order of request, and don't expect gathering the data to return to take long, but if you want to take advantage of async, out-of-order serving of requests, you need to use the approach we've discussed above, which sends an EVENT packet which can be responded to with an immediate ACK, and sent data later when it's ready.",{"type":21,"tag":200,"props":43951,"children":43953},{"className":9044,"code":43952,"language":9046,"meta":8,"style":8}," // Emit our namespaced method and the model+opts data\nsocket.emit(namespace+method, opts.data);\n\n// Trigger the request event on the model, as per backbone spec\nmodel.trigger('request', model, promise, opts);\n// Return the promise for us to use as per usual (hanging .done blocks off, add to a .when, etc.)\nreturn promise;\n",[43954],{"type":21,"tag":63,"props":43955,"children":43956},{"__ignoreMap":8},[43957,43965,43988,43995,44003,44027,44035],{"type":21,"tag":209,"props":43958,"children":43959},{"class":211,"line":212},[43960],{"type":21,"tag":209,"props":43961,"children":43962},{"style":448},[43963],{"type":26,"value":43964}," // Emit our namespaced method and the model+opts data\n",{"type":21,"tag":209,"props":43966,"children":43967},{"class":211,"line":244},[43968,43972,43976,43980,43984],{"type":21,"tag":209,"props":43969,"children":43970},{"style":222},[43971],{"type":26,"value":43639},{"type":21,"tag":209,"props":43973,"children":43974},{"style":360},[43975],{"type":26,"value":42088},{"type":21,"tag":209,"props":43977,"children":43978},{"style":222},[43979],{"type":26,"value":41868},{"type":21,"tag":209,"props":43981,"children":43982},{"style":216},[43983],{"type":26,"value":10237},{"type":21,"tag":209,"props":43985,"children":43986},{"style":222},[43987],{"type":26,"value":42101},{"type":21,"tag":209,"props":43989,"children":43990},{"class":211,"line":254},[43991],{"type":21,"tag":209,"props":43992,"children":43993},{"emptyLinePlaceholder":248},[43994],{"type":26,"value":251},{"type":21,"tag":209,"props":43996,"children":43997},{"class":211,"line":279},[43998],{"type":21,"tag":209,"props":43999,"children":44000},{"style":448},[44001],{"type":26,"value":44002},"// Trigger the request event on the model, as per backbone spec\n",{"type":21,"tag":209,"props":44004,"children":44005},{"class":211,"line":288},[44006,44011,44015,44019,44023],{"type":21,"tag":209,"props":44007,"children":44008},{"style":222},[44009],{"type":26,"value":44010},"model.",{"type":21,"tag":209,"props":44012,"children":44013},{"style":360},[44014],{"type":26,"value":499},{"type":21,"tag":209,"props":44016,"children":44017},{"style":222},[44018],{"type":26,"value":368},{"type":21,"tag":209,"props":44020,"children":44021},{"style":233},[44022],{"type":26,"value":35705},{"type":21,"tag":209,"props":44024,"children":44025},{"style":222},[44026],{"type":26,"value":42141},{"type":21,"tag":209,"props":44028,"children":44029},{"class":211,"line":307},[44030],{"type":21,"tag":209,"props":44031,"children":44032},{"style":448},[44033],{"type":26,"value":44034},"// Return the promise for us to use as per usual (hanging .done blocks off, add to a .when, etc.)\n",{"type":21,"tag":209,"props":44036,"children":44037},{"class":211,"line":325},[44038,44042],{"type":21,"tag":209,"props":44039,"children":44040},{"style":216},[44041],{"type":26,"value":5813},{"type":21,"tag":209,"props":44043,"children":44044},{"style":222},[44045],{"type":26,"value":42161},{"type":21,"tag":22,"props":44047,"children":44048},{},[44049],{"type":26,"value":44050},"Comments say it all for this one.",{"type":21,"tag":200,"props":44052,"children":44054},{"className":9044,"code":44053,"language":9046,"meta":8,"style":8},"/**\n * Break url apart to create namespace - every '/' save any pre/post-fixing the url will become a ':' indicating\n * namespace - so a collection that maps to /api/posts will now have its events on the namespace\n * api:posts: (ie. api:posts:create, api:posts:delete, etc.), and a model that maps to /api/posts/21\n * will have events on api:posts:21: (ie. api:posts:21:update, api:posts:21:patch, etc.)\n * @param {string=} url\n */\nBackbone.Model.prototype.namespace = function(url){\n    url = url || this.url();\n    return _.trim(url, '/').replace('/', ':') + \":\";\n};\n",[44055],{"type":21,"tag":63,"props":44056,"children":44057},{"__ignoreMap":8},[44058,44065,44073,44081,44089,44097,44116,44123,44163,44198,44261],{"type":21,"tag":209,"props":44059,"children":44060},{"class":211,"line":212},[44061],{"type":21,"tag":209,"props":44062,"children":44063},{"style":448},[44064],{"type":26,"value":731},{"type":21,"tag":209,"props":44066,"children":44067},{"class":211,"line":244},[44068],{"type":21,"tag":209,"props":44069,"children":44070},{"style":448},[44071],{"type":26,"value":44072}," * Break url apart to create namespace - every '/' save any pre/post-fixing the url will become a ':' indicating\n",{"type":21,"tag":209,"props":44074,"children":44075},{"class":211,"line":254},[44076],{"type":21,"tag":209,"props":44077,"children":44078},{"style":448},[44079],{"type":26,"value":44080}," * namespace - so a collection that maps to /api/posts will now have its events on the namespace\n",{"type":21,"tag":209,"props":44082,"children":44083},{"class":211,"line":279},[44084],{"type":21,"tag":209,"props":44085,"children":44086},{"style":448},[44087],{"type":26,"value":44088}," * api:posts: (ie. api:posts:create, api:posts:delete, etc.), and a model that maps to /api/posts/21\n",{"type":21,"tag":209,"props":44090,"children":44091},{"class":211,"line":288},[44092],{"type":21,"tag":209,"props":44093,"children":44094},{"style":448},[44095],{"type":26,"value":44096}," * will have events on api:posts:21: (ie. api:posts:21:update, api:posts:21:patch, etc.)\n",{"type":21,"tag":209,"props":44098,"children":44099},{"class":211,"line":307},[44100,44104,44108,44112],{"type":21,"tag":209,"props":44101,"children":44102},{"style":448},[44103],{"type":26,"value":11233},{"type":21,"tag":209,"props":44105,"children":44106},{"style":216},[44107],{"type":26,"value":4718},{"type":21,"tag":209,"props":44109,"children":44110},{"style":360},[44111],{"type":26,"value":42230},{"type":21,"tag":209,"props":44113,"children":44114},{"style":222},[44115],{"type":26,"value":42235},{"type":21,"tag":209,"props":44117,"children":44118},{"class":211,"line":325},[44119],{"type":21,"tag":209,"props":44120,"children":44121},{"style":448},[44122],{"type":26,"value":755},{"type":21,"tag":209,"props":44124,"children":44125},{"class":211,"line":334},[44126,44131,44135,44139,44143,44147,44151,44155,44159],{"type":21,"tag":209,"props":44127,"children":44128},{"style":222},[44129],{"type":26,"value":44130},"Backbone.Model.",{"type":21,"tag":209,"props":44132,"children":44133},{"style":263},[44134],{"type":26,"value":37016},{"type":21,"tag":209,"props":44136,"children":44137},{"style":222},[44138],{"type":26,"value":378},{"type":21,"tag":209,"props":44140,"children":44141},{"style":360},[44142],{"type":26,"value":42263},{"type":21,"tag":209,"props":44144,"children":44145},{"style":216},[44146],{"type":26,"value":271},{"type":21,"tag":209,"props":44148,"children":44149},{"style":216},[44150],{"type":26,"value":4766},{"type":21,"tag":209,"props":44152,"children":44153},{"style":222},[44154],{"type":26,"value":368},{"type":21,"tag":209,"props":44156,"children":44157},{"style":400},[44158],{"type":26,"value":15147},{"type":21,"tag":209,"props":44160,"children":44161},{"style":222},[44162],{"type":26,"value":2369},{"type":21,"tag":209,"props":44164,"children":44165},{"class":211,"line":343},[44166,44170,44174,44178,44182,44186,44190,44194],{"type":21,"tag":209,"props":44167,"children":44168},{"style":222},[44169],{"type":26,"value":32854},{"type":21,"tag":209,"props":44171,"children":44172},{"style":216},[44173],{"type":26,"value":1432},{"type":21,"tag":209,"props":44175,"children":44176},{"style":222},[44177],{"type":26,"value":15277},{"type":21,"tag":209,"props":44179,"children":44180},{"style":216},[44181],{"type":26,"value":4677},{"type":21,"tag":209,"props":44183,"children":44184},{"style":263},[44185],{"type":26,"value":17698},{"type":21,"tag":209,"props":44187,"children":44188},{"style":222},[44189],{"type":26,"value":378},{"type":21,"tag":209,"props":44191,"children":44192},{"style":360},[44193],{"type":26,"value":15147},{"type":21,"tag":209,"props":44195,"children":44196},{"style":222},[44197],{"type":26,"value":4842},{"type":21,"tag":209,"props":44199,"children":44200},{"class":211,"line":351},[44201,44205,44209,44213,44217,44221,44225,44229,44233,44237,44241,44245,44249,44253,44257],{"type":21,"tag":209,"props":44202,"children":44203},{"style":216},[44204],{"type":26,"value":1298},{"type":21,"tag":209,"props":44206,"children":44207},{"style":222},[44208],{"type":26,"value":41377},{"type":21,"tag":209,"props":44210,"children":44211},{"style":360},[44212],{"type":26,"value":42335},{"type":21,"tag":209,"props":44214,"children":44215},{"style":222},[44216],{"type":26,"value":42340},{"type":21,"tag":209,"props":44218,"children":44219},{"style":233},[44220],{"type":26,"value":42345},{"type":21,"tag":209,"props":44222,"children":44223},{"style":222},[44224],{"type":26,"value":2699},{"type":21,"tag":209,"props":44226,"children":44227},{"style":360},[44228],{"type":26,"value":29854},{"type":21,"tag":209,"props":44230,"children":44231},{"style":222},[44232],{"type":26,"value":368},{"type":21,"tag":209,"props":44234,"children":44235},{"style":233},[44236],{"type":26,"value":42345},{"type":21,"tag":209,"props":44238,"children":44239},{"style":222},[44240],{"type":26,"value":408},{"type":21,"tag":209,"props":44242,"children":44243},{"style":233},[44244],{"type":26,"value":42370},{"type":21,"tag":209,"props":44246,"children":44247},{"style":222},[44248],{"type":26,"value":432},{"type":21,"tag":209,"props":44250,"children":44251},{"style":216},[44252],{"type":26,"value":10237},{"type":21,"tag":209,"props":44254,"children":44255},{"style":233},[44256],{"type":26,"value":42383},{"type":21,"tag":209,"props":44258,"children":44259},{"style":222},[44260],{"type":26,"value":241},{"type":21,"tag":209,"props":44262,"children":44263},{"class":211,"line":444},[44264],{"type":21,"tag":209,"props":44265,"children":44266},{"style":222},[44267],{"type":26,"value":340},{"type":21,"tag":22,"props":44269,"children":44270},{},[44271],{"type":26,"value":44272},"This one too, I think. Note, this isn't a required part of implementing socket.io - it just nicely mirros the style of events that backbone uses internally.",{"type":21,"tag":200,"props":44274,"children":44276},{"className":9044,"code":44275,"language":9046,"meta":8,"style":8},"/**\n * Override EventEmitter.emit and SocketNamespace reference for socket.io to add a catch all case for the\n * wildcard ('*') character. Now, socket.on('*') will catch any event, with the name of the caught event\n * passed to the handler as the first argument.\n */\nio.EventEmitter.prototype.emit = function(name){\n    var args = Array.prototype.slice.call(arguments, 1);\n\n    eventEmit.apply(this, ['*', name].concat(args));\n    eventEmit.apply(this, [name].concat(args));\n};\nio.SocketNamespace.prototype.$emit = io.EventEmitter.prototype.emit;\n",[44277],{"type":21,"tag":63,"props":44278,"children":44279},{"__ignoreMap":8},[44280,44287,44295,44303,44311,44318,44358,44413,44420,44460,44491,44498],{"type":21,"tag":209,"props":44281,"children":44282},{"class":211,"line":212},[44283],{"type":21,"tag":209,"props":44284,"children":44285},{"style":448},[44286],{"type":26,"value":731},{"type":21,"tag":209,"props":44288,"children":44289},{"class":211,"line":244},[44290],{"type":21,"tag":209,"props":44291,"children":44292},{"style":448},[44293],{"type":26,"value":44294}," * Override EventEmitter.emit and SocketNamespace reference for socket.io to add a catch all case for the\n",{"type":21,"tag":209,"props":44296,"children":44297},{"class":211,"line":254},[44298],{"type":21,"tag":209,"props":44299,"children":44300},{"style":448},[44301],{"type":26,"value":44302}," * wildcard ('*') character. Now, socket.on('*') will catch any event, with the name of the caught event\n",{"type":21,"tag":209,"props":44304,"children":44305},{"class":211,"line":279},[44306],{"type":21,"tag":209,"props":44307,"children":44308},{"style":448},[44309],{"type":26,"value":44310}," * passed to the handler as the first argument.\n",{"type":21,"tag":209,"props":44312,"children":44313},{"class":211,"line":288},[44314],{"type":21,"tag":209,"props":44315,"children":44316},{"style":448},[44317],{"type":26,"value":755},{"type":21,"tag":209,"props":44319,"children":44320},{"class":211,"line":307},[44321,44326,44330,44334,44338,44342,44346,44350,44354],{"type":21,"tag":209,"props":44322,"children":44323},{"style":222},[44324],{"type":26,"value":44325},"io.EventEmitter.",{"type":21,"tag":209,"props":44327,"children":44328},{"style":263},[44329],{"type":26,"value":37016},{"type":21,"tag":209,"props":44331,"children":44332},{"style":222},[44333],{"type":26,"value":378},{"type":21,"tag":209,"props":44335,"children":44336},{"style":360},[44337],{"type":26,"value":42088},{"type":21,"tag":209,"props":44339,"children":44340},{"style":216},[44341],{"type":26,"value":271},{"type":21,"tag":209,"props":44343,"children":44344},{"style":216},[44345],{"type":26,"value":4766},{"type":21,"tag":209,"props":44347,"children":44348},{"style":222},[44349],{"type":26,"value":368},{"type":21,"tag":209,"props":44351,"children":44352},{"style":400},[44353],{"type":26,"value":7820},{"type":21,"tag":209,"props":44355,"children":44356},{"style":222},[44357],{"type":26,"value":2369},{"type":21,"tag":209,"props":44359,"children":44360},{"class":211,"line":325},[44361,44365,44369,44373,44377,44381,44385,44389,44393,44397,44401,44405,44409],{"type":21,"tag":209,"props":44362,"children":44363},{"style":216},[44364],{"type":26,"value":10405},{"type":21,"tag":209,"props":44366,"children":44367},{"style":222},[44368],{"type":26,"value":42491},{"type":21,"tag":209,"props":44370,"children":44371},{"style":216},[44372],{"type":26,"value":1432},{"type":21,"tag":209,"props":44374,"children":44375},{"style":263},[44376],{"type":26,"value":42500},{"type":21,"tag":209,"props":44378,"children":44379},{"style":222},[44380],{"type":26,"value":378},{"type":21,"tag":209,"props":44382,"children":44383},{"style":263},[44384],{"type":26,"value":37016},{"type":21,"tag":209,"props":44386,"children":44387},{"style":222},[44388],{"type":26,"value":42513},{"type":21,"tag":209,"props":44390,"children":44391},{"style":360},[44392],{"type":26,"value":41259},{"type":21,"tag":209,"props":44394,"children":44395},{"style":222},[44396],{"type":26,"value":368},{"type":21,"tag":209,"props":44398,"children":44399},{"style":263},[44400],{"type":26,"value":42526},{"type":21,"tag":209,"props":44402,"children":44403},{"style":222},[44404],{"type":26,"value":408},{"type":21,"tag":209,"props":44406,"children":44407},{"style":263},[44408],{"type":26,"value":3224},{"type":21,"tag":209,"props":44410,"children":44411},{"style":222},[44412],{"type":26,"value":2608},{"type":21,"tag":209,"props":44414,"children":44415},{"class":211,"line":334},[44416],{"type":21,"tag":209,"props":44417,"children":44418},{"emptyLinePlaceholder":248},[44419],{"type":26,"value":251},{"type":21,"tag":209,"props":44421,"children":44422},{"class":211,"line":343},[44423,44428,44432,44436,44440,44444,44448,44452,44456],{"type":21,"tag":209,"props":44424,"children":44425},{"style":222},[44426],{"type":26,"value":44427},"    eventEmit.",{"type":21,"tag":209,"props":44429,"children":44430},{"style":360},[44431],{"type":26,"value":42558},{"type":21,"tag":209,"props":44433,"children":44434},{"style":222},[44435],{"type":26,"value":368},{"type":21,"tag":209,"props":44437,"children":44438},{"style":263},[44439],{"type":26,"value":2508},{"type":21,"tag":209,"props":44441,"children":44442},{"style":222},[44443],{"type":26,"value":42571},{"type":21,"tag":209,"props":44445,"children":44446},{"style":233},[44447],{"type":26,"value":42576},{"type":21,"tag":209,"props":44449,"children":44450},{"style":222},[44451],{"type":26,"value":42581},{"type":21,"tag":209,"props":44453,"children":44454},{"style":360},[44455],{"type":26,"value":42586},{"type":21,"tag":209,"props":44457,"children":44458},{"style":222},[44459],{"type":26,"value":42591},{"type":21,"tag":209,"props":44461,"children":44462},{"class":211,"line":351},[44463,44467,44471,44475,44479,44483,44487],{"type":21,"tag":209,"props":44464,"children":44465},{"style":222},[44466],{"type":26,"value":44427},{"type":21,"tag":209,"props":44468,"children":44469},{"style":360},[44470],{"type":26,"value":42558},{"type":21,"tag":209,"props":44472,"children":44473},{"style":222},[44474],{"type":26,"value":368},{"type":21,"tag":209,"props":44476,"children":44477},{"style":263},[44478],{"type":26,"value":2508},{"type":21,"tag":209,"props":44480,"children":44481},{"style":222},[44482],{"type":26,"value":42615},{"type":21,"tag":209,"props":44484,"children":44485},{"style":360},[44486],{"type":26,"value":42586},{"type":21,"tag":209,"props":44488,"children":44489},{"style":222},[44490],{"type":26,"value":42591},{"type":21,"tag":209,"props":44492,"children":44493},{"class":211,"line":444},[44494],{"type":21,"tag":209,"props":44495,"children":44496},{"style":222},[44497],{"type":26,"value":340},{"type":21,"tag":209,"props":44499,"children":44500},{"class":211,"line":454},[44501,44506,44510,44514,44518,44522,44526],{"type":21,"tag":209,"props":44502,"children":44503},{"style":222},[44504],{"type":26,"value":44505},"io.SocketNamespace.",{"type":21,"tag":209,"props":44507,"children":44508},{"style":263},[44509],{"type":26,"value":37016},{"type":21,"tag":209,"props":44511,"children":44512},{"style":222},[44513],{"type":26,"value":42647},{"type":21,"tag":209,"props":44515,"children":44516},{"style":216},[44517],{"type":26,"value":1432},{"type":21,"tag":209,"props":44519,"children":44520},{"style":222},[44521],{"type":26,"value":41136},{"type":21,"tag":209,"props":44523,"children":44524},{"style":263},[44525],{"type":26,"value":37016},{"type":21,"tag":209,"props":44527,"children":44528},{"style":222},[44529],{"type":26,"value":42664},{"type":21,"tag":22,"props":44531,"children":44532},{},[44533,44535,44540],{"type":26,"value":44534},"And here's the reason why we saved the io ",{"type":21,"tag":63,"props":44536,"children":44538},{"className":44537},[],[44539],{"type":26,"value":42088},{"type":26,"value":44541}," function earlier - this little shim sits in front of the standard emit and allows us to add a wildcard catch-all for events on a socket.",{"type":21,"tag":22,"props":44543,"children":44544},{},[44545],{"type":26,"value":44546},"And that's all folks! Of course, you'll need to support your implementation on the server-side - how exactly you go about that will depend on the language and library your using.",{"type":21,"tag":22,"props":44548,"children":44549},{},[44550],{"type":26,"value":44551},"I do have one more goodie for you, though - here's a version of the above tailored for those of you using Marionette:",{"type":21,"tag":200,"props":44553,"children":44555},{"className":9044,"code":44554,"language":9046,"meta":8,"style":8},"/**\n * Copyright (c) Christopher Keefer. All Rights Reserved.\n *\n * Overrides the default transport for Backbone syncing to use websockets via socket.io. Includes marionette     \n * convenience code, specifically for sending socket-related events along the global event aggregator.\n */\n(function(app, Backbone, Marionette, $, _, io){\n    var urlError = function(){\n        throw new Error('A \"url\" property or function must be specified.');\n    },\n        eventEmit = io.EventEmitter.prototype.emit,\n        ajaxSync = Backbone.sync;\n\n    /**\n     * Preserve the standard, jquery ajax based persistance method as ajaxSync.\n     */\n    Backbone.ajaxSync = function(method, model, options){\n        return ajaxSync.call(this, method, model, options);\n    };\n\n    /**\n     * Replace the standard sync function with our new, websocket/socket.io based solution.\n     */\n    Backbone.sync = function(method, model, options){\n        var opts = _.extend({}, options),\n            defer = $.Deferred(),\n            promise = defer.promise(),\n            namespace,\n            socket;\n\n        opts.url = (opts.url) ? _.result(opts, 'url') : (model.url) ? _.result(model, 'url') : void 0;\n        // If no url property has been specified, throw an error, as per the standard Backbone sync\n        if (!opts.url) urlError();\n        namespace = Backbone.Model.prototype.namespace.call(this, opts.url);\n        // Determine what data we're sending, and ensure id is present if we're performing a PATCH call\n        if (!opts.data && model) opts.data = opts.attrs || model.toJSON(options) || {};\n        if ((opts.data.id === null || opts.data.id === void 0) && opts.patch === true && model){\n            opts.data.id = model.id;\n        }\n        // Determine which websocket to use - set in options, on model, or on global app\n        socket = opts.socket || model.socket || app.socket;\n        // Trigger the app event aggregator for interested listeners to know we're about to request data via websocket\n        app.vent.trigger('backbone:request', namespace);\n        // Add a listener for our namespaced method, and resolve or reject our deferred based on the response\n        socket.once(namespace+method, function(res){\n            var success = (res && res.success);\n            // Trigger the app event aggregator to indicate we've received a return from the server, and success\n            app.vent.trigger('backbone:receive', namespace, success);\n            if (success)\n            {\n                if (_.isFunction(options.success)) options.success(res);\n                defer.resolve(res);\n                return;\n            }\n            if (_.isFunction(options.error)) options.error(res);\n            defer.reject(res);\n        });\n\n        // Emit our namespaced method and the model+opts data\n        socket.emit(namespace+method, opts.data);\n\n        // Trigger the request event on the model, as per backbone spec\n        model.trigger('request', model, promise, opts);\n        // Return the promise for us to use as per usual (hanging .done blocks off, add to a .when, etc.)\n        return promise;\n    };\n\n    /**\n     * Break url apart to create namespace - every '/' save any pre/post-fixing the url will become a ':' indicating\n     * namespace - so a collection that maps to /api/posts will now have its events on the namespace\n     * api:posts: (ie. api:posts:create, api:posts:delete, etc.), and a model that maps to /api/posts/21\n     * will have events on api:posts:21: (ie. api:posts:21:update, api:posts:21:patch, etc.)\n     * @param {string=} url\n     */\n    Backbone.Model.prototype.namespace = function(url){\n        url = url || this.url();\n        return _.trim(url, '/').replace('/', ':') + \":\";\n    };\n\n    /**\n     * Override EventEmitter.emit and SocketNamespace reference for socket.io to add a catch all case for the\n     * wildcard ('*') character. Now, socket.on('*') will catch any event, with the name of the caught event\n     * passed to the handler as the first argument.\n    */\n    io.EventEmitter.prototype.emit = function(name){\n        var args = Array.prototype.slice.call(arguments, 1);\n\n        eventEmit.apply(this, ['*', name].concat(args));\n        eventEmit.apply(this, [name].concat(args));\n    };\n    io.SocketNamespace.prototype.$emit = io.EventEmitter.prototype.emit;\n\n    /**\n     * Create a socket io instance that will echo all events into the application event aggregator, so that\n     * collections, models, etc. can listen on app.vent for their events.\n     * @param {string=} url\n     * @constructor\n     */\n    Marionette.Application.prototype.SocketIO = function(url){\n        var socket = io.connect(url, {\n            transports:['websocket']\n        });\n\n        /**\n         * On any event from the server, trigger it on the app event aggregator. The first\n         * argument will always be the name of the event.\n         */\n        socket.on('*', function(){\n            var args = Array.prototype.slice.call(arguments, 0);\n            app.vent.trigger(args[0], args.slice(1));\n        });\n\n        /**\n         * On error, trigger the socket:error event on the global event aggregator for \n         * interested listeners.\n         */\n        socket.on('error', function(err){\n            app.vent.trigger('socket:error', err);\n        });\n\n        return socket;\n    }\n})(app /* replace with your global app object */, Backbone, Backbone.Marionette, jQuery, _, io);\n",[44556],{"type":21,"tag":63,"props":44557,"children":44558},{"__ignoreMap":8},[44559,44566,44573,44580,44588,44596,44603,44666,44689,44716,44723,44746,44761,44768,44775,44782,44789,44836,44863,44870,44877,44884,44891,44898,44945,44972,44995,45018,45025,45032,45039,45126,45133,45160,45199,45206,45265,45332,45347,45354,45362,45395,45403,45429,45436,45475,45503,45511,45537,45548,45555,45582,45597,45608,45615,45642,45657,45664,45671,45678,45701,45708,45715,45738,45745,45756,45763,45770,45777,45784,45791,45798,45805,45824,45831,45870,45905,45968,45975,45982,45989,45996,46003,46010,46017,46056,46111,46118,46157,46188,46195,46226,46233,46240,46248,46256,46275,46287,46294,46335,46365,46382,46389,46396,46403,46411,46419,46426,46457,46512,46555,46562,46569,46576,46584,46592,46599,46638,46662,46669,46676,46688,46695],{"type":21,"tag":209,"props":44560,"children":44561},{"class":211,"line":212},[44562],{"type":21,"tag":209,"props":44563,"children":44564},{"style":448},[44565],{"type":26,"value":731},{"type":21,"tag":209,"props":44567,"children":44568},{"class":211,"line":244},[44569],{"type":21,"tag":209,"props":44570,"children":44571},{"style":448},[44572],{"type":26,"value":40990},{"type":21,"tag":209,"props":44574,"children":44575},{"class":211,"line":254},[44576],{"type":21,"tag":209,"props":44577,"children":44578},{"style":448},[44579],{"type":26,"value":14974},{"type":21,"tag":209,"props":44581,"children":44582},{"class":211,"line":279},[44583],{"type":21,"tag":209,"props":44584,"children":44585},{"style":448},[44586],{"type":26,"value":44587}," * Overrides the default transport for Backbone syncing to use websockets via socket.io. Includes marionette     \n",{"type":21,"tag":209,"props":44589,"children":44590},{"class":211,"line":288},[44591],{"type":21,"tag":209,"props":44592,"children":44593},{"style":448},[44594],{"type":26,"value":44595}," * convenience code, specifically for sending socket-related events along the global event aggregator.\n",{"type":21,"tag":209,"props":44597,"children":44598},{"class":211,"line":307},[44599],{"type":21,"tag":209,"props":44600,"children":44601},{"style":448},[44602],{"type":26,"value":755},{"type":21,"tag":209,"props":44604,"children":44605},{"class":211,"line":325},[44606,44610,44614,44618,44622,44626,44630,44634,44638,44642,44646,44650,44654,44658,44662],{"type":21,"tag":209,"props":44607,"children":44608},{"style":222},[44609],{"type":26,"value":368},{"type":21,"tag":209,"props":44611,"children":44612},{"style":216},[44613],{"type":26,"value":5370},{"type":21,"tag":209,"props":44615,"children":44616},{"style":222},[44617],{"type":26,"value":368},{"type":21,"tag":209,"props":44619,"children":44620},{"style":400},[44621],{"type":26,"value":34249},{"type":21,"tag":209,"props":44623,"children":44624},{"style":222},[44625],{"type":26,"value":408},{"type":21,"tag":209,"props":44627,"children":44628},{"style":400},[44629],{"type":26,"value":38277},{"type":21,"tag":209,"props":44631,"children":44632},{"style":222},[44633],{"type":26,"value":408},{"type":21,"tag":209,"props":44635,"children":44636},{"style":400},[44637],{"type":26,"value":38118},{"type":21,"tag":209,"props":44639,"children":44640},{"style":222},[44641],{"type":26,"value":408},{"type":21,"tag":209,"props":44643,"children":44644},{"style":400},[44645],{"type":26,"value":10250},{"type":21,"tag":209,"props":44647,"children":44648},{"style":222},[44649],{"type":26,"value":408},{"type":21,"tag":209,"props":44651,"children":44652},{"style":400},[44653],{"type":26,"value":38639},{"type":21,"tag":209,"props":44655,"children":44656},{"style":222},[44657],{"type":26,"value":408},{"type":21,"tag":209,"props":44659,"children":44660},{"style":400},[44661],{"type":26,"value":41056},{"type":21,"tag":209,"props":44663,"children":44664},{"style":222},[44665],{"type":26,"value":2369},{"type":21,"tag":209,"props":44667,"children":44668},{"class":211,"line":334},[44669,44673,44677,44681,44685],{"type":21,"tag":209,"props":44670,"children":44671},{"style":216},[44672],{"type":26,"value":10405},{"type":21,"tag":209,"props":44674,"children":44675},{"style":360},[44676],{"type":26,"value":41072},{"type":21,"tag":209,"props":44678,"children":44679},{"style":216},[44680],{"type":26,"value":271},{"type":21,"tag":209,"props":44682,"children":44683},{"style":216},[44684],{"type":26,"value":4766},{"type":21,"tag":209,"props":44686,"children":44687},{"style":222},[44688],{"type":26,"value":2561},{"type":21,"tag":209,"props":44690,"children":44691},{"class":211,"line":343},[44692,44696,44700,44704,44708,44712],{"type":21,"tag":209,"props":44693,"children":44694},{"style":216},[44695],{"type":26,"value":15619},{"type":21,"tag":209,"props":44697,"children":44698},{"style":216},[44699],{"type":26,"value":4667},{"type":21,"tag":209,"props":44701,"children":44702},{"style":360},[44703],{"type":26,"value":18752},{"type":21,"tag":209,"props":44705,"children":44706},{"style":222},[44707],{"type":26,"value":368},{"type":21,"tag":209,"props":44709,"children":44710},{"style":233},[44711],{"type":26,"value":41108},{"type":21,"tag":209,"props":44713,"children":44714},{"style":222},[44715],{"type":26,"value":2608},{"type":21,"tag":209,"props":44717,"children":44718},{"class":211,"line":351},[44719],{"type":21,"tag":209,"props":44720,"children":44721},{"style":222},[44722],{"type":26,"value":2251},{"type":21,"tag":209,"props":44724,"children":44725},{"class":211,"line":444},[44726,44730,44734,44738,44742],{"type":21,"tag":209,"props":44727,"children":44728},{"style":222},[44729],{"type":26,"value":41127},{"type":21,"tag":209,"props":44731,"children":44732},{"style":216},[44733],{"type":26,"value":1432},{"type":21,"tag":209,"props":44735,"children":44736},{"style":222},[44737],{"type":26,"value":41136},{"type":21,"tag":209,"props":44739,"children":44740},{"style":263},[44741],{"type":26,"value":37016},{"type":21,"tag":209,"props":44743,"children":44744},{"style":222},[44745],{"type":26,"value":41145},{"type":21,"tag":209,"props":44747,"children":44748},{"class":211,"line":454},[44749,44753,44757],{"type":21,"tag":209,"props":44750,"children":44751},{"style":222},[44752],{"type":26,"value":41153},{"type":21,"tag":209,"props":44754,"children":44755},{"style":216},[44756],{"type":26,"value":1432},{"type":21,"tag":209,"props":44758,"children":44759},{"style":222},[44760],{"type":26,"value":41162},{"type":21,"tag":209,"props":44762,"children":44763},{"class":211,"line":463},[44764],{"type":21,"tag":209,"props":44765,"children":44766},{"emptyLinePlaceholder":248},[44767],{"type":26,"value":251},{"type":21,"tag":209,"props":44769,"children":44770},{"class":211,"line":472},[44771],{"type":21,"tag":209,"props":44772,"children":44773},{"style":448},[44774],{"type":26,"value":4697},{"type":21,"tag":209,"props":44776,"children":44777},{"class":211,"line":480},[44778],{"type":21,"tag":209,"props":44779,"children":44780},{"style":448},[44781],{"type":26,"value":41184},{"type":21,"tag":209,"props":44783,"children":44784},{"class":211,"line":489},[44785],{"type":21,"tag":209,"props":44786,"children":44787},{"style":448},[44788],{"type":26,"value":4753},{"type":21,"tag":209,"props":44790,"children":44791},{"class":211,"line":847},[44792,44796,44800,44804,44808,44812,44816,44820,44824,44828,44832],{"type":21,"tag":209,"props":44793,"children":44794},{"style":222},[44795],{"type":26,"value":41199},{"type":21,"tag":209,"props":44797,"children":44798},{"style":360},[44799],{"type":26,"value":41204},{"type":21,"tag":209,"props":44801,"children":44802},{"style":216},[44803],{"type":26,"value":271},{"type":21,"tag":209,"props":44805,"children":44806},{"style":216},[44807],{"type":26,"value":4766},{"type":21,"tag":209,"props":44809,"children":44810},{"style":222},[44811],{"type":26,"value":368},{"type":21,"tag":209,"props":44813,"children":44814},{"style":400},[44815],{"type":26,"value":41221},{"type":21,"tag":209,"props":44817,"children":44818},{"style":222},[44819],{"type":26,"value":408},{"type":21,"tag":209,"props":44821,"children":44822},{"style":400},[44823],{"type":26,"value":41230},{"type":21,"tag":209,"props":44825,"children":44826},{"style":222},[44827],{"type":26,"value":408},{"type":21,"tag":209,"props":44829,"children":44830},{"style":400},[44831],{"type":26,"value":29825},{"type":21,"tag":209,"props":44833,"children":44834},{"style":222},[44835],{"type":26,"value":2369},{"type":21,"tag":209,"props":44837,"children":44838},{"class":211,"line":860},[44839,44843,44847,44851,44855,44859],{"type":21,"tag":209,"props":44840,"children":44841},{"style":216},[44842],{"type":26,"value":3069},{"type":21,"tag":209,"props":44844,"children":44845},{"style":222},[44846],{"type":26,"value":41254},{"type":21,"tag":209,"props":44848,"children":44849},{"style":360},[44850],{"type":26,"value":41259},{"type":21,"tag":209,"props":44852,"children":44853},{"style":222},[44854],{"type":26,"value":368},{"type":21,"tag":209,"props":44856,"children":44857},{"style":263},[44858],{"type":26,"value":2508},{"type":21,"tag":209,"props":44860,"children":44861},{"style":222},[44862],{"type":26,"value":41272},{"type":21,"tag":209,"props":44864,"children":44865},{"class":211,"line":877},[44866],{"type":21,"tag":209,"props":44867,"children":44868},{"style":222},[44869],{"type":26,"value":4850},{"type":21,"tag":209,"props":44871,"children":44872},{"class":211,"line":889},[44873],{"type":21,"tag":209,"props":44874,"children":44875},{"emptyLinePlaceholder":248},[44876],{"type":26,"value":251},{"type":21,"tag":209,"props":44878,"children":44879},{"class":211,"line":902},[44880],{"type":21,"tag":209,"props":44881,"children":44882},{"style":448},[44883],{"type":26,"value":4697},{"type":21,"tag":209,"props":44885,"children":44886},{"class":211,"line":914},[44887],{"type":21,"tag":209,"props":44888,"children":44889},{"style":448},[44890],{"type":26,"value":41301},{"type":21,"tag":209,"props":44892,"children":44893},{"class":211,"line":922},[44894],{"type":21,"tag":209,"props":44895,"children":44896},{"style":448},[44897],{"type":26,"value":4753},{"type":21,"tag":209,"props":44899,"children":44900},{"class":211,"line":2312},[44901,44905,44909,44913,44917,44921,44925,44929,44933,44937,44941],{"type":21,"tag":209,"props":44902,"children":44903},{"style":222},[44904],{"type":26,"value":41199},{"type":21,"tag":209,"props":44906,"children":44907},{"style":360},[44908],{"type":26,"value":41320},{"type":21,"tag":209,"props":44910,"children":44911},{"style":216},[44912],{"type":26,"value":271},{"type":21,"tag":209,"props":44914,"children":44915},{"style":216},[44916],{"type":26,"value":4766},{"type":21,"tag":209,"props":44918,"children":44919},{"style":222},[44920],{"type":26,"value":368},{"type":21,"tag":209,"props":44922,"children":44923},{"style":400},[44924],{"type":26,"value":41221},{"type":21,"tag":209,"props":44926,"children":44927},{"style":222},[44928],{"type":26,"value":408},{"type":21,"tag":209,"props":44930,"children":44931},{"style":400},[44932],{"type":26,"value":41230},{"type":21,"tag":209,"props":44934,"children":44935},{"style":222},[44936],{"type":26,"value":408},{"type":21,"tag":209,"props":44938,"children":44939},{"style":400},[44940],{"type":26,"value":29825},{"type":21,"tag":209,"props":44942,"children":44943},{"style":222},[44944],{"type":26,"value":2369},{"type":21,"tag":209,"props":44946,"children":44947},{"class":211,"line":2321},[44948,44952,44956,44960,44964,44968],{"type":21,"tag":209,"props":44949,"children":44950},{"style":216},[44951],{"type":26,"value":5925},{"type":21,"tag":209,"props":44953,"children":44954},{"style":222},[44955],{"type":26,"value":41368},{"type":21,"tag":209,"props":44957,"children":44958},{"style":216},[44959],{"type":26,"value":1432},{"type":21,"tag":209,"props":44961,"children":44962},{"style":222},[44963],{"type":26,"value":41377},{"type":21,"tag":209,"props":44965,"children":44966},{"style":360},[44967],{"type":26,"value":38684},{"type":21,"tag":209,"props":44969,"children":44970},{"style":222},[44971],{"type":26,"value":41386},{"type":21,"tag":209,"props":44973,"children":44974},{"class":211,"line":2372},[44975,44979,44983,44987,44991],{"type":21,"tag":209,"props":44976,"children":44977},{"style":222},[44978],{"type":26,"value":41394},{"type":21,"tag":209,"props":44980,"children":44981},{"style":216},[44982],{"type":26,"value":1432},{"type":21,"tag":209,"props":44984,"children":44985},{"style":222},[44986],{"type":26,"value":26905},{"type":21,"tag":209,"props":44988,"children":44989},{"style":360},[44990],{"type":26,"value":26910},{"type":21,"tag":209,"props":44992,"children":44993},{"style":222},[44994],{"type":26,"value":5405},{"type":21,"tag":209,"props":44996,"children":44997},{"class":211,"line":2381},[44998,45002,45006,45010,45014],{"type":21,"tag":209,"props":44999,"children":45000},{"style":222},[45001],{"type":26,"value":41418},{"type":21,"tag":209,"props":45003,"children":45004},{"style":216},[45005],{"type":26,"value":1432},{"type":21,"tag":209,"props":45007,"children":45008},{"style":222},[45009],{"type":26,"value":28259},{"type":21,"tag":209,"props":45011,"children":45012},{"style":360},[45013],{"type":26,"value":27809},{"type":21,"tag":209,"props":45015,"children":45016},{"style":222},[45017],{"type":26,"value":5405},{"type":21,"tag":209,"props":45019,"children":45020},{"class":211,"line":2389},[45021],{"type":21,"tag":209,"props":45022,"children":45023},{"style":222},[45024],{"type":26,"value":41442},{"type":21,"tag":209,"props":45026,"children":45027},{"class":211,"line":2397},[45028],{"type":21,"tag":209,"props":45029,"children":45030},{"style":222},[45031],{"type":26,"value":41450},{"type":21,"tag":209,"props":45033,"children":45034},{"class":211,"line":2406},[45035],{"type":21,"tag":209,"props":45036,"children":45037},{"emptyLinePlaceholder":248},[45038],{"type":26,"value":251},{"type":21,"tag":209,"props":45040,"children":45041},{"class":211,"line":2415},[45042,45046,45050,45054,45058,45062,45066,45070,45074,45078,45082,45086,45090,45094,45098,45102,45106,45110,45114,45118,45122],{"type":21,"tag":209,"props":45043,"children":45044},{"style":222},[45045],{"type":26,"value":41465},{"type":21,"tag":209,"props":45047,"children":45048},{"style":216},[45049],{"type":26,"value":1432},{"type":21,"tag":209,"props":45051,"children":45052},{"style":222},[45053],{"type":26,"value":41474},{"type":21,"tag":209,"props":45055,"children":45056},{"style":216},[45057],{"type":26,"value":15218},{"type":21,"tag":209,"props":45059,"children":45060},{"style":222},[45061],{"type":26,"value":41377},{"type":21,"tag":209,"props":45063,"children":45064},{"style":360},[45065],{"type":26,"value":32249},{"type":21,"tag":209,"props":45067,"children":45068},{"style":222},[45069],{"type":26,"value":41491},{"type":21,"tag":209,"props":45071,"children":45072},{"style":233},[45073],{"type":26,"value":41496},{"type":21,"tag":209,"props":45075,"children":45076},{"style":222},[45077],{"type":26,"value":432},{"type":21,"tag":209,"props":45079,"children":45080},{"style":216},[45081],{"type":26,"value":191},{"type":21,"tag":209,"props":45083,"children":45084},{"style":222},[45085],{"type":26,"value":41509},{"type":21,"tag":209,"props":45087,"children":45088},{"style":216},[45089],{"type":26,"value":15218},{"type":21,"tag":209,"props":45091,"children":45092},{"style":222},[45093],{"type":26,"value":41377},{"type":21,"tag":209,"props":45095,"children":45096},{"style":360},[45097],{"type":26,"value":32249},{"type":21,"tag":209,"props":45099,"children":45100},{"style":222},[45101],{"type":26,"value":41526},{"type":21,"tag":209,"props":45103,"children":45104},{"style":233},[45105],{"type":26,"value":41496},{"type":21,"tag":209,"props":45107,"children":45108},{"style":222},[45109],{"type":26,"value":432},{"type":21,"tag":209,"props":45111,"children":45112},{"style":216},[45113],{"type":26,"value":191},{"type":21,"tag":209,"props":45115,"children":45116},{"style":216},[45117],{"type":26,"value":41543},{"type":21,"tag":209,"props":45119,"children":45120},{"style":263},[45121],{"type":26,"value":17197},{"type":21,"tag":209,"props":45123,"children":45124},{"style":222},[45125],{"type":26,"value":241},{"type":21,"tag":209,"props":45127,"children":45128},{"class":211,"line":2424},[45129],{"type":21,"tag":209,"props":45130,"children":45131},{"style":448},[45132],{"type":26,"value":41559},{"type":21,"tag":209,"props":45134,"children":45135},{"class":211,"line":2433},[45136,45140,45144,45148,45152,45156],{"type":21,"tag":209,"props":45137,"children":45138},{"style":216},[45139],{"type":26,"value":5803},{"type":21,"tag":209,"props":45141,"children":45142},{"style":222},[45143],{"type":26,"value":4776},{"type":21,"tag":209,"props":45145,"children":45146},{"style":216},[45147],{"type":26,"value":15052},{"type":21,"tag":209,"props":45149,"children":45150},{"style":222},[45151],{"type":26,"value":41579},{"type":21,"tag":209,"props":45153,"children":45154},{"style":360},[45155],{"type":26,"value":41584},{"type":21,"tag":209,"props":45157,"children":45158},{"style":222},[45159],{"type":26,"value":4842},{"type":21,"tag":209,"props":45161,"children":45162},{"class":211,"line":2442},[45163,45167,45171,45175,45179,45183,45187,45191,45195],{"type":21,"tag":209,"props":45164,"children":45165},{"style":222},[45166],{"type":26,"value":41604},{"type":21,"tag":209,"props":45168,"children":45169},{"style":216},[45170],{"type":26,"value":1432},{"type":21,"tag":209,"props":45172,"children":45173},{"style":222},[45174],{"type":26,"value":41613},{"type":21,"tag":209,"props":45176,"children":45177},{"style":263},[45178],{"type":26,"value":37016},{"type":21,"tag":209,"props":45180,"children":45181},{"style":222},[45182],{"type":26,"value":41622},{"type":21,"tag":209,"props":45184,"children":45185},{"style":360},[45186],{"type":26,"value":41259},{"type":21,"tag":209,"props":45188,"children":45189},{"style":222},[45190],{"type":26,"value":368},{"type":21,"tag":209,"props":45192,"children":45193},{"style":263},[45194],{"type":26,"value":2508},{"type":21,"tag":209,"props":45196,"children":45197},{"style":222},[45198],{"type":26,"value":41639},{"type":21,"tag":209,"props":45200,"children":45201},{"class":211,"line":2471},[45202],{"type":21,"tag":209,"props":45203,"children":45204},{"style":448},[45205],{"type":26,"value":41647},{"type":21,"tag":209,"props":45207,"children":45208},{"class":211,"line":2480},[45209,45213,45217,45221,45225,45229,45233,45237,45241,45245,45249,45253,45257,45261],{"type":21,"tag":209,"props":45210,"children":45211},{"style":216},[45212],{"type":26,"value":5803},{"type":21,"tag":209,"props":45214,"children":45215},{"style":222},[45216],{"type":26,"value":4776},{"type":21,"tag":209,"props":45218,"children":45219},{"style":216},[45220],{"type":26,"value":15052},{"type":21,"tag":209,"props":45222,"children":45223},{"style":222},[45224],{"type":26,"value":41667},{"type":21,"tag":209,"props":45226,"children":45227},{"style":216},[45228],{"type":26,"value":15578},{"type":21,"tag":209,"props":45230,"children":45231},{"style":222},[45232],{"type":26,"value":41676},{"type":21,"tag":209,"props":45234,"children":45235},{"style":216},[45236],{"type":26,"value":1432},{"type":21,"tag":209,"props":45238,"children":45239},{"style":222},[45240],{"type":26,"value":41685},{"type":21,"tag":209,"props":45242,"children":45243},{"style":216},[45244],{"type":26,"value":4677},{"type":21,"tag":209,"props":45246,"children":45247},{"style":222},[45248],{"type":26,"value":41694},{"type":21,"tag":209,"props":45250,"children":45251},{"style":360},[45252],{"type":26,"value":41699},{"type":21,"tag":209,"props":45254,"children":45255},{"style":222},[45256],{"type":26,"value":41704},{"type":21,"tag":209,"props":45258,"children":45259},{"style":216},[45260],{"type":26,"value":4677},{"type":21,"tag":209,"props":45262,"children":45263},{"style":222},[45264],{"type":26,"value":32274},{"type":21,"tag":209,"props":45266,"children":45267},{"class":211,"line":2489},[45268,45272,45276,45280,45284,45288,45292,45296,45300,45304,45308,45312,45316,45320,45324,45328],{"type":21,"tag":209,"props":45269,"children":45270},{"style":216},[45271],{"type":26,"value":5803},{"type":21,"tag":209,"props":45273,"children":45274},{"style":222},[45275],{"type":26,"value":41724},{"type":21,"tag":209,"props":45277,"children":45278},{"style":216},[45279],{"type":26,"value":6102},{"type":21,"tag":209,"props":45281,"children":45282},{"style":263},[45283],{"type":26,"value":41733},{"type":21,"tag":209,"props":45285,"children":45286},{"style":216},[45287],{"type":26,"value":18721},{"type":21,"tag":209,"props":45289,"children":45290},{"style":222},[45291],{"type":26,"value":41742},{"type":21,"tag":209,"props":45293,"children":45294},{"style":216},[45295],{"type":26,"value":6102},{"type":21,"tag":209,"props":45297,"children":45298},{"style":216},[45299],{"type":26,"value":41543},{"type":21,"tag":209,"props":45301,"children":45302},{"style":263},[45303],{"type":26,"value":17197},{"type":21,"tag":209,"props":45305,"children":45306},{"style":222},[45307],{"type":26,"value":432},{"type":21,"tag":209,"props":45309,"children":45310},{"style":216},[45311],{"type":26,"value":15578},{"type":21,"tag":209,"props":45313,"children":45314},{"style":222},[45315],{"type":26,"value":41767},{"type":21,"tag":209,"props":45317,"children":45318},{"style":216},[45319],{"type":26,"value":6102},{"type":21,"tag":209,"props":45321,"children":45322},{"style":263},[45323],{"type":26,"value":6243},{"type":21,"tag":209,"props":45325,"children":45326},{"style":216},[45327],{"type":26,"value":15539},{"type":21,"tag":209,"props":45329,"children":45330},{"style":222},[45331],{"type":26,"value":41784},{"type":21,"tag":209,"props":45333,"children":45334},{"class":211,"line":2516},[45335,45339,45343],{"type":21,"tag":209,"props":45336,"children":45337},{"style":222},[45338],{"type":26,"value":41792},{"type":21,"tag":209,"props":45340,"children":45341},{"style":216},[45342],{"type":26,"value":1432},{"type":21,"tag":209,"props":45344,"children":45345},{"style":222},[45346],{"type":26,"value":41801},{"type":21,"tag":209,"props":45348,"children":45349},{"class":211,"line":2525},[45350],{"type":21,"tag":209,"props":45351,"children":45352},{"style":222},[45353],{"type":26,"value":2235},{"type":21,"tag":209,"props":45355,"children":45356},{"class":211,"line":2533},[45357],{"type":21,"tag":209,"props":45358,"children":45359},{"style":448},[45360],{"type":26,"value":45361},"        // Determine which websocket to use - set in options, on model, or on global app\n",{"type":21,"tag":209,"props":45363,"children":45364},{"class":211,"line":2542},[45365,45369,45373,45377,45381,45386,45390],{"type":21,"tag":209,"props":45366,"children":45367},{"style":222},[45368],{"type":26,"value":41824},{"type":21,"tag":209,"props":45370,"children":45371},{"style":216},[45372],{"type":26,"value":1432},{"type":21,"tag":209,"props":45374,"children":45375},{"style":222},[45376],{"type":26,"value":41833},{"type":21,"tag":209,"props":45378,"children":45379},{"style":216},[45380],{"type":26,"value":4677},{"type":21,"tag":209,"props":45382,"children":45383},{"style":222},[45384],{"type":26,"value":45385}," model.socket ",{"type":21,"tag":209,"props":45387,"children":45388},{"style":216},[45389],{"type":26,"value":4677},{"type":21,"tag":209,"props":45391,"children":45392},{"style":222},[45393],{"type":26,"value":45394}," app.socket;\n",{"type":21,"tag":209,"props":45396,"children":45397},{"class":211,"line":2550},[45398],{"type":21,"tag":209,"props":45399,"children":45400},{"style":448},[45401],{"type":26,"value":45402},"        // Trigger the app event aggregator for interested listeners to know we're about to request data via websocket\n",{"type":21,"tag":209,"props":45404,"children":45405},{"class":211,"line":2564},[45406,45411,45415,45419,45424],{"type":21,"tag":209,"props":45407,"children":45408},{"style":222},[45409],{"type":26,"value":45410},"        app.vent.",{"type":21,"tag":209,"props":45412,"children":45413},{"style":360},[45414],{"type":26,"value":499},{"type":21,"tag":209,"props":45416,"children":45417},{"style":222},[45418],{"type":26,"value":368},{"type":21,"tag":209,"props":45420,"children":45421},{"style":233},[45422],{"type":26,"value":45423},"'backbone:request'",{"type":21,"tag":209,"props":45425,"children":45426},{"style":222},[45427],{"type":26,"value":45428},", namespace);\n",{"type":21,"tag":209,"props":45430,"children":45431},{"class":211,"line":2611},[45432],{"type":21,"tag":209,"props":45433,"children":45434},{"style":448},[45435],{"type":26,"value":41850},{"type":21,"tag":209,"props":45437,"children":45438},{"class":211,"line":2619},[45439,45443,45447,45451,45455,45459,45463,45467,45471],{"type":21,"tag":209,"props":45440,"children":45441},{"style":222},[45442],{"type":26,"value":41858},{"type":21,"tag":209,"props":45444,"children":45445},{"style":360},[45446],{"type":26,"value":41863},{"type":21,"tag":209,"props":45448,"children":45449},{"style":222},[45450],{"type":26,"value":41868},{"type":21,"tag":209,"props":45452,"children":45453},{"style":216},[45454],{"type":26,"value":10237},{"type":21,"tag":209,"props":45456,"children":45457},{"style":222},[45458],{"type":26,"value":41877},{"type":21,"tag":209,"props":45460,"children":45461},{"style":216},[45462],{"type":26,"value":5370},{"type":21,"tag":209,"props":45464,"children":45465},{"style":222},[45466],{"type":26,"value":368},{"type":21,"tag":209,"props":45468,"children":45469},{"style":400},[45470],{"type":26,"value":1385},{"type":21,"tag":209,"props":45472,"children":45473},{"style":222},[45474],{"type":26,"value":2369},{"type":21,"tag":209,"props":45476,"children":45477},{"class":211,"line":2627},[45478,45482,45486,45490,45494,45498],{"type":21,"tag":209,"props":45479,"children":45480},{"style":216},[45481],{"type":26,"value":5959},{"type":21,"tag":209,"props":45483,"children":45484},{"style":222},[45485],{"type":26,"value":41905},{"type":21,"tag":209,"props":45487,"children":45488},{"style":216},[45489],{"type":26,"value":1432},{"type":21,"tag":209,"props":45491,"children":45492},{"style":222},[45493],{"type":26,"value":41914},{"type":21,"tag":209,"props":45495,"children":45496},{"style":216},[45497],{"type":26,"value":15578},{"type":21,"tag":209,"props":45499,"children":45500},{"style":222},[45501],{"type":26,"value":45502}," res.success);\n",{"type":21,"tag":209,"props":45504,"children":45505},{"class":211,"line":2636},[45506],{"type":21,"tag":209,"props":45507,"children":45508},{"style":448},[45509],{"type":26,"value":45510},"            // Trigger the app event aggregator to indicate we've received a return from the server, and success\n",{"type":21,"tag":209,"props":45512,"children":45513},{"class":211,"line":2644},[45514,45519,45523,45527,45532],{"type":21,"tag":209,"props":45515,"children":45516},{"style":222},[45517],{"type":26,"value":45518},"            app.vent.",{"type":21,"tag":209,"props":45520,"children":45521},{"style":360},[45522],{"type":26,"value":499},{"type":21,"tag":209,"props":45524,"children":45525},{"style":222},[45526],{"type":26,"value":368},{"type":21,"tag":209,"props":45528,"children":45529},{"style":233},[45530],{"type":26,"value":45531},"'backbone:receive'",{"type":21,"tag":209,"props":45533,"children":45534},{"style":222},[45535],{"type":26,"value":45536},", namespace, success);\n",{"type":21,"tag":209,"props":45538,"children":45539},{"class":211,"line":2657},[45540,45544],{"type":21,"tag":209,"props":45541,"children":45542},{"style":216},[45543],{"type":26,"value":6083},{"type":21,"tag":209,"props":45545,"children":45546},{"style":222},[45547],{"type":26,"value":41940},{"type":21,"tag":209,"props":45549,"children":45550},{"class":211,"line":2728},[45551],{"type":21,"tag":209,"props":45552,"children":45553},{"style":222},[45554],{"type":26,"value":16576},{"type":21,"tag":209,"props":45556,"children":45557},{"class":211,"line":2758},[45558,45562,45566,45570,45574,45578],{"type":21,"tag":209,"props":45559,"children":45560},{"style":216},[45561],{"type":26,"value":41955},{"type":21,"tag":209,"props":45563,"children":45564},{"style":222},[45565],{"type":26,"value":41960},{"type":21,"tag":209,"props":45567,"children":45568},{"style":360},[45569],{"type":26,"value":41965},{"type":21,"tag":209,"props":45571,"children":45572},{"style":222},[45573],{"type":26,"value":41970},{"type":21,"tag":209,"props":45575,"children":45576},{"style":360},[45577],{"type":26,"value":31639},{"type":21,"tag":209,"props":45579,"children":45580},{"style":222},[45581],{"type":26,"value":25195},{"type":21,"tag":209,"props":45583,"children":45584},{"class":211,"line":2776},[45585,45589,45593],{"type":21,"tag":209,"props":45586,"children":45587},{"style":222},[45588],{"type":26,"value":28462},{"type":21,"tag":209,"props":45590,"children":45591},{"style":360},[45592],{"type":26,"value":5590},{"type":21,"tag":209,"props":45594,"children":45595},{"style":222},[45596],{"type":26,"value":25195},{"type":21,"tag":209,"props":45598,"children":45599},{"class":211,"line":2785},[45600,45604],{"type":21,"tag":209,"props":45601,"children":45602},{"style":216},[45603],{"type":26,"value":5653},{"type":21,"tag":209,"props":45605,"children":45606},{"style":222},[45607],{"type":26,"value":241},{"type":21,"tag":209,"props":45609,"children":45610},{"class":211,"line":2793},[45611],{"type":21,"tag":209,"props":45612,"children":45613},{"style":222},[45614],{"type":26,"value":6136},{"type":21,"tag":209,"props":45616,"children":45617},{"class":211,"line":2801},[45618,45622,45626,45630,45634,45638],{"type":21,"tag":209,"props":45619,"children":45620},{"style":216},[45621],{"type":26,"value":6083},{"type":21,"tag":209,"props":45623,"children":45624},{"style":222},[45625],{"type":26,"value":41960},{"type":21,"tag":209,"props":45627,"children":45628},{"style":360},[45629],{"type":26,"value":41965},{"type":21,"tag":209,"props":45631,"children":45632},{"style":222},[45633],{"type":26,"value":42031},{"type":21,"tag":209,"props":45635,"children":45636},{"style":360},[45637],{"type":26,"value":10685},{"type":21,"tag":209,"props":45639,"children":45640},{"style":222},[45641],{"type":26,"value":25195},{"type":21,"tag":209,"props":45643,"children":45644},{"class":211,"line":2809},[45645,45649,45653],{"type":21,"tag":209,"props":45646,"children":45647},{"style":222},[45648],{"type":26,"value":30916},{"type":21,"tag":209,"props":45650,"children":45651},{"style":360},[45652],{"type":26,"value":5599},{"type":21,"tag":209,"props":45654,"children":45655},{"style":222},[45656],{"type":26,"value":25195},{"type":21,"tag":209,"props":45658,"children":45659},{"class":211,"line":6219},[45660],{"type":21,"tag":209,"props":45661,"children":45662},{"style":222},[45663],{"type":26,"value":5114},{"type":21,"tag":209,"props":45665,"children":45666},{"class":211,"line":6228},[45667],{"type":21,"tag":209,"props":45668,"children":45669},{"emptyLinePlaceholder":248},[45670],{"type":26,"value":251},{"type":21,"tag":209,"props":45672,"children":45673},{"class":211,"line":6250},[45674],{"type":21,"tag":209,"props":45675,"children":45676},{"style":448},[45677],{"type":26,"value":42076},{"type":21,"tag":209,"props":45679,"children":45680},{"class":211,"line":6258},[45681,45685,45689,45693,45697],{"type":21,"tag":209,"props":45682,"children":45683},{"style":222},[45684],{"type":26,"value":41858},{"type":21,"tag":209,"props":45686,"children":45687},{"style":360},[45688],{"type":26,"value":42088},{"type":21,"tag":209,"props":45690,"children":45691},{"style":222},[45692],{"type":26,"value":41868},{"type":21,"tag":209,"props":45694,"children":45695},{"style":216},[45696],{"type":26,"value":10237},{"type":21,"tag":209,"props":45698,"children":45699},{"style":222},[45700],{"type":26,"value":42101},{"type":21,"tag":209,"props":45702,"children":45703},{"class":211,"line":6267},[45704],{"type":21,"tag":209,"props":45705,"children":45706},{"emptyLinePlaceholder":248},[45707],{"type":26,"value":251},{"type":21,"tag":209,"props":45709,"children":45710},{"class":211,"line":6303},[45711],{"type":21,"tag":209,"props":45712,"children":45713},{"style":448},[45714],{"type":26,"value":42116},{"type":21,"tag":209,"props":45716,"children":45717},{"class":211,"line":6336},[45718,45722,45726,45730,45734],{"type":21,"tag":209,"props":45719,"children":45720},{"style":222},[45721],{"type":26,"value":42124},{"type":21,"tag":209,"props":45723,"children":45724},{"style":360},[45725],{"type":26,"value":499},{"type":21,"tag":209,"props":45727,"children":45728},{"style":222},[45729],{"type":26,"value":368},{"type":21,"tag":209,"props":45731,"children":45732},{"style":233},[45733],{"type":26,"value":35705},{"type":21,"tag":209,"props":45735,"children":45736},{"style":222},[45737],{"type":26,"value":42141},{"type":21,"tag":209,"props":45739,"children":45740},{"class":211,"line":6369},[45741],{"type":21,"tag":209,"props":45742,"children":45743},{"style":448},[45744],{"type":26,"value":42149},{"type":21,"tag":209,"props":45746,"children":45747},{"class":211,"line":6378},[45748,45752],{"type":21,"tag":209,"props":45749,"children":45750},{"style":216},[45751],{"type":26,"value":3069},{"type":21,"tag":209,"props":45753,"children":45754},{"style":222},[45755],{"type":26,"value":42161},{"type":21,"tag":209,"props":45757,"children":45758},{"class":211,"line":6387},[45759],{"type":21,"tag":209,"props":45760,"children":45761},{"style":222},[45762],{"type":26,"value":4850},{"type":21,"tag":209,"props":45764,"children":45765},{"class":211,"line":6395},[45766],{"type":21,"tag":209,"props":45767,"children":45768},{"emptyLinePlaceholder":248},[45769],{"type":26,"value":251},{"type":21,"tag":209,"props":45771,"children":45772},{"class":211,"line":6404},[45773],{"type":21,"tag":209,"props":45774,"children":45775},{"style":448},[45776],{"type":26,"value":4697},{"type":21,"tag":209,"props":45778,"children":45779},{"class":211,"line":6413},[45780],{"type":21,"tag":209,"props":45781,"children":45782},{"style":448},[45783],{"type":26,"value":42190},{"type":21,"tag":209,"props":45785,"children":45786},{"class":211,"line":6447},[45787],{"type":21,"tag":209,"props":45788,"children":45789},{"style":448},[45790],{"type":26,"value":42198},{"type":21,"tag":209,"props":45792,"children":45793},{"class":211,"line":6479},[45794],{"type":21,"tag":209,"props":45795,"children":45796},{"style":448},[45797],{"type":26,"value":42206},{"type":21,"tag":209,"props":45799,"children":45800},{"class":211,"line":6511},[45801],{"type":21,"tag":209,"props":45802,"children":45803},{"style":448},[45804],{"type":26,"value":42214},{"type":21,"tag":209,"props":45806,"children":45807},{"class":211,"line":6519},[45808,45812,45816,45820],{"type":21,"tag":209,"props":45809,"children":45810},{"style":448},[45811],{"type":26,"value":4713},{"type":21,"tag":209,"props":45813,"children":45814},{"style":216},[45815],{"type":26,"value":4718},{"type":21,"tag":209,"props":45817,"children":45818},{"style":360},[45819],{"type":26,"value":42230},{"type":21,"tag":209,"props":45821,"children":45822},{"style":222},[45823],{"type":26,"value":42235},{"type":21,"tag":209,"props":45825,"children":45826},{"class":211,"line":6527},[45827],{"type":21,"tag":209,"props":45828,"children":45829},{"style":448},[45830],{"type":26,"value":4753},{"type":21,"tag":209,"props":45832,"children":45833},{"class":211,"line":6535},[45834,45838,45842,45846,45850,45854,45858,45862,45866],{"type":21,"tag":209,"props":45835,"children":45836},{"style":222},[45837],{"type":26,"value":42250},{"type":21,"tag":209,"props":45839,"children":45840},{"style":263},[45841],{"type":26,"value":37016},{"type":21,"tag":209,"props":45843,"children":45844},{"style":222},[45845],{"type":26,"value":378},{"type":21,"tag":209,"props":45847,"children":45848},{"style":360},[45849],{"type":26,"value":42263},{"type":21,"tag":209,"props":45851,"children":45852},{"style":216},[45853],{"type":26,"value":271},{"type":21,"tag":209,"props":45855,"children":45856},{"style":216},[45857],{"type":26,"value":4766},{"type":21,"tag":209,"props":45859,"children":45860},{"style":222},[45861],{"type":26,"value":368},{"type":21,"tag":209,"props":45863,"children":45864},{"style":400},[45865],{"type":26,"value":15147},{"type":21,"tag":209,"props":45867,"children":45868},{"style":222},[45869],{"type":26,"value":2369},{"type":21,"tag":209,"props":45871,"children":45872},{"class":211,"line":6543},[45873,45877,45881,45885,45889,45893,45897,45901],{"type":21,"tag":209,"props":45874,"children":45875},{"style":222},[45876],{"type":26,"value":42291},{"type":21,"tag":209,"props":45878,"children":45879},{"style":216},[45880],{"type":26,"value":1432},{"type":21,"tag":209,"props":45882,"children":45883},{"style":222},[45884],{"type":26,"value":15277},{"type":21,"tag":209,"props":45886,"children":45887},{"style":216},[45888],{"type":26,"value":4677},{"type":21,"tag":209,"props":45890,"children":45891},{"style":263},[45892],{"type":26,"value":17698},{"type":21,"tag":209,"props":45894,"children":45895},{"style":222},[45896],{"type":26,"value":378},{"type":21,"tag":209,"props":45898,"children":45899},{"style":360},[45900],{"type":26,"value":15147},{"type":21,"tag":209,"props":45902,"children":45903},{"style":222},[45904],{"type":26,"value":4842},{"type":21,"tag":209,"props":45906,"children":45907},{"class":211,"line":6552},[45908,45912,45916,45920,45924,45928,45932,45936,45940,45944,45948,45952,45956,45960,45964],{"type":21,"tag":209,"props":45909,"children":45910},{"style":216},[45911],{"type":26,"value":3069},{"type":21,"tag":209,"props":45913,"children":45914},{"style":222},[45915],{"type":26,"value":41377},{"type":21,"tag":209,"props":45917,"children":45918},{"style":360},[45919],{"type":26,"value":42335},{"type":21,"tag":209,"props":45921,"children":45922},{"style":222},[45923],{"type":26,"value":42340},{"type":21,"tag":209,"props":45925,"children":45926},{"style":233},[45927],{"type":26,"value":42345},{"type":21,"tag":209,"props":45929,"children":45930},{"style":222},[45931],{"type":26,"value":2699},{"type":21,"tag":209,"props":45933,"children":45934},{"style":360},[45935],{"type":26,"value":29854},{"type":21,"tag":209,"props":45937,"children":45938},{"style":222},[45939],{"type":26,"value":368},{"type":21,"tag":209,"props":45941,"children":45942},{"style":233},[45943],{"type":26,"value":42345},{"type":21,"tag":209,"props":45945,"children":45946},{"style":222},[45947],{"type":26,"value":408},{"type":21,"tag":209,"props":45949,"children":45950},{"style":233},[45951],{"type":26,"value":42370},{"type":21,"tag":209,"props":45953,"children":45954},{"style":222},[45955],{"type":26,"value":432},{"type":21,"tag":209,"props":45957,"children":45958},{"style":216},[45959],{"type":26,"value":10237},{"type":21,"tag":209,"props":45961,"children":45962},{"style":233},[45963],{"type":26,"value":42383},{"type":21,"tag":209,"props":45965,"children":45966},{"style":222},[45967],{"type":26,"value":241},{"type":21,"tag":209,"props":45969,"children":45970},{"class":211,"line":6572},[45971],{"type":21,"tag":209,"props":45972,"children":45973},{"style":222},[45974],{"type":26,"value":4850},{"type":21,"tag":209,"props":45976,"children":45977},{"class":211,"line":6589},[45978],{"type":21,"tag":209,"props":45979,"children":45980},{"emptyLinePlaceholder":248},[45981],{"type":26,"value":251},{"type":21,"tag":209,"props":45983,"children":45984},{"class":211,"line":6597},[45985],{"type":21,"tag":209,"props":45986,"children":45987},{"style":448},[45988],{"type":26,"value":4697},{"type":21,"tag":209,"props":45990,"children":45991},{"class":211,"line":6625},[45992],{"type":21,"tag":209,"props":45993,"children":45994},{"style":448},[45995],{"type":26,"value":42416},{"type":21,"tag":209,"props":45997,"children":45998},{"class":211,"line":6648},[45999],{"type":21,"tag":209,"props":46000,"children":46001},{"style":448},[46002],{"type":26,"value":42424},{"type":21,"tag":209,"props":46004,"children":46005},{"class":211,"line":6670},[46006],{"type":21,"tag":209,"props":46007,"children":46008},{"style":448},[46009],{"type":26,"value":42432},{"type":21,"tag":209,"props":46011,"children":46012},{"class":211,"line":6678},[46013],{"type":21,"tag":209,"props":46014,"children":46015},{"style":448},[46016],{"type":26,"value":14136},{"type":21,"tag":209,"props":46018,"children":46019},{"class":211,"line":6686},[46020,46024,46028,46032,46036,46040,46044,46048,46052],{"type":21,"tag":209,"props":46021,"children":46022},{"style":222},[46023],{"type":26,"value":42447},{"type":21,"tag":209,"props":46025,"children":46026},{"style":263},[46027],{"type":26,"value":37016},{"type":21,"tag":209,"props":46029,"children":46030},{"style":222},[46031],{"type":26,"value":378},{"type":21,"tag":209,"props":46033,"children":46034},{"style":360},[46035],{"type":26,"value":42088},{"type":21,"tag":209,"props":46037,"children":46038},{"style":216},[46039],{"type":26,"value":271},{"type":21,"tag":209,"props":46041,"children":46042},{"style":216},[46043],{"type":26,"value":4766},{"type":21,"tag":209,"props":46045,"children":46046},{"style":222},[46047],{"type":26,"value":368},{"type":21,"tag":209,"props":46049,"children":46050},{"style":400},[46051],{"type":26,"value":7820},{"type":21,"tag":209,"props":46053,"children":46054},{"style":222},[46055],{"type":26,"value":2369},{"type":21,"tag":209,"props":46057,"children":46058},{"class":211,"line":6714},[46059,46063,46067,46071,46075,46079,46083,46087,46091,46095,46099,46103,46107],{"type":21,"tag":209,"props":46060,"children":46061},{"style":216},[46062],{"type":26,"value":5925},{"type":21,"tag":209,"props":46064,"children":46065},{"style":222},[46066],{"type":26,"value":42491},{"type":21,"tag":209,"props":46068,"children":46069},{"style":216},[46070],{"type":26,"value":1432},{"type":21,"tag":209,"props":46072,"children":46073},{"style":263},[46074],{"type":26,"value":42500},{"type":21,"tag":209,"props":46076,"children":46077},{"style":222},[46078],{"type":26,"value":378},{"type":21,"tag":209,"props":46080,"children":46081},{"style":263},[46082],{"type":26,"value":37016},{"type":21,"tag":209,"props":46084,"children":46085},{"style":222},[46086],{"type":26,"value":42513},{"type":21,"tag":209,"props":46088,"children":46089},{"style":360},[46090],{"type":26,"value":41259},{"type":21,"tag":209,"props":46092,"children":46093},{"style":222},[46094],{"type":26,"value":368},{"type":21,"tag":209,"props":46096,"children":46097},{"style":263},[46098],{"type":26,"value":42526},{"type":21,"tag":209,"props":46100,"children":46101},{"style":222},[46102],{"type":26,"value":408},{"type":21,"tag":209,"props":46104,"children":46105},{"style":263},[46106],{"type":26,"value":3224},{"type":21,"tag":209,"props":46108,"children":46109},{"style":222},[46110],{"type":26,"value":2608},{"type":21,"tag":209,"props":46112,"children":46113},{"class":211,"line":6747},[46114],{"type":21,"tag":209,"props":46115,"children":46116},{"emptyLinePlaceholder":248},[46117],{"type":26,"value":251},{"type":21,"tag":209,"props":46119,"children":46120},{"class":211,"line":6761},[46121,46125,46129,46133,46137,46141,46145,46149,46153],{"type":21,"tag":209,"props":46122,"children":46123},{"style":222},[46124],{"type":26,"value":42553},{"type":21,"tag":209,"props":46126,"children":46127},{"style":360},[46128],{"type":26,"value":42558},{"type":21,"tag":209,"props":46130,"children":46131},{"style":222},[46132],{"type":26,"value":368},{"type":21,"tag":209,"props":46134,"children":46135},{"style":263},[46136],{"type":26,"value":2508},{"type":21,"tag":209,"props":46138,"children":46139},{"style":222},[46140],{"type":26,"value":42571},{"type":21,"tag":209,"props":46142,"children":46143},{"style":233},[46144],{"type":26,"value":42576},{"type":21,"tag":209,"props":46146,"children":46147},{"style":222},[46148],{"type":26,"value":42581},{"type":21,"tag":209,"props":46150,"children":46151},{"style":360},[46152],{"type":26,"value":42586},{"type":21,"tag":209,"props":46154,"children":46155},{"style":222},[46156],{"type":26,"value":42591},{"type":21,"tag":209,"props":46158,"children":46159},{"class":211,"line":6769},[46160,46164,46168,46172,46176,46180,46184],{"type":21,"tag":209,"props":46161,"children":46162},{"style":222},[46163],{"type":26,"value":42553},{"type":21,"tag":209,"props":46165,"children":46166},{"style":360},[46167],{"type":26,"value":42558},{"type":21,"tag":209,"props":46169,"children":46170},{"style":222},[46171],{"type":26,"value":368},{"type":21,"tag":209,"props":46173,"children":46174},{"style":263},[46175],{"type":26,"value":2508},{"type":21,"tag":209,"props":46177,"children":46178},{"style":222},[46179],{"type":26,"value":42615},{"type":21,"tag":209,"props":46181,"children":46182},{"style":360},[46183],{"type":26,"value":42586},{"type":21,"tag":209,"props":46185,"children":46186},{"style":222},[46187],{"type":26,"value":42591},{"type":21,"tag":209,"props":46189,"children":46190},{"class":211,"line":6782},[46191],{"type":21,"tag":209,"props":46192,"children":46193},{"style":222},[46194],{"type":26,"value":4850},{"type":21,"tag":209,"props":46196,"children":46197},{"class":211,"line":6812},[46198,46202,46206,46210,46214,46218,46222],{"type":21,"tag":209,"props":46199,"children":46200},{"style":222},[46201],{"type":26,"value":42638},{"type":21,"tag":209,"props":46203,"children":46204},{"style":263},[46205],{"type":26,"value":37016},{"type":21,"tag":209,"props":46207,"children":46208},{"style":222},[46209],{"type":26,"value":42647},{"type":21,"tag":209,"props":46211,"children":46212},{"style":216},[46213],{"type":26,"value":1432},{"type":21,"tag":209,"props":46215,"children":46216},{"style":222},[46217],{"type":26,"value":41136},{"type":21,"tag":209,"props":46219,"children":46220},{"style":263},[46221],{"type":26,"value":37016},{"type":21,"tag":209,"props":46223,"children":46224},{"style":222},[46225],{"type":26,"value":42664},{"type":21,"tag":209,"props":46227,"children":46228},{"class":211,"line":6831},[46229],{"type":21,"tag":209,"props":46230,"children":46231},{"emptyLinePlaceholder":248},[46232],{"type":26,"value":251},{"type":21,"tag":209,"props":46234,"children":46235},{"class":211,"line":6840},[46236],{"type":21,"tag":209,"props":46237,"children":46238},{"style":448},[46239],{"type":26,"value":4697},{"type":21,"tag":209,"props":46241,"children":46242},{"class":211,"line":6864},[46243],{"type":21,"tag":209,"props":46244,"children":46245},{"style":448},[46246],{"type":26,"value":46247},"     * Create a socket io instance that will echo all events into the application event aggregator, so that\n",{"type":21,"tag":209,"props":46249,"children":46250},{"class":211,"line":6872},[46251],{"type":21,"tag":209,"props":46252,"children":46253},{"style":448},[46254],{"type":26,"value":46255},"     * collections, models, etc. can listen on app.vent for their events.\n",{"type":21,"tag":209,"props":46257,"children":46258},{"class":211,"line":6880},[46259,46263,46267,46271],{"type":21,"tag":209,"props":46260,"children":46261},{"style":448},[46262],{"type":26,"value":4713},{"type":21,"tag":209,"props":46264,"children":46265},{"style":216},[46266],{"type":26,"value":4718},{"type":21,"tag":209,"props":46268,"children":46269},{"style":360},[46270],{"type":26,"value":42230},{"type":21,"tag":209,"props":46272,"children":46273},{"style":222},[46274],{"type":26,"value":42235},{"type":21,"tag":209,"props":46276,"children":46277},{"class":211,"line":6899},[46278,46282],{"type":21,"tag":209,"props":46279,"children":46280},{"style":448},[46281],{"type":26,"value":4713},{"type":21,"tag":209,"props":46283,"children":46284},{"style":216},[46285],{"type":26,"value":46286},"@constructor\n",{"type":21,"tag":209,"props":46288,"children":46289},{"class":211,"line":6907},[46290],{"type":21,"tag":209,"props":46291,"children":46292},{"style":448},[46293],{"type":26,"value":4753},{"type":21,"tag":209,"props":46295,"children":46296},{"class":211,"line":6919},[46297,46302,46306,46310,46315,46319,46323,46327,46331],{"type":21,"tag":209,"props":46298,"children":46299},{"style":222},[46300],{"type":26,"value":46301},"    Marionette.Application.",{"type":21,"tag":209,"props":46303,"children":46304},{"style":263},[46305],{"type":26,"value":37016},{"type":21,"tag":209,"props":46307,"children":46308},{"style":222},[46309],{"type":26,"value":378},{"type":21,"tag":209,"props":46311,"children":46312},{"style":360},[46313],{"type":26,"value":46314},"SocketIO",{"type":21,"tag":209,"props":46316,"children":46317},{"style":216},[46318],{"type":26,"value":271},{"type":21,"tag":209,"props":46320,"children":46321},{"style":216},[46322],{"type":26,"value":4766},{"type":21,"tag":209,"props":46324,"children":46325},{"style":222},[46326],{"type":26,"value":368},{"type":21,"tag":209,"props":46328,"children":46329},{"style":400},[46330],{"type":26,"value":15147},{"type":21,"tag":209,"props":46332,"children":46333},{"style":222},[46334],{"type":26,"value":2369},{"type":21,"tag":209,"props":46336,"children":46337},{"class":211,"line":6927},[46338,46342,46347,46351,46356,46360],{"type":21,"tag":209,"props":46339,"children":46340},{"style":216},[46341],{"type":26,"value":5925},{"type":21,"tag":209,"props":46343,"children":46344},{"style":222},[46345],{"type":26,"value":46346}," socket ",{"type":21,"tag":209,"props":46348,"children":46349},{"style":216},[46350],{"type":26,"value":1432},{"type":21,"tag":209,"props":46352,"children":46353},{"style":222},[46354],{"type":26,"value":46355}," io.",{"type":21,"tag":209,"props":46357,"children":46358},{"style":360},[46359],{"type":26,"value":5065},{"type":21,"tag":209,"props":46361,"children":46362},{"style":222},[46363],{"type":26,"value":46364},"(url, {\n",{"type":21,"tag":209,"props":46366,"children":46367},{"class":211,"line":6935},[46368,46373,46378],{"type":21,"tag":209,"props":46369,"children":46370},{"style":222},[46371],{"type":26,"value":46372},"            transports:[",{"type":21,"tag":209,"props":46374,"children":46375},{"style":233},[46376],{"type":26,"value":46377},"'websocket'",{"type":21,"tag":209,"props":46379,"children":46380},{"style":222},[46381],{"type":26,"value":10292},{"type":21,"tag":209,"props":46383,"children":46384},{"class":211,"line":6943},[46385],{"type":21,"tag":209,"props":46386,"children":46387},{"style":222},[46388],{"type":26,"value":5114},{"type":21,"tag":209,"props":46390,"children":46391},{"class":211,"line":6952},[46392],{"type":21,"tag":209,"props":46393,"children":46394},{"emptyLinePlaceholder":248},[46395],{"type":26,"value":251},{"type":21,"tag":209,"props":46397,"children":46398},{"class":211,"line":6961},[46399],{"type":21,"tag":209,"props":46400,"children":46401},{"style":448},[46402],{"type":26,"value":2412},{"type":21,"tag":209,"props":46404,"children":46405},{"class":211,"line":6977},[46406],{"type":21,"tag":209,"props":46407,"children":46408},{"style":448},[46409],{"type":26,"value":46410},"         * On any event from the server, trigger it on the app event aggregator. The first\n",{"type":21,"tag":209,"props":46412,"children":46413},{"class":211,"line":6993},[46414],{"type":21,"tag":209,"props":46415,"children":46416},{"style":448},[46417],{"type":26,"value":46418},"         * argument will always be the name of the event.\n",{"type":21,"tag":209,"props":46420,"children":46421},{"class":211,"line":7001},[46422],{"type":21,"tag":209,"props":46423,"children":46424},{"style":448},[46425],{"type":26,"value":2439},{"type":21,"tag":209,"props":46427,"children":46428},{"class":211,"line":7025},[46429,46433,46437,46441,46445,46449,46453],{"type":21,"tag":209,"props":46430,"children":46431},{"style":222},[46432],{"type":26,"value":41858},{"type":21,"tag":209,"props":46434,"children":46435},{"style":360},[46436],{"type":26,"value":363},{"type":21,"tag":209,"props":46438,"children":46439},{"style":222},[46440],{"type":26,"value":368},{"type":21,"tag":209,"props":46442,"children":46443},{"style":233},[46444],{"type":26,"value":42576},{"type":21,"tag":209,"props":46446,"children":46447},{"style":222},[46448],{"type":26,"value":408},{"type":21,"tag":209,"props":46450,"children":46451},{"style":216},[46452],{"type":26,"value":5370},{"type":21,"tag":209,"props":46454,"children":46455},{"style":222},[46456],{"type":26,"value":2561},{"type":21,"tag":209,"props":46458,"children":46459},{"class":211,"line":7066},[46460,46464,46468,46472,46476,46480,46484,46488,46492,46496,46500,46504,46508],{"type":21,"tag":209,"props":46461,"children":46462},{"style":216},[46463],{"type":26,"value":5959},{"type":21,"tag":209,"props":46465,"children":46466},{"style":222},[46467],{"type":26,"value":42491},{"type":21,"tag":209,"props":46469,"children":46470},{"style":216},[46471],{"type":26,"value":1432},{"type":21,"tag":209,"props":46473,"children":46474},{"style":263},[46475],{"type":26,"value":42500},{"type":21,"tag":209,"props":46477,"children":46478},{"style":222},[46479],{"type":26,"value":378},{"type":21,"tag":209,"props":46481,"children":46482},{"style":263},[46483],{"type":26,"value":37016},{"type":21,"tag":209,"props":46485,"children":46486},{"style":222},[46487],{"type":26,"value":42513},{"type":21,"tag":209,"props":46489,"children":46490},{"style":360},[46491],{"type":26,"value":41259},{"type":21,"tag":209,"props":46493,"children":46494},{"style":222},[46495],{"type":26,"value":368},{"type":21,"tag":209,"props":46497,"children":46498},{"style":263},[46499],{"type":26,"value":42526},{"type":21,"tag":209,"props":46501,"children":46502},{"style":222},[46503],{"type":26,"value":408},{"type":21,"tag":209,"props":46505,"children":46506},{"style":263},[46507],{"type":26,"value":6048},{"type":21,"tag":209,"props":46509,"children":46510},{"style":222},[46511],{"type":26,"value":2608},{"type":21,"tag":209,"props":46513,"children":46514},{"class":211,"line":7094},[46515,46519,46523,46528,46532,46537,46542,46546,46550],{"type":21,"tag":209,"props":46516,"children":46517},{"style":222},[46518],{"type":26,"value":45518},{"type":21,"tag":209,"props":46520,"children":46521},{"style":360},[46522],{"type":26,"value":499},{"type":21,"tag":209,"props":46524,"children":46525},{"style":222},[46526],{"type":26,"value":46527},"(args[",{"type":21,"tag":209,"props":46529,"children":46530},{"style":263},[46531],{"type":26,"value":6048},{"type":21,"tag":209,"props":46533,"children":46534},{"style":222},[46535],{"type":26,"value":46536},"], args.",{"type":21,"tag":209,"props":46538,"children":46539},{"style":360},[46540],{"type":26,"value":46541},"slice",{"type":21,"tag":209,"props":46543,"children":46544},{"style":222},[46545],{"type":26,"value":368},{"type":21,"tag":209,"props":46547,"children":46548},{"style":263},[46549],{"type":26,"value":3224},{"type":21,"tag":209,"props":46551,"children":46552},{"style":222},[46553],{"type":26,"value":46554},"));\n",{"type":21,"tag":209,"props":46556,"children":46557},{"class":211,"line":7110},[46558],{"type":21,"tag":209,"props":46559,"children":46560},{"style":222},[46561],{"type":26,"value":5114},{"type":21,"tag":209,"props":46563,"children":46564},{"class":211,"line":7126},[46565],{"type":21,"tag":209,"props":46566,"children":46567},{"emptyLinePlaceholder":248},[46568],{"type":26,"value":251},{"type":21,"tag":209,"props":46570,"children":46571},{"class":211,"line":7142},[46572],{"type":21,"tag":209,"props":46573,"children":46574},{"style":448},[46575],{"type":26,"value":2412},{"type":21,"tag":209,"props":46577,"children":46578},{"class":211,"line":7150},[46579],{"type":21,"tag":209,"props":46580,"children":46581},{"style":448},[46582],{"type":26,"value":46583},"         * On error, trigger the socket:error event on the global event aggregator for \n",{"type":21,"tag":209,"props":46585,"children":46586},{"class":211,"line":7162},[46587],{"type":21,"tag":209,"props":46588,"children":46589},{"style":448},[46590],{"type":26,"value":46591},"         * interested listeners.\n",{"type":21,"tag":209,"props":46593,"children":46594},{"class":211,"line":7170},[46595],{"type":21,"tag":209,"props":46596,"children":46597},{"style":448},[46598],{"type":26,"value":2439},{"type":21,"tag":209,"props":46600,"children":46601},{"class":211,"line":7178},[46602,46606,46610,46614,46618,46622,46626,46630,46634],{"type":21,"tag":209,"props":46603,"children":46604},{"style":222},[46605],{"type":26,"value":41858},{"type":21,"tag":209,"props":46607,"children":46608},{"style":360},[46609],{"type":26,"value":363},{"type":21,"tag":209,"props":46611,"children":46612},{"style":222},[46613],{"type":26,"value":368},{"type":21,"tag":209,"props":46615,"children":46616},{"style":233},[46617],{"type":26,"value":17784},{"type":21,"tag":209,"props":46619,"children":46620},{"style":222},[46621],{"type":26,"value":408},{"type":21,"tag":209,"props":46623,"children":46624},{"style":216},[46625],{"type":26,"value":5370},{"type":21,"tag":209,"props":46627,"children":46628},{"style":222},[46629],{"type":26,"value":368},{"type":21,"tag":209,"props":46631,"children":46632},{"style":400},[46633],{"type":26,"value":5676},{"type":21,"tag":209,"props":46635,"children":46636},{"style":222},[46637],{"type":26,"value":2369},{"type":21,"tag":209,"props":46639,"children":46640},{"class":211,"line":7186},[46641,46645,46649,46653,46658],{"type":21,"tag":209,"props":46642,"children":46643},{"style":222},[46644],{"type":26,"value":45518},{"type":21,"tag":209,"props":46646,"children":46647},{"style":360},[46648],{"type":26,"value":499},{"type":21,"tag":209,"props":46650,"children":46651},{"style":222},[46652],{"type":26,"value":368},{"type":21,"tag":209,"props":46654,"children":46655},{"style":233},[46656],{"type":26,"value":46657},"'socket:error'",{"type":21,"tag":209,"props":46659,"children":46660},{"style":222},[46661],{"type":26,"value":17829},{"type":21,"tag":209,"props":46663,"children":46664},{"class":211,"line":7199},[46665],{"type":21,"tag":209,"props":46666,"children":46667},{"style":222},[46668],{"type":26,"value":5114},{"type":21,"tag":209,"props":46670,"children":46671},{"class":211,"line":16789},[46672],{"type":21,"tag":209,"props":46673,"children":46674},{"emptyLinePlaceholder":248},[46675],{"type":26,"value":251},{"type":21,"tag":209,"props":46677,"children":46678},{"class":211,"line":16798},[46679,46683],{"type":21,"tag":209,"props":46680,"children":46681},{"style":216},[46682],{"type":26,"value":3069},{"type":21,"tag":209,"props":46684,"children":46685},{"style":222},[46686],{"type":26,"value":46687}," socket;\n",{"type":21,"tag":209,"props":46689,"children":46690},{"class":211,"line":16812},[46691],{"type":21,"tag":209,"props":46692,"children":46693},{"style":222},[46694],{"type":26,"value":331},{"type":21,"tag":209,"props":46696,"children":46697},{"class":211,"line":16821},[46698,46703,46708],{"type":21,"tag":209,"props":46699,"children":46700},{"style":222},[46701],{"type":26,"value":46702},"})(app ",{"type":21,"tag":209,"props":46704,"children":46705},{"style":448},[46706],{"type":26,"value":46707},"/* replace with your global app object */",{"type":21,"tag":209,"props":46709,"children":46710},{"style":222},[46711],{"type":26,"value":46712},", Backbone, Backbone.Marionette, jQuery, _, io);\n",{"type":21,"tag":22,"props":46714,"children":46715},{},[46716],{"type":26,"value":46717},"As always, comments are appreciated.",{"type":21,"tag":3490,"props":46719,"children":46720},{},[46721],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":46723},[],"content:ckeefer:2014-6:backbonesocketsync.md","ckeefer/2014-6/backbonesocketsync.md","ckeefer/2014-6/backbonesocketsync",{"user":3518,"name":3519},{"_path":46729,"_dir":46730,"_draft":7,"_partial":7,"_locale":8,"title":46731,"description":46732,"publishDate":46733,"categories":46734,"tags":46736,"excerpt":46732,"body":46738,"_type":3511,"_id":49367,"_source":3513,"_file":49368,"_stem":49369,"_extension":3516,"author":49370},"/ckeefer/2014-5/cgwin2","2014-5","Custom Google Info Windows: Updated, Live","April 30, 2014 at 3:22 am Remy says:","2014-05-09",[46735],"developer-blog",[12,46737],"google-maps",{"type":18,"children":46739,"toc":49364},[46740,46752,46758,46770,46783,46788,46793,48102,48123,48349,48354,48542,48547,48773,48778,49336,49341,49360],{"type":21,"tag":4462,"props":46741,"children":46742},{},[46743,46747],{"type":21,"tag":22,"props":46744,"children":46745},{},[46746],{"type":26,"value":46732},{"type":21,"tag":22,"props":46748,"children":46749},{},[46750],{"type":26,"value":46751},"Do you have a webpage with the full code (html, js, css) to test how it works? Tia",{"type":21,"tag":3549,"props":46753,"children":46755},{"id":46754},"my-dear-remy-tia-both",[46756],{"type":26,"value":46757},"My dear... Remy? Tia? Both?",{"type":21,"tag":22,"props":46759,"children":46760},{},[46761,46763],{"type":26,"value":46762},"Whoever you are, your wish is granted: ",{"type":21,"tag":29,"props":46764,"children":46767},{"href":46765,"rel":46766},"http://sanemethod.github.io/CGWin/",[93],[46768],{"type":26,"value":46769},"CGWin Demo",{"type":21,"tag":22,"props":46771,"children":46772},{},[46773,46775,46781],{"type":26,"value":46774},"Not content to merely offer a live example of our ",{"type":21,"tag":29,"props":46776,"children":46778},{"href":46777},"/search/custom/google/maps/user:ckeefer",[46779],{"type":26,"value":46780},"Custom Google Info Windows",{"type":26,"value":46782},", we've also updated our implementation with panToView capability - that is, when you click on a marker and the resulting info window is outside the current map bounds, the map will now pan the minimum amount necessary to show the full info window.",{"type":21,"tag":22,"props":46784,"children":46785},{},[46786],{"type":26,"value":46787},"It's not as easy as you might expect! Let's take a look at what we have to do to make this happen (and then note the demo page again, just for good measure).",{"type":21,"tag":22,"props":46789,"children":46790},{},[46791],{"type":26,"value":46792},"So, let's start off with a big ol' block of code:",{"type":21,"tag":200,"props":46794,"children":46796},{"className":9044,"code":46795,"language":9046,"meta":8,"style":8},"/**\n * If the custom window is not already entirely within the map view, pan the map the minimum amount\n * necessary to bring the custom info window fully into view.\n */\nCustomWindow.prototype.panToView = function(){\n    var position = this.position,\n        latlng = this.marker.getPosition(),\n        top = parseInt(this.container.style.top, 10),\n        cHeight = position.y - top,\n        cWidth = this.container.offsetWidth / 2,\n        map = this.getMap(),\n        center = map.getCenter(),\n        bounds = map.getBounds(),\n        degPerPixel = (function(){\n            var degs = {},\n                div = map.getDiv(),\n                span = bounds.toSpan();\n\n        degs.x = span.lng() / div.offsetWidth;\n        degs.y = span.lat() / div.offsetHeight;\n        return degs;\n    })(),\n    infoBounds = (function(){\n        var infoBounds = {};\n\n        infoBounds.north = latlng.lat() + cHeight * degPerPixel.y;\n        infoBounds.south = latlng.lat();\n        infoBounds.west = latlng.lng() - cWidth * degPerPixel.x;\n        infoBounds.east = latlng.lng() + cWidth * degPerPixel.x;\n        return infoBounds;\n    })(),\n    newCenter = (function(){\n        var ne = bounds.getNorthEast(),\n            sw = bounds.getSouthWest(),\n            north = ne.lat(),\n            east = ne.lng(),\n            south = sw.lat(),\n            west = sw.lng(),\n            x = center.lng(),\n            y = center.lat(),\n            shiftLng = ((infoBounds.west \u003C west) ? west - infoBounds.west : 0) +\n                ((infoBounds.east > east) ? east - infoBounds.east : 0),\n            shiftLat = ((infoBounds.north > north) ? north - infoBounds.north : 0) +\n                ((infoBounds.south \u003C south) ? south - infoBounds.south : 0);\n\n        return (shiftLng || shiftLat) ? new google.maps.LatLng(y - shiftLat, x - shiftLng) : void 0;\n    })();\n\nif (newCenter){\n    map.panTo(newCenter);\n    }\n\n};\n",[46797],{"type":21,"tag":63,"props":46798,"children":46799},{"__ignoreMap":8},[46800,46807,46815,46823,46830,46867,46892,46922,46961,46987,47020,47049,47075,47100,47124,47145,47170,47196,47203,47238,47272,47284,47292,47316,47336,47343,47386,47410,47452,47492,47504,47511,47535,47564,47589,47614,47638,47663,47687,47712,47736,47797,47844,47904,47951,47958,48036,48044,48051,48063,48081,48088,48095],{"type":21,"tag":209,"props":46801,"children":46802},{"class":211,"line":212},[46803],{"type":21,"tag":209,"props":46804,"children":46805},{"style":448},[46806],{"type":26,"value":731},{"type":21,"tag":209,"props":46808,"children":46809},{"class":211,"line":244},[46810],{"type":21,"tag":209,"props":46811,"children":46812},{"style":448},[46813],{"type":26,"value":46814}," * If the custom window is not already entirely within the map view, pan the map the minimum amount\n",{"type":21,"tag":209,"props":46816,"children":46817},{"class":211,"line":254},[46818],{"type":21,"tag":209,"props":46819,"children":46820},{"style":448},[46821],{"type":26,"value":46822}," * necessary to bring the custom info window fully into view.\n",{"type":21,"tag":209,"props":46824,"children":46825},{"class":211,"line":279},[46826],{"type":21,"tag":209,"props":46827,"children":46828},{"style":448},[46829],{"type":26,"value":755},{"type":21,"tag":209,"props":46831,"children":46832},{"class":211,"line":288},[46833,46838,46842,46846,46850,46855,46859,46863],{"type":21,"tag":209,"props":46834,"children":46835},{"style":263},[46836],{"type":26,"value":46837},"CustomWindow",{"type":21,"tag":209,"props":46839,"children":46840},{"style":222},[46841],{"type":26,"value":378},{"type":21,"tag":209,"props":46843,"children":46844},{"style":263},[46845],{"type":26,"value":37016},{"type":21,"tag":209,"props":46847,"children":46848},{"style":222},[46849],{"type":26,"value":378},{"type":21,"tag":209,"props":46851,"children":46852},{"style":360},[46853],{"type":26,"value":46854},"panToView",{"type":21,"tag":209,"props":46856,"children":46857},{"style":216},[46858],{"type":26,"value":271},{"type":21,"tag":209,"props":46860,"children":46861},{"style":216},[46862],{"type":26,"value":4766},{"type":21,"tag":209,"props":46864,"children":46865},{"style":222},[46866],{"type":26,"value":2561},{"type":21,"tag":209,"props":46868,"children":46869},{"class":211,"line":307},[46870,46874,46879,46883,46887],{"type":21,"tag":209,"props":46871,"children":46872},{"style":216},[46873],{"type":26,"value":10405},{"type":21,"tag":209,"props":46875,"children":46876},{"style":222},[46877],{"type":26,"value":46878}," position ",{"type":21,"tag":209,"props":46880,"children":46881},{"style":216},[46882],{"type":26,"value":1432},{"type":21,"tag":209,"props":46884,"children":46885},{"style":263},[46886],{"type":26,"value":17698},{"type":21,"tag":209,"props":46888,"children":46889},{"style":222},[46890],{"type":26,"value":46891},".position,\n",{"type":21,"tag":209,"props":46893,"children":46894},{"class":211,"line":325},[46895,46900,46904,46908,46913,46918],{"type":21,"tag":209,"props":46896,"children":46897},{"style":222},[46898],{"type":26,"value":46899},"        latlng ",{"type":21,"tag":209,"props":46901,"children":46902},{"style":216},[46903],{"type":26,"value":1432},{"type":21,"tag":209,"props":46905,"children":46906},{"style":263},[46907],{"type":26,"value":17698},{"type":21,"tag":209,"props":46909,"children":46910},{"style":222},[46911],{"type":26,"value":46912},".marker.",{"type":21,"tag":209,"props":46914,"children":46915},{"style":360},[46916],{"type":26,"value":46917},"getPosition",{"type":21,"tag":209,"props":46919,"children":46920},{"style":222},[46921],{"type":26,"value":5405},{"type":21,"tag":209,"props":46923,"children":46924},{"class":211,"line":334},[46925,46930,46934,46939,46943,46947,46952,46957],{"type":21,"tag":209,"props":46926,"children":46927},{"style":222},[46928],{"type":26,"value":46929},"        top ",{"type":21,"tag":209,"props":46931,"children":46932},{"style":216},[46933],{"type":26,"value":1432},{"type":21,"tag":209,"props":46935,"children":46936},{"style":360},[46937],{"type":26,"value":46938}," parseInt",{"type":21,"tag":209,"props":46940,"children":46941},{"style":222},[46942],{"type":26,"value":368},{"type":21,"tag":209,"props":46944,"children":46945},{"style":263},[46946],{"type":26,"value":2508},{"type":21,"tag":209,"props":46948,"children":46949},{"style":222},[46950],{"type":26,"value":46951},".container.style.top, ",{"type":21,"tag":209,"props":46953,"children":46954},{"style":263},[46955],{"type":26,"value":46956},"10",{"type":21,"tag":209,"props":46958,"children":46959},{"style":222},[46960],{"type":26,"value":10277},{"type":21,"tag":209,"props":46962,"children":46963},{"class":211,"line":343},[46964,46969,46973,46978,46982],{"type":21,"tag":209,"props":46965,"children":46966},{"style":222},[46967],{"type":26,"value":46968},"        cHeight ",{"type":21,"tag":209,"props":46970,"children":46971},{"style":216},[46972],{"type":26,"value":1432},{"type":21,"tag":209,"props":46974,"children":46975},{"style":222},[46976],{"type":26,"value":46977}," position.y ",{"type":21,"tag":209,"props":46979,"children":46980},{"style":216},[46981],{"type":26,"value":13012},{"type":21,"tag":209,"props":46983,"children":46984},{"style":222},[46985],{"type":26,"value":46986}," top,\n",{"type":21,"tag":209,"props":46988,"children":46989},{"class":211,"line":351},[46990,46995,46999,47003,47008,47012,47016],{"type":21,"tag":209,"props":46991,"children":46992},{"style":222},[46993],{"type":26,"value":46994},"        cWidth ",{"type":21,"tag":209,"props":46996,"children":46997},{"style":216},[46998],{"type":26,"value":1432},{"type":21,"tag":209,"props":47000,"children":47001},{"style":263},[47002],{"type":26,"value":17698},{"type":21,"tag":209,"props":47004,"children":47005},{"style":222},[47006],{"type":26,"value":47007},".container.offsetWidth ",{"type":21,"tag":209,"props":47009,"children":47010},{"style":216},[47011],{"type":26,"value":9749},{"type":21,"tag":209,"props":47013,"children":47014},{"style":263},[47015],{"type":26,"value":36498},{"type":21,"tag":209,"props":47017,"children":47018},{"style":222},[47019],{"type":26,"value":304},{"type":21,"tag":209,"props":47021,"children":47022},{"class":211,"line":444},[47023,47028,47032,47036,47040,47045],{"type":21,"tag":209,"props":47024,"children":47025},{"style":222},[47026],{"type":26,"value":47027},"        map ",{"type":21,"tag":209,"props":47029,"children":47030},{"style":216},[47031],{"type":26,"value":1432},{"type":21,"tag":209,"props":47033,"children":47034},{"style":263},[47035],{"type":26,"value":17698},{"type":21,"tag":209,"props":47037,"children":47038},{"style":222},[47039],{"type":26,"value":378},{"type":21,"tag":209,"props":47041,"children":47042},{"style":360},[47043],{"type":26,"value":47044},"getMap",{"type":21,"tag":209,"props":47046,"children":47047},{"style":222},[47048],{"type":26,"value":5405},{"type":21,"tag":209,"props":47050,"children":47051},{"class":211,"line":454},[47052,47057,47061,47066,47071],{"type":21,"tag":209,"props":47053,"children":47054},{"style":222},[47055],{"type":26,"value":47056},"        center ",{"type":21,"tag":209,"props":47058,"children":47059},{"style":216},[47060],{"type":26,"value":1432},{"type":21,"tag":209,"props":47062,"children":47063},{"style":222},[47064],{"type":26,"value":47065}," map.",{"type":21,"tag":209,"props":47067,"children":47068},{"style":360},[47069],{"type":26,"value":47070},"getCenter",{"type":21,"tag":209,"props":47072,"children":47073},{"style":222},[47074],{"type":26,"value":5405},{"type":21,"tag":209,"props":47076,"children":47077},{"class":211,"line":463},[47078,47083,47087,47091,47096],{"type":21,"tag":209,"props":47079,"children":47080},{"style":222},[47081],{"type":26,"value":47082},"        bounds ",{"type":21,"tag":209,"props":47084,"children":47085},{"style":216},[47086],{"type":26,"value":1432},{"type":21,"tag":209,"props":47088,"children":47089},{"style":222},[47090],{"type":26,"value":47065},{"type":21,"tag":209,"props":47092,"children":47093},{"style":360},[47094],{"type":26,"value":47095},"getBounds",{"type":21,"tag":209,"props":47097,"children":47098},{"style":222},[47099],{"type":26,"value":5405},{"type":21,"tag":209,"props":47101,"children":47102},{"class":211,"line":472},[47103,47108,47112,47116,47120],{"type":21,"tag":209,"props":47104,"children":47105},{"style":222},[47106],{"type":26,"value":47107},"        degPerPixel ",{"type":21,"tag":209,"props":47109,"children":47110},{"style":216},[47111],{"type":26,"value":1432},{"type":21,"tag":209,"props":47113,"children":47114},{"style":222},[47115],{"type":26,"value":4776},{"type":21,"tag":209,"props":47117,"children":47118},{"style":216},[47119],{"type":26,"value":5370},{"type":21,"tag":209,"props":47121,"children":47122},{"style":222},[47123],{"type":26,"value":2561},{"type":21,"tag":209,"props":47125,"children":47126},{"class":211,"line":480},[47127,47131,47136,47140],{"type":21,"tag":209,"props":47128,"children":47129},{"style":216},[47130],{"type":26,"value":5959},{"type":21,"tag":209,"props":47132,"children":47133},{"style":222},[47134],{"type":26,"value":47135}," degs ",{"type":21,"tag":209,"props":47137,"children":47138},{"style":216},[47139],{"type":26,"value":1432},{"type":21,"tag":209,"props":47141,"children":47142},{"style":222},[47143],{"type":26,"value":47144}," {},\n",{"type":21,"tag":209,"props":47146,"children":47147},{"class":211,"line":489},[47148,47153,47157,47161,47166],{"type":21,"tag":209,"props":47149,"children":47150},{"style":222},[47151],{"type":26,"value":47152},"                div ",{"type":21,"tag":209,"props":47154,"children":47155},{"style":216},[47156],{"type":26,"value":1432},{"type":21,"tag":209,"props":47158,"children":47159},{"style":222},[47160],{"type":26,"value":47065},{"type":21,"tag":209,"props":47162,"children":47163},{"style":360},[47164],{"type":26,"value":47165},"getDiv",{"type":21,"tag":209,"props":47167,"children":47168},{"style":222},[47169],{"type":26,"value":5405},{"type":21,"tag":209,"props":47171,"children":47172},{"class":211,"line":847},[47173,47178,47182,47187,47192],{"type":21,"tag":209,"props":47174,"children":47175},{"style":222},[47176],{"type":26,"value":47177},"                span ",{"type":21,"tag":209,"props":47179,"children":47180},{"style":216},[47181],{"type":26,"value":1432},{"type":21,"tag":209,"props":47183,"children":47184},{"style":222},[47185],{"type":26,"value":47186}," bounds.",{"type":21,"tag":209,"props":47188,"children":47189},{"style":360},[47190],{"type":26,"value":47191},"toSpan",{"type":21,"tag":209,"props":47193,"children":47194},{"style":222},[47195],{"type":26,"value":4842},{"type":21,"tag":209,"props":47197,"children":47198},{"class":211,"line":860},[47199],{"type":21,"tag":209,"props":47200,"children":47201},{"emptyLinePlaceholder":248},[47202],{"type":26,"value":251},{"type":21,"tag":209,"props":47204,"children":47205},{"class":211,"line":877},[47206,47211,47215,47220,47225,47229,47233],{"type":21,"tag":209,"props":47207,"children":47208},{"style":222},[47209],{"type":26,"value":47210},"        degs.x ",{"type":21,"tag":209,"props":47212,"children":47213},{"style":216},[47214],{"type":26,"value":1432},{"type":21,"tag":209,"props":47216,"children":47217},{"style":222},[47218],{"type":26,"value":47219}," span.",{"type":21,"tag":209,"props":47221,"children":47222},{"style":360},[47223],{"type":26,"value":47224},"lng",{"type":21,"tag":209,"props":47226,"children":47227},{"style":222},[47228],{"type":26,"value":14393},{"type":21,"tag":209,"props":47230,"children":47231},{"style":216},[47232],{"type":26,"value":9749},{"type":21,"tag":209,"props":47234,"children":47235},{"style":222},[47236],{"type":26,"value":47237}," div.offsetWidth;\n",{"type":21,"tag":209,"props":47239,"children":47240},{"class":211,"line":889},[47241,47246,47250,47254,47259,47263,47267],{"type":21,"tag":209,"props":47242,"children":47243},{"style":222},[47244],{"type":26,"value":47245},"        degs.y ",{"type":21,"tag":209,"props":47247,"children":47248},{"style":216},[47249],{"type":26,"value":1432},{"type":21,"tag":209,"props":47251,"children":47252},{"style":222},[47253],{"type":26,"value":47219},{"type":21,"tag":209,"props":47255,"children":47256},{"style":360},[47257],{"type":26,"value":47258},"lat",{"type":21,"tag":209,"props":47260,"children":47261},{"style":222},[47262],{"type":26,"value":14393},{"type":21,"tag":209,"props":47264,"children":47265},{"style":216},[47266],{"type":26,"value":9749},{"type":21,"tag":209,"props":47268,"children":47269},{"style":222},[47270],{"type":26,"value":47271}," div.offsetHeight;\n",{"type":21,"tag":209,"props":47273,"children":47274},{"class":211,"line":902},[47275,47279],{"type":21,"tag":209,"props":47276,"children":47277},{"style":216},[47278],{"type":26,"value":3069},{"type":21,"tag":209,"props":47280,"children":47281},{"style":222},[47282],{"type":26,"value":47283}," degs;\n",{"type":21,"tag":209,"props":47285,"children":47286},{"class":211,"line":914},[47287],{"type":21,"tag":209,"props":47288,"children":47289},{"style":222},[47290],{"type":26,"value":47291},"    })(),\n",{"type":21,"tag":209,"props":47293,"children":47294},{"class":211,"line":922},[47295,47300,47304,47308,47312],{"type":21,"tag":209,"props":47296,"children":47297},{"style":222},[47298],{"type":26,"value":47299},"    infoBounds ",{"type":21,"tag":209,"props":47301,"children":47302},{"style":216},[47303],{"type":26,"value":1432},{"type":21,"tag":209,"props":47305,"children":47306},{"style":222},[47307],{"type":26,"value":4776},{"type":21,"tag":209,"props":47309,"children":47310},{"style":216},[47311],{"type":26,"value":5370},{"type":21,"tag":209,"props":47313,"children":47314},{"style":222},[47315],{"type":26,"value":2561},{"type":21,"tag":209,"props":47317,"children":47318},{"class":211,"line":2312},[47319,47323,47328,47332],{"type":21,"tag":209,"props":47320,"children":47321},{"style":216},[47322],{"type":26,"value":5925},{"type":21,"tag":209,"props":47324,"children":47325},{"style":222},[47326],{"type":26,"value":47327}," infoBounds ",{"type":21,"tag":209,"props":47329,"children":47330},{"style":216},[47331],{"type":26,"value":1432},{"type":21,"tag":209,"props":47333,"children":47334},{"style":222},[47335],{"type":26,"value":32274},{"type":21,"tag":209,"props":47337,"children":47338},{"class":211,"line":2321},[47339],{"type":21,"tag":209,"props":47340,"children":47341},{"emptyLinePlaceholder":248},[47342],{"type":26,"value":251},{"type":21,"tag":209,"props":47344,"children":47345},{"class":211,"line":2372},[47346,47351,47355,47360,47364,47368,47372,47377,47381],{"type":21,"tag":209,"props":47347,"children":47348},{"style":222},[47349],{"type":26,"value":47350},"        infoBounds.north ",{"type":21,"tag":209,"props":47352,"children":47353},{"style":216},[47354],{"type":26,"value":1432},{"type":21,"tag":209,"props":47356,"children":47357},{"style":222},[47358],{"type":26,"value":47359}," latlng.",{"type":21,"tag":209,"props":47361,"children":47362},{"style":360},[47363],{"type":26,"value":47258},{"type":21,"tag":209,"props":47365,"children":47366},{"style":222},[47367],{"type":26,"value":14393},{"type":21,"tag":209,"props":47369,"children":47370},{"style":216},[47371],{"type":26,"value":10237},{"type":21,"tag":209,"props":47373,"children":47374},{"style":222},[47375],{"type":26,"value":47376}," cHeight ",{"type":21,"tag":209,"props":47378,"children":47379},{"style":216},[47380],{"type":26,"value":944},{"type":21,"tag":209,"props":47382,"children":47383},{"style":222},[47384],{"type":26,"value":47385}," degPerPixel.y;\n",{"type":21,"tag":209,"props":47387,"children":47388},{"class":211,"line":2381},[47389,47394,47398,47402,47406],{"type":21,"tag":209,"props":47390,"children":47391},{"style":222},[47392],{"type":26,"value":47393},"        infoBounds.south ",{"type":21,"tag":209,"props":47395,"children":47396},{"style":216},[47397],{"type":26,"value":1432},{"type":21,"tag":209,"props":47399,"children":47400},{"style":222},[47401],{"type":26,"value":47359},{"type":21,"tag":209,"props":47403,"children":47404},{"style":360},[47405],{"type":26,"value":47258},{"type":21,"tag":209,"props":47407,"children":47408},{"style":222},[47409],{"type":26,"value":4842},{"type":21,"tag":209,"props":47411,"children":47412},{"class":211,"line":2389},[47413,47418,47422,47426,47430,47434,47438,47443,47447],{"type":21,"tag":209,"props":47414,"children":47415},{"style":222},[47416],{"type":26,"value":47417},"        infoBounds.west ",{"type":21,"tag":209,"props":47419,"children":47420},{"style":216},[47421],{"type":26,"value":1432},{"type":21,"tag":209,"props":47423,"children":47424},{"style":222},[47425],{"type":26,"value":47359},{"type":21,"tag":209,"props":47427,"children":47428},{"style":360},[47429],{"type":26,"value":47224},{"type":21,"tag":209,"props":47431,"children":47432},{"style":222},[47433],{"type":26,"value":14393},{"type":21,"tag":209,"props":47435,"children":47436},{"style":216},[47437],{"type":26,"value":13012},{"type":21,"tag":209,"props":47439,"children":47440},{"style":222},[47441],{"type":26,"value":47442}," cWidth ",{"type":21,"tag":209,"props":47444,"children":47445},{"style":216},[47446],{"type":26,"value":944},{"type":21,"tag":209,"props":47448,"children":47449},{"style":222},[47450],{"type":26,"value":47451}," degPerPixel.x;\n",{"type":21,"tag":209,"props":47453,"children":47454},{"class":211,"line":2397},[47455,47460,47464,47468,47472,47476,47480,47484,47488],{"type":21,"tag":209,"props":47456,"children":47457},{"style":222},[47458],{"type":26,"value":47459},"        infoBounds.east ",{"type":21,"tag":209,"props":47461,"children":47462},{"style":216},[47463],{"type":26,"value":1432},{"type":21,"tag":209,"props":47465,"children":47466},{"style":222},[47467],{"type":26,"value":47359},{"type":21,"tag":209,"props":47469,"children":47470},{"style":360},[47471],{"type":26,"value":47224},{"type":21,"tag":209,"props":47473,"children":47474},{"style":222},[47475],{"type":26,"value":14393},{"type":21,"tag":209,"props":47477,"children":47478},{"style":216},[47479],{"type":26,"value":10237},{"type":21,"tag":209,"props":47481,"children":47482},{"style":222},[47483],{"type":26,"value":47442},{"type":21,"tag":209,"props":47485,"children":47486},{"style":216},[47487],{"type":26,"value":944},{"type":21,"tag":209,"props":47489,"children":47490},{"style":222},[47491],{"type":26,"value":47451},{"type":21,"tag":209,"props":47493,"children":47494},{"class":211,"line":2406},[47495,47499],{"type":21,"tag":209,"props":47496,"children":47497},{"style":216},[47498],{"type":26,"value":3069},{"type":21,"tag":209,"props":47500,"children":47501},{"style":222},[47502],{"type":26,"value":47503}," infoBounds;\n",{"type":21,"tag":209,"props":47505,"children":47506},{"class":211,"line":2415},[47507],{"type":21,"tag":209,"props":47508,"children":47509},{"style":222},[47510],{"type":26,"value":47291},{"type":21,"tag":209,"props":47512,"children":47513},{"class":211,"line":2424},[47514,47519,47523,47527,47531],{"type":21,"tag":209,"props":47515,"children":47516},{"style":222},[47517],{"type":26,"value":47518},"    newCenter ",{"type":21,"tag":209,"props":47520,"children":47521},{"style":216},[47522],{"type":26,"value":1432},{"type":21,"tag":209,"props":47524,"children":47525},{"style":222},[47526],{"type":26,"value":4776},{"type":21,"tag":209,"props":47528,"children":47529},{"style":216},[47530],{"type":26,"value":5370},{"type":21,"tag":209,"props":47532,"children":47533},{"style":222},[47534],{"type":26,"value":2561},{"type":21,"tag":209,"props":47536,"children":47537},{"class":211,"line":2433},[47538,47542,47547,47551,47555,47560],{"type":21,"tag":209,"props":47539,"children":47540},{"style":216},[47541],{"type":26,"value":5925},{"type":21,"tag":209,"props":47543,"children":47544},{"style":222},[47545],{"type":26,"value":47546}," ne ",{"type":21,"tag":209,"props":47548,"children":47549},{"style":216},[47550],{"type":26,"value":1432},{"type":21,"tag":209,"props":47552,"children":47553},{"style":222},[47554],{"type":26,"value":47186},{"type":21,"tag":209,"props":47556,"children":47557},{"style":360},[47558],{"type":26,"value":47559},"getNorthEast",{"type":21,"tag":209,"props":47561,"children":47562},{"style":222},[47563],{"type":26,"value":5405},{"type":21,"tag":209,"props":47565,"children":47566},{"class":211,"line":2442},[47567,47572,47576,47580,47585],{"type":21,"tag":209,"props":47568,"children":47569},{"style":222},[47570],{"type":26,"value":47571},"            sw ",{"type":21,"tag":209,"props":47573,"children":47574},{"style":216},[47575],{"type":26,"value":1432},{"type":21,"tag":209,"props":47577,"children":47578},{"style":222},[47579],{"type":26,"value":47186},{"type":21,"tag":209,"props":47581,"children":47582},{"style":360},[47583],{"type":26,"value":47584},"getSouthWest",{"type":21,"tag":209,"props":47586,"children":47587},{"style":222},[47588],{"type":26,"value":5405},{"type":21,"tag":209,"props":47590,"children":47591},{"class":211,"line":2471},[47592,47597,47601,47606,47610],{"type":21,"tag":209,"props":47593,"children":47594},{"style":222},[47595],{"type":26,"value":47596},"            north ",{"type":21,"tag":209,"props":47598,"children":47599},{"style":216},[47600],{"type":26,"value":1432},{"type":21,"tag":209,"props":47602,"children":47603},{"style":222},[47604],{"type":26,"value":47605}," ne.",{"type":21,"tag":209,"props":47607,"children":47608},{"style":360},[47609],{"type":26,"value":47258},{"type":21,"tag":209,"props":47611,"children":47612},{"style":222},[47613],{"type":26,"value":5405},{"type":21,"tag":209,"props":47615,"children":47616},{"class":211,"line":2480},[47617,47622,47626,47630,47634],{"type":21,"tag":209,"props":47618,"children":47619},{"style":222},[47620],{"type":26,"value":47621},"            east ",{"type":21,"tag":209,"props":47623,"children":47624},{"style":216},[47625],{"type":26,"value":1432},{"type":21,"tag":209,"props":47627,"children":47628},{"style":222},[47629],{"type":26,"value":47605},{"type":21,"tag":209,"props":47631,"children":47632},{"style":360},[47633],{"type":26,"value":47224},{"type":21,"tag":209,"props":47635,"children":47636},{"style":222},[47637],{"type":26,"value":5405},{"type":21,"tag":209,"props":47639,"children":47640},{"class":211,"line":2489},[47641,47646,47650,47655,47659],{"type":21,"tag":209,"props":47642,"children":47643},{"style":222},[47644],{"type":26,"value":47645},"            south ",{"type":21,"tag":209,"props":47647,"children":47648},{"style":216},[47649],{"type":26,"value":1432},{"type":21,"tag":209,"props":47651,"children":47652},{"style":222},[47653],{"type":26,"value":47654}," sw.",{"type":21,"tag":209,"props":47656,"children":47657},{"style":360},[47658],{"type":26,"value":47258},{"type":21,"tag":209,"props":47660,"children":47661},{"style":222},[47662],{"type":26,"value":5405},{"type":21,"tag":209,"props":47664,"children":47665},{"class":211,"line":2516},[47666,47671,47675,47679,47683],{"type":21,"tag":209,"props":47667,"children":47668},{"style":222},[47669],{"type":26,"value":47670},"            west ",{"type":21,"tag":209,"props":47672,"children":47673},{"style":216},[47674],{"type":26,"value":1432},{"type":21,"tag":209,"props":47676,"children":47677},{"style":222},[47678],{"type":26,"value":47654},{"type":21,"tag":209,"props":47680,"children":47681},{"style":360},[47682],{"type":26,"value":47224},{"type":21,"tag":209,"props":47684,"children":47685},{"style":222},[47686],{"type":26,"value":5405},{"type":21,"tag":209,"props":47688,"children":47689},{"class":211,"line":2525},[47690,47695,47699,47704,47708],{"type":21,"tag":209,"props":47691,"children":47692},{"style":222},[47693],{"type":26,"value":47694},"            x ",{"type":21,"tag":209,"props":47696,"children":47697},{"style":216},[47698],{"type":26,"value":1432},{"type":21,"tag":209,"props":47700,"children":47701},{"style":222},[47702],{"type":26,"value":47703}," center.",{"type":21,"tag":209,"props":47705,"children":47706},{"style":360},[47707],{"type":26,"value":47224},{"type":21,"tag":209,"props":47709,"children":47710},{"style":222},[47711],{"type":26,"value":5405},{"type":21,"tag":209,"props":47713,"children":47714},{"class":211,"line":2533},[47715,47720,47724,47728,47732],{"type":21,"tag":209,"props":47716,"children":47717},{"style":222},[47718],{"type":26,"value":47719},"            y ",{"type":21,"tag":209,"props":47721,"children":47722},{"style":216},[47723],{"type":26,"value":1432},{"type":21,"tag":209,"props":47725,"children":47726},{"style":222},[47727],{"type":26,"value":47703},{"type":21,"tag":209,"props":47729,"children":47730},{"style":360},[47731],{"type":26,"value":47258},{"type":21,"tag":209,"props":47733,"children":47734},{"style":222},[47735],{"type":26,"value":5405},{"type":21,"tag":209,"props":47737,"children":47738},{"class":211,"line":2542},[47739,47744,47748,47753,47757,47762,47766,47771,47775,47780,47784,47788,47792],{"type":21,"tag":209,"props":47740,"children":47741},{"style":222},[47742],{"type":26,"value":47743},"            shiftLng ",{"type":21,"tag":209,"props":47745,"children":47746},{"style":216},[47747],{"type":26,"value":1432},{"type":21,"tag":209,"props":47749,"children":47750},{"style":222},[47751],{"type":26,"value":47752}," ((infoBounds.west ",{"type":21,"tag":209,"props":47754,"children":47755},{"style":216},[47756],{"type":26,"value":1985},{"type":21,"tag":209,"props":47758,"children":47759},{"style":222},[47760],{"type":26,"value":47761}," west) ",{"type":21,"tag":209,"props":47763,"children":47764},{"style":216},[47765],{"type":26,"value":15218},{"type":21,"tag":209,"props":47767,"children":47768},{"style":222},[47769],{"type":26,"value":47770}," west ",{"type":21,"tag":209,"props":47772,"children":47773},{"style":216},[47774],{"type":26,"value":13012},{"type":21,"tag":209,"props":47776,"children":47777},{"style":222},[47778],{"type":26,"value":47779}," infoBounds.west ",{"type":21,"tag":209,"props":47781,"children":47782},{"style":216},[47783],{"type":26,"value":191},{"type":21,"tag":209,"props":47785,"children":47786},{"style":263},[47787],{"type":26,"value":17197},{"type":21,"tag":209,"props":47789,"children":47790},{"style":222},[47791],{"type":26,"value":432},{"type":21,"tag":209,"props":47793,"children":47794},{"style":216},[47795],{"type":26,"value":47796},"+\n",{"type":21,"tag":209,"props":47798,"children":47799},{"class":211,"line":2550},[47800,47805,47809,47814,47818,47823,47827,47832,47836,47840],{"type":21,"tag":209,"props":47801,"children":47802},{"style":222},[47803],{"type":26,"value":47804},"                ((infoBounds.east ",{"type":21,"tag":209,"props":47806,"children":47807},{"style":216},[47808],{"type":26,"value":2014},{"type":21,"tag":209,"props":47810,"children":47811},{"style":222},[47812],{"type":26,"value":47813}," east) ",{"type":21,"tag":209,"props":47815,"children":47816},{"style":216},[47817],{"type":26,"value":15218},{"type":21,"tag":209,"props":47819,"children":47820},{"style":222},[47821],{"type":26,"value":47822}," east ",{"type":21,"tag":209,"props":47824,"children":47825},{"style":216},[47826],{"type":26,"value":13012},{"type":21,"tag":209,"props":47828,"children":47829},{"style":222},[47830],{"type":26,"value":47831}," infoBounds.east ",{"type":21,"tag":209,"props":47833,"children":47834},{"style":216},[47835],{"type":26,"value":191},{"type":21,"tag":209,"props":47837,"children":47838},{"style":263},[47839],{"type":26,"value":17197},{"type":21,"tag":209,"props":47841,"children":47842},{"style":222},[47843],{"type":26,"value":10277},{"type":21,"tag":209,"props":47845,"children":47846},{"class":211,"line":2564},[47847,47852,47856,47861,47865,47870,47874,47879,47883,47888,47892,47896,47900],{"type":21,"tag":209,"props":47848,"children":47849},{"style":222},[47850],{"type":26,"value":47851},"            shiftLat ",{"type":21,"tag":209,"props":47853,"children":47854},{"style":216},[47855],{"type":26,"value":1432},{"type":21,"tag":209,"props":47857,"children":47858},{"style":222},[47859],{"type":26,"value":47860}," ((infoBounds.north ",{"type":21,"tag":209,"props":47862,"children":47863},{"style":216},[47864],{"type":26,"value":2014},{"type":21,"tag":209,"props":47866,"children":47867},{"style":222},[47868],{"type":26,"value":47869}," north) ",{"type":21,"tag":209,"props":47871,"children":47872},{"style":216},[47873],{"type":26,"value":15218},{"type":21,"tag":209,"props":47875,"children":47876},{"style":222},[47877],{"type":26,"value":47878}," north ",{"type":21,"tag":209,"props":47880,"children":47881},{"style":216},[47882],{"type":26,"value":13012},{"type":21,"tag":209,"props":47884,"children":47885},{"style":222},[47886],{"type":26,"value":47887}," infoBounds.north ",{"type":21,"tag":209,"props":47889,"children":47890},{"style":216},[47891],{"type":26,"value":191},{"type":21,"tag":209,"props":47893,"children":47894},{"style":263},[47895],{"type":26,"value":17197},{"type":21,"tag":209,"props":47897,"children":47898},{"style":222},[47899],{"type":26,"value":432},{"type":21,"tag":209,"props":47901,"children":47902},{"style":216},[47903],{"type":26,"value":47796},{"type":21,"tag":209,"props":47905,"children":47906},{"class":211,"line":2611},[47907,47912,47916,47921,47925,47930,47934,47939,47943,47947],{"type":21,"tag":209,"props":47908,"children":47909},{"style":222},[47910],{"type":26,"value":47911},"                ((infoBounds.south ",{"type":21,"tag":209,"props":47913,"children":47914},{"style":216},[47915],{"type":26,"value":1985},{"type":21,"tag":209,"props":47917,"children":47918},{"style":222},[47919],{"type":26,"value":47920}," south) ",{"type":21,"tag":209,"props":47922,"children":47923},{"style":216},[47924],{"type":26,"value":15218},{"type":21,"tag":209,"props":47926,"children":47927},{"style":222},[47928],{"type":26,"value":47929}," south ",{"type":21,"tag":209,"props":47931,"children":47932},{"style":216},[47933],{"type":26,"value":13012},{"type":21,"tag":209,"props":47935,"children":47936},{"style":222},[47937],{"type":26,"value":47938}," infoBounds.south ",{"type":21,"tag":209,"props":47940,"children":47941},{"style":216},[47942],{"type":26,"value":191},{"type":21,"tag":209,"props":47944,"children":47945},{"style":263},[47946],{"type":26,"value":17197},{"type":21,"tag":209,"props":47948,"children":47949},{"style":222},[47950],{"type":26,"value":2608},{"type":21,"tag":209,"props":47952,"children":47953},{"class":211,"line":2619},[47954],{"type":21,"tag":209,"props":47955,"children":47956},{"emptyLinePlaceholder":248},[47957],{"type":26,"value":251},{"type":21,"tag":209,"props":47959,"children":47960},{"class":211,"line":2627},[47961,47965,47970,47974,47979,47983,47987,47992,47997,48002,48006,48011,48015,48020,48024,48028,48032],{"type":21,"tag":209,"props":47962,"children":47963},{"style":216},[47964],{"type":26,"value":3069},{"type":21,"tag":209,"props":47966,"children":47967},{"style":222},[47968],{"type":26,"value":47969}," (shiftLng ",{"type":21,"tag":209,"props":47971,"children":47972},{"style":216},[47973],{"type":26,"value":4677},{"type":21,"tag":209,"props":47975,"children":47976},{"style":222},[47977],{"type":26,"value":47978}," shiftLat) ",{"type":21,"tag":209,"props":47980,"children":47981},{"style":216},[47982],{"type":26,"value":15218},{"type":21,"tag":209,"props":47984,"children":47985},{"style":216},[47986],{"type":26,"value":4667},{"type":21,"tag":209,"props":47988,"children":47989},{"style":222},[47990],{"type":26,"value":47991}," google.maps.",{"type":21,"tag":209,"props":47993,"children":47994},{"style":360},[47995],{"type":26,"value":47996},"LatLng",{"type":21,"tag":209,"props":47998,"children":47999},{"style":222},[48000],{"type":26,"value":48001},"(y ",{"type":21,"tag":209,"props":48003,"children":48004},{"style":216},[48005],{"type":26,"value":13012},{"type":21,"tag":209,"props":48007,"children":48008},{"style":222},[48009],{"type":26,"value":48010}," shiftLat, x ",{"type":21,"tag":209,"props":48012,"children":48013},{"style":216},[48014],{"type":26,"value":13012},{"type":21,"tag":209,"props":48016,"children":48017},{"style":222},[48018],{"type":26,"value":48019}," shiftLng) ",{"type":21,"tag":209,"props":48021,"children":48022},{"style":216},[48023],{"type":26,"value":191},{"type":21,"tag":209,"props":48025,"children":48026},{"style":216},[48027],{"type":26,"value":41543},{"type":21,"tag":209,"props":48029,"children":48030},{"style":263},[48031],{"type":26,"value":17197},{"type":21,"tag":209,"props":48033,"children":48034},{"style":222},[48035],{"type":26,"value":241},{"type":21,"tag":209,"props":48037,"children":48038},{"class":211,"line":2636},[48039],{"type":21,"tag":209,"props":48040,"children":48041},{"style":222},[48042],{"type":26,"value":48043},"    })();\n",{"type":21,"tag":209,"props":48045,"children":48046},{"class":211,"line":2644},[48047],{"type":21,"tag":209,"props":48048,"children":48049},{"emptyLinePlaceholder":248},[48050],{"type":26,"value":251},{"type":21,"tag":209,"props":48052,"children":48053},{"class":211,"line":2657},[48054,48058],{"type":21,"tag":209,"props":48055,"children":48056},{"style":216},[48057],{"type":26,"value":43437},{"type":21,"tag":209,"props":48059,"children":48060},{"style":222},[48061],{"type":26,"value":48062}," (newCenter){\n",{"type":21,"tag":209,"props":48064,"children":48065},{"class":211,"line":2728},[48066,48071,48076],{"type":21,"tag":209,"props":48067,"children":48068},{"style":222},[48069],{"type":26,"value":48070},"    map.",{"type":21,"tag":209,"props":48072,"children":48073},{"style":360},[48074],{"type":26,"value":48075},"panTo",{"type":21,"tag":209,"props":48077,"children":48078},{"style":222},[48079],{"type":26,"value":48080},"(newCenter);\n",{"type":21,"tag":209,"props":48082,"children":48083},{"class":211,"line":2758},[48084],{"type":21,"tag":209,"props":48085,"children":48086},{"style":222},[48087],{"type":26,"value":331},{"type":21,"tag":209,"props":48089,"children":48090},{"class":211,"line":2776},[48091],{"type":21,"tag":209,"props":48092,"children":48093},{"emptyLinePlaceholder":248},[48094],{"type":26,"value":251},{"type":21,"tag":209,"props":48096,"children":48097},{"class":211,"line":2785},[48098],{"type":21,"tag":209,"props":48099,"children":48100},{"style":222},[48101],{"type":26,"value":340},{"type":21,"tag":22,"props":48103,"children":48104},{},[48105,48107,48112,48114,48121],{"type":26,"value":48106},"You'll note almost all of the work happens in the long, run-on ",{"type":21,"tag":63,"props":48108,"children":48110},{"className":48109},[],[48111],{"type":26,"value":8996},{"type":26,"value":48113}," statement. At first blush, this looks like a mere effort at character saving (all those extra vars would be pretty messy) - but thanks to Javascript ",{"type":21,"tag":29,"props":48115,"children":48118},{"href":48116,"rel":48117},"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var#var_hoisting",[93],[48119],{"type":26,"value":48120},"var hoisting",{"type":26,"value":48122}," its actually a better representation of what the function block looks like to the runtime. But I digress.",{"type":21,"tag":200,"props":48124,"children":48126},{"className":9044,"code":48125,"language":9046,"meta":8,"style":8},"var position = this.position,\n    latlng = this.marker.getPosition(),\n    top = parseInt(this.container.style.top, 10),\n    cHeight = position.y - top,\n    cWidth = this.container.offsetWidth / 2,\n    map = this.getMap(),\n    center = map.getCenter(),\n    bounds = map.getBounds(),\n",[48127],{"type":21,"tag":63,"props":48128,"children":48129},{"__ignoreMap":8},[48130,48153,48181,48217,48241,48273,48301,48325],{"type":21,"tag":209,"props":48131,"children":48132},{"class":211,"line":212},[48133,48137,48141,48145,48149],{"type":21,"tag":209,"props":48134,"children":48135},{"style":216},[48136],{"type":26,"value":8996},{"type":21,"tag":209,"props":48138,"children":48139},{"style":222},[48140],{"type":26,"value":46878},{"type":21,"tag":209,"props":48142,"children":48143},{"style":216},[48144],{"type":26,"value":1432},{"type":21,"tag":209,"props":48146,"children":48147},{"style":263},[48148],{"type":26,"value":17698},{"type":21,"tag":209,"props":48150,"children":48151},{"style":222},[48152],{"type":26,"value":46891},{"type":21,"tag":209,"props":48154,"children":48155},{"class":211,"line":244},[48156,48161,48165,48169,48173,48177],{"type":21,"tag":209,"props":48157,"children":48158},{"style":222},[48159],{"type":26,"value":48160},"    latlng ",{"type":21,"tag":209,"props":48162,"children":48163},{"style":216},[48164],{"type":26,"value":1432},{"type":21,"tag":209,"props":48166,"children":48167},{"style":263},[48168],{"type":26,"value":17698},{"type":21,"tag":209,"props":48170,"children":48171},{"style":222},[48172],{"type":26,"value":46912},{"type":21,"tag":209,"props":48174,"children":48175},{"style":360},[48176],{"type":26,"value":46917},{"type":21,"tag":209,"props":48178,"children":48179},{"style":222},[48180],{"type":26,"value":5405},{"type":21,"tag":209,"props":48182,"children":48183},{"class":211,"line":254},[48184,48189,48193,48197,48201,48205,48209,48213],{"type":21,"tag":209,"props":48185,"children":48186},{"style":222},[48187],{"type":26,"value":48188},"    top ",{"type":21,"tag":209,"props":48190,"children":48191},{"style":216},[48192],{"type":26,"value":1432},{"type":21,"tag":209,"props":48194,"children":48195},{"style":360},[48196],{"type":26,"value":46938},{"type":21,"tag":209,"props":48198,"children":48199},{"style":222},[48200],{"type":26,"value":368},{"type":21,"tag":209,"props":48202,"children":48203},{"style":263},[48204],{"type":26,"value":2508},{"type":21,"tag":209,"props":48206,"children":48207},{"style":222},[48208],{"type":26,"value":46951},{"type":21,"tag":209,"props":48210,"children":48211},{"style":263},[48212],{"type":26,"value":46956},{"type":21,"tag":209,"props":48214,"children":48215},{"style":222},[48216],{"type":26,"value":10277},{"type":21,"tag":209,"props":48218,"children":48219},{"class":211,"line":279},[48220,48225,48229,48233,48237],{"type":21,"tag":209,"props":48221,"children":48222},{"style":222},[48223],{"type":26,"value":48224},"    cHeight ",{"type":21,"tag":209,"props":48226,"children":48227},{"style":216},[48228],{"type":26,"value":1432},{"type":21,"tag":209,"props":48230,"children":48231},{"style":222},[48232],{"type":26,"value":46977},{"type":21,"tag":209,"props":48234,"children":48235},{"style":216},[48236],{"type":26,"value":13012},{"type":21,"tag":209,"props":48238,"children":48239},{"style":222},[48240],{"type":26,"value":46986},{"type":21,"tag":209,"props":48242,"children":48243},{"class":211,"line":288},[48244,48249,48253,48257,48261,48265,48269],{"type":21,"tag":209,"props":48245,"children":48246},{"style":222},[48247],{"type":26,"value":48248},"    cWidth ",{"type":21,"tag":209,"props":48250,"children":48251},{"style":216},[48252],{"type":26,"value":1432},{"type":21,"tag":209,"props":48254,"children":48255},{"style":263},[48256],{"type":26,"value":17698},{"type":21,"tag":209,"props":48258,"children":48259},{"style":222},[48260],{"type":26,"value":47007},{"type":21,"tag":209,"props":48262,"children":48263},{"style":216},[48264],{"type":26,"value":9749},{"type":21,"tag":209,"props":48266,"children":48267},{"style":263},[48268],{"type":26,"value":36498},{"type":21,"tag":209,"props":48270,"children":48271},{"style":222},[48272],{"type":26,"value":304},{"type":21,"tag":209,"props":48274,"children":48275},{"class":211,"line":307},[48276,48281,48285,48289,48293,48297],{"type":21,"tag":209,"props":48277,"children":48278},{"style":222},[48279],{"type":26,"value":48280},"    map ",{"type":21,"tag":209,"props":48282,"children":48283},{"style":216},[48284],{"type":26,"value":1432},{"type":21,"tag":209,"props":48286,"children":48287},{"style":263},[48288],{"type":26,"value":17698},{"type":21,"tag":209,"props":48290,"children":48291},{"style":222},[48292],{"type":26,"value":378},{"type":21,"tag":209,"props":48294,"children":48295},{"style":360},[48296],{"type":26,"value":47044},{"type":21,"tag":209,"props":48298,"children":48299},{"style":222},[48300],{"type":26,"value":5405},{"type":21,"tag":209,"props":48302,"children":48303},{"class":211,"line":325},[48304,48309,48313,48317,48321],{"type":21,"tag":209,"props":48305,"children":48306},{"style":222},[48307],{"type":26,"value":48308},"    center ",{"type":21,"tag":209,"props":48310,"children":48311},{"style":216},[48312],{"type":26,"value":1432},{"type":21,"tag":209,"props":48314,"children":48315},{"style":222},[48316],{"type":26,"value":47065},{"type":21,"tag":209,"props":48318,"children":48319},{"style":360},[48320],{"type":26,"value":47070},{"type":21,"tag":209,"props":48322,"children":48323},{"style":222},[48324],{"type":26,"value":5405},{"type":21,"tag":209,"props":48326,"children":48327},{"class":211,"line":334},[48328,48333,48337,48341,48345],{"type":21,"tag":209,"props":48329,"children":48330},{"style":222},[48331],{"type":26,"value":48332},"    bounds ",{"type":21,"tag":209,"props":48334,"children":48335},{"style":216},[48336],{"type":26,"value":1432},{"type":21,"tag":209,"props":48338,"children":48339},{"style":222},[48340],{"type":26,"value":47065},{"type":21,"tag":209,"props":48342,"children":48343},{"style":360},[48344],{"type":26,"value":47095},{"type":21,"tag":209,"props":48346,"children":48347},{"style":222},[48348],{"type":26,"value":5405},{"type":21,"tag":22,"props":48350,"children":48351},{},[48352],{"type":26,"value":48353},"We start off by getting the locations and bounds of a few things - namely, the position of the custom window itself, the position of its marker, the dimensions of the container, the map and its center and bounds, all for use in later computations.",{"type":21,"tag":200,"props":48355,"children":48357},{"className":9044,"code":48356,"language":9046,"meta":8,"style":8},"degPerPixel = (function(){\n    var degs = {},\n        div = map.getDiv(),\n        span = bounds.toSpan();\n\ndegs.x = span.lng() / div.offsetWidth;\ndegs.y = span.lat() / div.offsetHeight;\nreturn degs;\n})(),\n",[48358],{"type":21,"tag":63,"props":48359,"children":48360},{"__ignoreMap":8},[48361,48385,48404,48428,48452,48459,48491,48523,48534],{"type":21,"tag":209,"props":48362,"children":48363},{"class":211,"line":212},[48364,48369,48373,48377,48381],{"type":21,"tag":209,"props":48365,"children":48366},{"style":222},[48367],{"type":26,"value":48368},"degPerPixel ",{"type":21,"tag":209,"props":48370,"children":48371},{"style":216},[48372],{"type":26,"value":1432},{"type":21,"tag":209,"props":48374,"children":48375},{"style":222},[48376],{"type":26,"value":4776},{"type":21,"tag":209,"props":48378,"children":48379},{"style":216},[48380],{"type":26,"value":5370},{"type":21,"tag":209,"props":48382,"children":48383},{"style":222},[48384],{"type":26,"value":2561},{"type":21,"tag":209,"props":48386,"children":48387},{"class":211,"line":244},[48388,48392,48396,48400],{"type":21,"tag":209,"props":48389,"children":48390},{"style":216},[48391],{"type":26,"value":10405},{"type":21,"tag":209,"props":48393,"children":48394},{"style":222},[48395],{"type":26,"value":47135},{"type":21,"tag":209,"props":48397,"children":48398},{"style":216},[48399],{"type":26,"value":1432},{"type":21,"tag":209,"props":48401,"children":48402},{"style":222},[48403],{"type":26,"value":47144},{"type":21,"tag":209,"props":48405,"children":48406},{"class":211,"line":254},[48407,48412,48416,48420,48424],{"type":21,"tag":209,"props":48408,"children":48409},{"style":222},[48410],{"type":26,"value":48411},"        div ",{"type":21,"tag":209,"props":48413,"children":48414},{"style":216},[48415],{"type":26,"value":1432},{"type":21,"tag":209,"props":48417,"children":48418},{"style":222},[48419],{"type":26,"value":47065},{"type":21,"tag":209,"props":48421,"children":48422},{"style":360},[48423],{"type":26,"value":47165},{"type":21,"tag":209,"props":48425,"children":48426},{"style":222},[48427],{"type":26,"value":5405},{"type":21,"tag":209,"props":48429,"children":48430},{"class":211,"line":279},[48431,48436,48440,48444,48448],{"type":21,"tag":209,"props":48432,"children":48433},{"style":222},[48434],{"type":26,"value":48435},"        span ",{"type":21,"tag":209,"props":48437,"children":48438},{"style":216},[48439],{"type":26,"value":1432},{"type":21,"tag":209,"props":48441,"children":48442},{"style":222},[48443],{"type":26,"value":47186},{"type":21,"tag":209,"props":48445,"children":48446},{"style":360},[48447],{"type":26,"value":47191},{"type":21,"tag":209,"props":48449,"children":48450},{"style":222},[48451],{"type":26,"value":4842},{"type":21,"tag":209,"props":48453,"children":48454},{"class":211,"line":288},[48455],{"type":21,"tag":209,"props":48456,"children":48457},{"emptyLinePlaceholder":248},[48458],{"type":26,"value":251},{"type":21,"tag":209,"props":48460,"children":48461},{"class":211,"line":307},[48462,48467,48471,48475,48479,48483,48487],{"type":21,"tag":209,"props":48463,"children":48464},{"style":222},[48465],{"type":26,"value":48466},"degs.x ",{"type":21,"tag":209,"props":48468,"children":48469},{"style":216},[48470],{"type":26,"value":1432},{"type":21,"tag":209,"props":48472,"children":48473},{"style":222},[48474],{"type":26,"value":47219},{"type":21,"tag":209,"props":48476,"children":48477},{"style":360},[48478],{"type":26,"value":47224},{"type":21,"tag":209,"props":48480,"children":48481},{"style":222},[48482],{"type":26,"value":14393},{"type":21,"tag":209,"props":48484,"children":48485},{"style":216},[48486],{"type":26,"value":9749},{"type":21,"tag":209,"props":48488,"children":48489},{"style":222},[48490],{"type":26,"value":47237},{"type":21,"tag":209,"props":48492,"children":48493},{"class":211,"line":325},[48494,48499,48503,48507,48511,48515,48519],{"type":21,"tag":209,"props":48495,"children":48496},{"style":222},[48497],{"type":26,"value":48498},"degs.y ",{"type":21,"tag":209,"props":48500,"children":48501},{"style":216},[48502],{"type":26,"value":1432},{"type":21,"tag":209,"props":48504,"children":48505},{"style":222},[48506],{"type":26,"value":47219},{"type":21,"tag":209,"props":48508,"children":48509},{"style":360},[48510],{"type":26,"value":47258},{"type":21,"tag":209,"props":48512,"children":48513},{"style":222},[48514],{"type":26,"value":14393},{"type":21,"tag":209,"props":48516,"children":48517},{"style":216},[48518],{"type":26,"value":9749},{"type":21,"tag":209,"props":48520,"children":48521},{"style":222},[48522],{"type":26,"value":47271},{"type":21,"tag":209,"props":48524,"children":48525},{"class":211,"line":334},[48526,48530],{"type":21,"tag":209,"props":48527,"children":48528},{"style":216},[48529],{"type":26,"value":5813},{"type":21,"tag":209,"props":48531,"children":48532},{"style":222},[48533],{"type":26,"value":47283},{"type":21,"tag":209,"props":48535,"children":48536},{"class":211,"line":343},[48537],{"type":21,"tag":209,"props":48538,"children":48539},{"style":222},[48540],{"type":26,"value":48541},"})(),\n",{"type":21,"tag":22,"props":48543,"children":48544},{},[48545],{"type":26,"value":48546},"Here, we create a closure to return an object whose values are the calculated number of degrees per pixel in our map view on the x and y axes. We need this in order to calculate the difference between the current bounds and position of the infoWindow versus the bounds of the map.",{"type":21,"tag":200,"props":48548,"children":48550},{"className":9044,"code":48549,"language":9046,"meta":8,"style":8},"infoBounds = (function(){\n    var infoBounds = {};\n\ninfoBounds.north = latlng.lat() + cHeight * degPerPixel.y;\ninfoBounds.south = latlng.lat();\ninfoBounds.west = latlng.lng() - cWidth * degPerPixel.x;\ninfoBounds.east = latlng.lng() + cWidth * degPerPixel.x;\nreturn infoBounds;\n\n})(),\n",[48551],{"type":21,"tag":63,"props":48552,"children":48553},{"__ignoreMap":8},[48554,48578,48597,48604,48644,48668,48708,48748,48759,48766],{"type":21,"tag":209,"props":48555,"children":48556},{"class":211,"line":212},[48557,48562,48566,48570,48574],{"type":21,"tag":209,"props":48558,"children":48559},{"style":222},[48560],{"type":26,"value":48561},"infoBounds ",{"type":21,"tag":209,"props":48563,"children":48564},{"style":216},[48565],{"type":26,"value":1432},{"type":21,"tag":209,"props":48567,"children":48568},{"style":222},[48569],{"type":26,"value":4776},{"type":21,"tag":209,"props":48571,"children":48572},{"style":216},[48573],{"type":26,"value":5370},{"type":21,"tag":209,"props":48575,"children":48576},{"style":222},[48577],{"type":26,"value":2561},{"type":21,"tag":209,"props":48579,"children":48580},{"class":211,"line":244},[48581,48585,48589,48593],{"type":21,"tag":209,"props":48582,"children":48583},{"style":216},[48584],{"type":26,"value":10405},{"type":21,"tag":209,"props":48586,"children":48587},{"style":222},[48588],{"type":26,"value":47327},{"type":21,"tag":209,"props":48590,"children":48591},{"style":216},[48592],{"type":26,"value":1432},{"type":21,"tag":209,"props":48594,"children":48595},{"style":222},[48596],{"type":26,"value":32274},{"type":21,"tag":209,"props":48598,"children":48599},{"class":211,"line":254},[48600],{"type":21,"tag":209,"props":48601,"children":48602},{"emptyLinePlaceholder":248},[48603],{"type":26,"value":251},{"type":21,"tag":209,"props":48605,"children":48606},{"class":211,"line":279},[48607,48612,48616,48620,48624,48628,48632,48636,48640],{"type":21,"tag":209,"props":48608,"children":48609},{"style":222},[48610],{"type":26,"value":48611},"infoBounds.north ",{"type":21,"tag":209,"props":48613,"children":48614},{"style":216},[48615],{"type":26,"value":1432},{"type":21,"tag":209,"props":48617,"children":48618},{"style":222},[48619],{"type":26,"value":47359},{"type":21,"tag":209,"props":48621,"children":48622},{"style":360},[48623],{"type":26,"value":47258},{"type":21,"tag":209,"props":48625,"children":48626},{"style":222},[48627],{"type":26,"value":14393},{"type":21,"tag":209,"props":48629,"children":48630},{"style":216},[48631],{"type":26,"value":10237},{"type":21,"tag":209,"props":48633,"children":48634},{"style":222},[48635],{"type":26,"value":47376},{"type":21,"tag":209,"props":48637,"children":48638},{"style":216},[48639],{"type":26,"value":944},{"type":21,"tag":209,"props":48641,"children":48642},{"style":222},[48643],{"type":26,"value":47385},{"type":21,"tag":209,"props":48645,"children":48646},{"class":211,"line":288},[48647,48652,48656,48660,48664],{"type":21,"tag":209,"props":48648,"children":48649},{"style":222},[48650],{"type":26,"value":48651},"infoBounds.south ",{"type":21,"tag":209,"props":48653,"children":48654},{"style":216},[48655],{"type":26,"value":1432},{"type":21,"tag":209,"props":48657,"children":48658},{"style":222},[48659],{"type":26,"value":47359},{"type":21,"tag":209,"props":48661,"children":48662},{"style":360},[48663],{"type":26,"value":47258},{"type":21,"tag":209,"props":48665,"children":48666},{"style":222},[48667],{"type":26,"value":4842},{"type":21,"tag":209,"props":48669,"children":48670},{"class":211,"line":307},[48671,48676,48680,48684,48688,48692,48696,48700,48704],{"type":21,"tag":209,"props":48672,"children":48673},{"style":222},[48674],{"type":26,"value":48675},"infoBounds.west ",{"type":21,"tag":209,"props":48677,"children":48678},{"style":216},[48679],{"type":26,"value":1432},{"type":21,"tag":209,"props":48681,"children":48682},{"style":222},[48683],{"type":26,"value":47359},{"type":21,"tag":209,"props":48685,"children":48686},{"style":360},[48687],{"type":26,"value":47224},{"type":21,"tag":209,"props":48689,"children":48690},{"style":222},[48691],{"type":26,"value":14393},{"type":21,"tag":209,"props":48693,"children":48694},{"style":216},[48695],{"type":26,"value":13012},{"type":21,"tag":209,"props":48697,"children":48698},{"style":222},[48699],{"type":26,"value":47442},{"type":21,"tag":209,"props":48701,"children":48702},{"style":216},[48703],{"type":26,"value":944},{"type":21,"tag":209,"props":48705,"children":48706},{"style":222},[48707],{"type":26,"value":47451},{"type":21,"tag":209,"props":48709,"children":48710},{"class":211,"line":325},[48711,48716,48720,48724,48728,48732,48736,48740,48744],{"type":21,"tag":209,"props":48712,"children":48713},{"style":222},[48714],{"type":26,"value":48715},"infoBounds.east ",{"type":21,"tag":209,"props":48717,"children":48718},{"style":216},[48719],{"type":26,"value":1432},{"type":21,"tag":209,"props":48721,"children":48722},{"style":222},[48723],{"type":26,"value":47359},{"type":21,"tag":209,"props":48725,"children":48726},{"style":360},[48727],{"type":26,"value":47224},{"type":21,"tag":209,"props":48729,"children":48730},{"style":222},[48731],{"type":26,"value":14393},{"type":21,"tag":209,"props":48733,"children":48734},{"style":216},[48735],{"type":26,"value":10237},{"type":21,"tag":209,"props":48737,"children":48738},{"style":222},[48739],{"type":26,"value":47442},{"type":21,"tag":209,"props":48741,"children":48742},{"style":216},[48743],{"type":26,"value":944},{"type":21,"tag":209,"props":48745,"children":48746},{"style":222},[48747],{"type":26,"value":47451},{"type":21,"tag":209,"props":48749,"children":48750},{"class":211,"line":334},[48751,48755],{"type":21,"tag":209,"props":48752,"children":48753},{"style":216},[48754],{"type":26,"value":5813},{"type":21,"tag":209,"props":48756,"children":48757},{"style":222},[48758],{"type":26,"value":47503},{"type":21,"tag":209,"props":48760,"children":48761},{"class":211,"line":343},[48762],{"type":21,"tag":209,"props":48763,"children":48764},{"emptyLinePlaceholder":248},[48765],{"type":26,"value":251},{"type":21,"tag":209,"props":48767,"children":48768},{"class":211,"line":351},[48769],{"type":21,"tag":209,"props":48770,"children":48771},{"style":222},[48772],{"type":26,"value":48541},{"type":21,"tag":22,"props":48774,"children":48775},{},[48776],{"type":26,"value":48777},"Similarly, here we return an object containing the calculating bounds of our info window in degrees, with the base of the marker being considered the southern boundary, so that both the marker and info window will be in view when we're done.",{"type":21,"tag":200,"props":48779,"children":48781},{"className":9044,"code":48780,"language":9046,"meta":8,"style":8},"newCenter = (function(){\n    var ne = bounds.getNorthEast(),\n        sw = bounds.getSouthWest(),\n        north = ne.lat(),\n        east = ne.lng(),\n        south = sw.lat(),\n        west = sw.lng(),\n        x = center.lng(),\n        y = center.lat(),\n        shiftLng = ((infoBounds.west \u003C west) ? west - infoBounds.west : 0) +\n            ((infoBounds.east > east) ? east - infoBounds.east : 0),\n        shiftLat = ((infoBounds.north > north) ? north - infoBounds.north : 0) +\n            ((infoBounds.south \u003C south) ? south - infoBounds.south : 0);\n\n        return (shiftLng || shiftLat) ? new google.maps.LatLng(y - shiftLat, x - shiftLng) : void 0;\n\n})();\n\nif (newCenter){\n    map.panTo(newCenter);\n}\n",[48782],{"type":21,"tag":63,"props":48783,"children":48784},{"__ignoreMap":8},[48785,48809,48836,48860,48884,48908,48932,48956,48980,49004,49060,49104,49160,49204,49211,49282,49289,49296,49303,49314,49329],{"type":21,"tag":209,"props":48786,"children":48787},{"class":211,"line":212},[48788,48793,48797,48801,48805],{"type":21,"tag":209,"props":48789,"children":48790},{"style":222},[48791],{"type":26,"value":48792},"newCenter ",{"type":21,"tag":209,"props":48794,"children":48795},{"style":216},[48796],{"type":26,"value":1432},{"type":21,"tag":209,"props":48798,"children":48799},{"style":222},[48800],{"type":26,"value":4776},{"type":21,"tag":209,"props":48802,"children":48803},{"style":216},[48804],{"type":26,"value":5370},{"type":21,"tag":209,"props":48806,"children":48807},{"style":222},[48808],{"type":26,"value":2561},{"type":21,"tag":209,"props":48810,"children":48811},{"class":211,"line":244},[48812,48816,48820,48824,48828,48832],{"type":21,"tag":209,"props":48813,"children":48814},{"style":216},[48815],{"type":26,"value":10405},{"type":21,"tag":209,"props":48817,"children":48818},{"style":222},[48819],{"type":26,"value":47546},{"type":21,"tag":209,"props":48821,"children":48822},{"style":216},[48823],{"type":26,"value":1432},{"type":21,"tag":209,"props":48825,"children":48826},{"style":222},[48827],{"type":26,"value":47186},{"type":21,"tag":209,"props":48829,"children":48830},{"style":360},[48831],{"type":26,"value":47559},{"type":21,"tag":209,"props":48833,"children":48834},{"style":222},[48835],{"type":26,"value":5405},{"type":21,"tag":209,"props":48837,"children":48838},{"class":211,"line":254},[48839,48844,48848,48852,48856],{"type":21,"tag":209,"props":48840,"children":48841},{"style":222},[48842],{"type":26,"value":48843},"        sw ",{"type":21,"tag":209,"props":48845,"children":48846},{"style":216},[48847],{"type":26,"value":1432},{"type":21,"tag":209,"props":48849,"children":48850},{"style":222},[48851],{"type":26,"value":47186},{"type":21,"tag":209,"props":48853,"children":48854},{"style":360},[48855],{"type":26,"value":47584},{"type":21,"tag":209,"props":48857,"children":48858},{"style":222},[48859],{"type":26,"value":5405},{"type":21,"tag":209,"props":48861,"children":48862},{"class":211,"line":279},[48863,48868,48872,48876,48880],{"type":21,"tag":209,"props":48864,"children":48865},{"style":222},[48866],{"type":26,"value":48867},"        north ",{"type":21,"tag":209,"props":48869,"children":48870},{"style":216},[48871],{"type":26,"value":1432},{"type":21,"tag":209,"props":48873,"children":48874},{"style":222},[48875],{"type":26,"value":47605},{"type":21,"tag":209,"props":48877,"children":48878},{"style":360},[48879],{"type":26,"value":47258},{"type":21,"tag":209,"props":48881,"children":48882},{"style":222},[48883],{"type":26,"value":5405},{"type":21,"tag":209,"props":48885,"children":48886},{"class":211,"line":288},[48887,48892,48896,48900,48904],{"type":21,"tag":209,"props":48888,"children":48889},{"style":222},[48890],{"type":26,"value":48891},"        east ",{"type":21,"tag":209,"props":48893,"children":48894},{"style":216},[48895],{"type":26,"value":1432},{"type":21,"tag":209,"props":48897,"children":48898},{"style":222},[48899],{"type":26,"value":47605},{"type":21,"tag":209,"props":48901,"children":48902},{"style":360},[48903],{"type":26,"value":47224},{"type":21,"tag":209,"props":48905,"children":48906},{"style":222},[48907],{"type":26,"value":5405},{"type":21,"tag":209,"props":48909,"children":48910},{"class":211,"line":307},[48911,48916,48920,48924,48928],{"type":21,"tag":209,"props":48912,"children":48913},{"style":222},[48914],{"type":26,"value":48915},"        south ",{"type":21,"tag":209,"props":48917,"children":48918},{"style":216},[48919],{"type":26,"value":1432},{"type":21,"tag":209,"props":48921,"children":48922},{"style":222},[48923],{"type":26,"value":47654},{"type":21,"tag":209,"props":48925,"children":48926},{"style":360},[48927],{"type":26,"value":47258},{"type":21,"tag":209,"props":48929,"children":48930},{"style":222},[48931],{"type":26,"value":5405},{"type":21,"tag":209,"props":48933,"children":48934},{"class":211,"line":325},[48935,48940,48944,48948,48952],{"type":21,"tag":209,"props":48936,"children":48937},{"style":222},[48938],{"type":26,"value":48939},"        west ",{"type":21,"tag":209,"props":48941,"children":48942},{"style":216},[48943],{"type":26,"value":1432},{"type":21,"tag":209,"props":48945,"children":48946},{"style":222},[48947],{"type":26,"value":47654},{"type":21,"tag":209,"props":48949,"children":48950},{"style":360},[48951],{"type":26,"value":47224},{"type":21,"tag":209,"props":48953,"children":48954},{"style":222},[48955],{"type":26,"value":5405},{"type":21,"tag":209,"props":48957,"children":48958},{"class":211,"line":334},[48959,48964,48968,48972,48976],{"type":21,"tag":209,"props":48960,"children":48961},{"style":222},[48962],{"type":26,"value":48963},"        x ",{"type":21,"tag":209,"props":48965,"children":48966},{"style":216},[48967],{"type":26,"value":1432},{"type":21,"tag":209,"props":48969,"children":48970},{"style":222},[48971],{"type":26,"value":47703},{"type":21,"tag":209,"props":48973,"children":48974},{"style":360},[48975],{"type":26,"value":47224},{"type":21,"tag":209,"props":48977,"children":48978},{"style":222},[48979],{"type":26,"value":5405},{"type":21,"tag":209,"props":48981,"children":48982},{"class":211,"line":343},[48983,48988,48992,48996,49000],{"type":21,"tag":209,"props":48984,"children":48985},{"style":222},[48986],{"type":26,"value":48987},"        y ",{"type":21,"tag":209,"props":48989,"children":48990},{"style":216},[48991],{"type":26,"value":1432},{"type":21,"tag":209,"props":48993,"children":48994},{"style":222},[48995],{"type":26,"value":47703},{"type":21,"tag":209,"props":48997,"children":48998},{"style":360},[48999],{"type":26,"value":47258},{"type":21,"tag":209,"props":49001,"children":49002},{"style":222},[49003],{"type":26,"value":5405},{"type":21,"tag":209,"props":49005,"children":49006},{"class":211,"line":351},[49007,49012,49016,49020,49024,49028,49032,49036,49040,49044,49048,49052,49056],{"type":21,"tag":209,"props":49008,"children":49009},{"style":222},[49010],{"type":26,"value":49011},"        shiftLng ",{"type":21,"tag":209,"props":49013,"children":49014},{"style":216},[49015],{"type":26,"value":1432},{"type":21,"tag":209,"props":49017,"children":49018},{"style":222},[49019],{"type":26,"value":47752},{"type":21,"tag":209,"props":49021,"children":49022},{"style":216},[49023],{"type":26,"value":1985},{"type":21,"tag":209,"props":49025,"children":49026},{"style":222},[49027],{"type":26,"value":47761},{"type":21,"tag":209,"props":49029,"children":49030},{"style":216},[49031],{"type":26,"value":15218},{"type":21,"tag":209,"props":49033,"children":49034},{"style":222},[49035],{"type":26,"value":47770},{"type":21,"tag":209,"props":49037,"children":49038},{"style":216},[49039],{"type":26,"value":13012},{"type":21,"tag":209,"props":49041,"children":49042},{"style":222},[49043],{"type":26,"value":47779},{"type":21,"tag":209,"props":49045,"children":49046},{"style":216},[49047],{"type":26,"value":191},{"type":21,"tag":209,"props":49049,"children":49050},{"style":263},[49051],{"type":26,"value":17197},{"type":21,"tag":209,"props":49053,"children":49054},{"style":222},[49055],{"type":26,"value":432},{"type":21,"tag":209,"props":49057,"children":49058},{"style":216},[49059],{"type":26,"value":47796},{"type":21,"tag":209,"props":49061,"children":49062},{"class":211,"line":444},[49063,49068,49072,49076,49080,49084,49088,49092,49096,49100],{"type":21,"tag":209,"props":49064,"children":49065},{"style":222},[49066],{"type":26,"value":49067},"            ((infoBounds.east ",{"type":21,"tag":209,"props":49069,"children":49070},{"style":216},[49071],{"type":26,"value":2014},{"type":21,"tag":209,"props":49073,"children":49074},{"style":222},[49075],{"type":26,"value":47813},{"type":21,"tag":209,"props":49077,"children":49078},{"style":216},[49079],{"type":26,"value":15218},{"type":21,"tag":209,"props":49081,"children":49082},{"style":222},[49083],{"type":26,"value":47822},{"type":21,"tag":209,"props":49085,"children":49086},{"style":216},[49087],{"type":26,"value":13012},{"type":21,"tag":209,"props":49089,"children":49090},{"style":222},[49091],{"type":26,"value":47831},{"type":21,"tag":209,"props":49093,"children":49094},{"style":216},[49095],{"type":26,"value":191},{"type":21,"tag":209,"props":49097,"children":49098},{"style":263},[49099],{"type":26,"value":17197},{"type":21,"tag":209,"props":49101,"children":49102},{"style":222},[49103],{"type":26,"value":10277},{"type":21,"tag":209,"props":49105,"children":49106},{"class":211,"line":454},[49107,49112,49116,49120,49124,49128,49132,49136,49140,49144,49148,49152,49156],{"type":21,"tag":209,"props":49108,"children":49109},{"style":222},[49110],{"type":26,"value":49111},"        shiftLat ",{"type":21,"tag":209,"props":49113,"children":49114},{"style":216},[49115],{"type":26,"value":1432},{"type":21,"tag":209,"props":49117,"children":49118},{"style":222},[49119],{"type":26,"value":47860},{"type":21,"tag":209,"props":49121,"children":49122},{"style":216},[49123],{"type":26,"value":2014},{"type":21,"tag":209,"props":49125,"children":49126},{"style":222},[49127],{"type":26,"value":47869},{"type":21,"tag":209,"props":49129,"children":49130},{"style":216},[49131],{"type":26,"value":15218},{"type":21,"tag":209,"props":49133,"children":49134},{"style":222},[49135],{"type":26,"value":47878},{"type":21,"tag":209,"props":49137,"children":49138},{"style":216},[49139],{"type":26,"value":13012},{"type":21,"tag":209,"props":49141,"children":49142},{"style":222},[49143],{"type":26,"value":47887},{"type":21,"tag":209,"props":49145,"children":49146},{"style":216},[49147],{"type":26,"value":191},{"type":21,"tag":209,"props":49149,"children":49150},{"style":263},[49151],{"type":26,"value":17197},{"type":21,"tag":209,"props":49153,"children":49154},{"style":222},[49155],{"type":26,"value":432},{"type":21,"tag":209,"props":49157,"children":49158},{"style":216},[49159],{"type":26,"value":47796},{"type":21,"tag":209,"props":49161,"children":49162},{"class":211,"line":463},[49163,49168,49172,49176,49180,49184,49188,49192,49196,49200],{"type":21,"tag":209,"props":49164,"children":49165},{"style":222},[49166],{"type":26,"value":49167},"            ((infoBounds.south ",{"type":21,"tag":209,"props":49169,"children":49170},{"style":216},[49171],{"type":26,"value":1985},{"type":21,"tag":209,"props":49173,"children":49174},{"style":222},[49175],{"type":26,"value":47920},{"type":21,"tag":209,"props":49177,"children":49178},{"style":216},[49179],{"type":26,"value":15218},{"type":21,"tag":209,"props":49181,"children":49182},{"style":222},[49183],{"type":26,"value":47929},{"type":21,"tag":209,"props":49185,"children":49186},{"style":216},[49187],{"type":26,"value":13012},{"type":21,"tag":209,"props":49189,"children":49190},{"style":222},[49191],{"type":26,"value":47938},{"type":21,"tag":209,"props":49193,"children":49194},{"style":216},[49195],{"type":26,"value":191},{"type":21,"tag":209,"props":49197,"children":49198},{"style":263},[49199],{"type":26,"value":17197},{"type":21,"tag":209,"props":49201,"children":49202},{"style":222},[49203],{"type":26,"value":2608},{"type":21,"tag":209,"props":49205,"children":49206},{"class":211,"line":472},[49207],{"type":21,"tag":209,"props":49208,"children":49209},{"emptyLinePlaceholder":248},[49210],{"type":26,"value":251},{"type":21,"tag":209,"props":49212,"children":49213},{"class":211,"line":480},[49214,49218,49222,49226,49230,49234,49238,49242,49246,49250,49254,49258,49262,49266,49270,49274,49278],{"type":21,"tag":209,"props":49215,"children":49216},{"style":216},[49217],{"type":26,"value":3069},{"type":21,"tag":209,"props":49219,"children":49220},{"style":222},[49221],{"type":26,"value":47969},{"type":21,"tag":209,"props":49223,"children":49224},{"style":216},[49225],{"type":26,"value":4677},{"type":21,"tag":209,"props":49227,"children":49228},{"style":222},[49229],{"type":26,"value":47978},{"type":21,"tag":209,"props":49231,"children":49232},{"style":216},[49233],{"type":26,"value":15218},{"type":21,"tag":209,"props":49235,"children":49236},{"style":216},[49237],{"type":26,"value":4667},{"type":21,"tag":209,"props":49239,"children":49240},{"style":222},[49241],{"type":26,"value":47991},{"type":21,"tag":209,"props":49243,"children":49244},{"style":360},[49245],{"type":26,"value":47996},{"type":21,"tag":209,"props":49247,"children":49248},{"style":222},[49249],{"type":26,"value":48001},{"type":21,"tag":209,"props":49251,"children":49252},{"style":216},[49253],{"type":26,"value":13012},{"type":21,"tag":209,"props":49255,"children":49256},{"style":222},[49257],{"type":26,"value":48010},{"type":21,"tag":209,"props":49259,"children":49260},{"style":216},[49261],{"type":26,"value":13012},{"type":21,"tag":209,"props":49263,"children":49264},{"style":222},[49265],{"type":26,"value":48019},{"type":21,"tag":209,"props":49267,"children":49268},{"style":216},[49269],{"type":26,"value":191},{"type":21,"tag":209,"props":49271,"children":49272},{"style":216},[49273],{"type":26,"value":41543},{"type":21,"tag":209,"props":49275,"children":49276},{"style":263},[49277],{"type":26,"value":17197},{"type":21,"tag":209,"props":49279,"children":49280},{"style":222},[49281],{"type":26,"value":241},{"type":21,"tag":209,"props":49283,"children":49284},{"class":211,"line":489},[49285],{"type":21,"tag":209,"props":49286,"children":49287},{"emptyLinePlaceholder":248},[49288],{"type":26,"value":251},{"type":21,"tag":209,"props":49290,"children":49291},{"class":211,"line":847},[49292],{"type":21,"tag":209,"props":49293,"children":49294},{"style":222},[49295],{"type":26,"value":37108},{"type":21,"tag":209,"props":49297,"children":49298},{"class":211,"line":860},[49299],{"type":21,"tag":209,"props":49300,"children":49301},{"emptyLinePlaceholder":248},[49302],{"type":26,"value":251},{"type":21,"tag":209,"props":49304,"children":49305},{"class":211,"line":877},[49306,49310],{"type":21,"tag":209,"props":49307,"children":49308},{"style":216},[49309],{"type":26,"value":43437},{"type":21,"tag":209,"props":49311,"children":49312},{"style":222},[49313],{"type":26,"value":48062},{"type":21,"tag":209,"props":49315,"children":49316},{"class":211,"line":889},[49317,49321,49325],{"type":21,"tag":209,"props":49318,"children":49319},{"style":222},[49320],{"type":26,"value":48070},{"type":21,"tag":209,"props":49322,"children":49323},{"style":360},[49324],{"type":26,"value":48075},{"type":21,"tag":209,"props":49326,"children":49327},{"style":222},[49328],{"type":26,"value":48080},{"type":21,"tag":209,"props":49330,"children":49331},{"class":211,"line":902},[49332],{"type":21,"tag":209,"props":49333,"children":49334},{"style":222},[49335],{"type":26,"value":7798},{"type":21,"tag":22,"props":49337,"children":49338},{},[49339],{"type":26,"value":49340},"Finally, we calculate what should be the new center of the map based on the minimum shift of the center necessary in order to ensure the full bounds of our info window, as previously calculated, will be in view, considering the bounds of the map. If no shift is required, we return undefined and skip setting a new center.",{"type":21,"tag":22,"props":49342,"children":49343},{},[49344,49346,49351,49353],{"type":26,"value":49345},"Want to see it in action? ",{"type":21,"tag":29,"props":49347,"children":49349},{"href":46765,"rel":49348},[93],[49350],{"type":26,"value":46769},{"type":26,"value":49352}," Want to see the code? ",{"type":21,"tag":29,"props":49354,"children":49357},{"href":49355,"rel":49356},"https://github.com/SaneMethod/CGWin",[93],[49358],{"type":26,"value":49359},"CGWin Github repo",{"type":21,"tag":3490,"props":49361,"children":49362},{},[49363],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":49365},[49366],{"id":46754,"depth":244,"text":46757},"content:ckeefer:2014-5:cgwin2.md","ckeefer/2014-5/cgwin2.md","ckeefer/2014-5/cgwin2",{"user":3518,"name":3519},{"_path":49372,"_dir":49373,"_draft":7,"_partial":7,"_locale":8,"title":49374,"description":49375,"publishDate":49376,"tags":49377,"excerpt":49375,"body":49379,"_type":3511,"_id":50917,"_source":3513,"_file":50918,"_stem":50919,"_extension":3516,"author":50920},"/ckeefer/2014-4/hidden-options","2014-4","Hidden Options: A Workaround","Here's the situation: You've got a select. Maybe a whole bunch of selects, with a ton of options each (metric ton - let's keep our imaginary hyperbolic units straight here); and these are meant to be complex interactive elements, with options made visible or not as some programmatic condition dictates.","2014-04-23",[49378,12,13804],"how-to",{"type":18,"children":49380,"toc":50915},[49381,49385,49390,49403,49462,49467,49472,49516,49521,50722,50727,50782,50786,50847,50873,50887,50892,50906,50911],{"type":21,"tag":22,"props":49382,"children":49383},{},[49384],{"type":26,"value":49375},{"type":21,"tag":22,"props":49386,"children":49387},{},[49388],{"type":26,"value":49389},"Traditionally, if you wanted to selectively display options, you had to do it the hard way - remove the non-visible option nodes entirely. What, did you want to filter on some state information stored on the node? Too bad - you'll have to keep track of the full structure outside of the DOM and filter on that, inserting or removing elements as needed.",{"type":21,"tag":22,"props":49391,"children":49392},{},[49393,49395,49401],{"type":26,"value":49394},"This is sub-optimal. It's much tidier if we can just set ",{"type":21,"tag":63,"props":49396,"children":49398},{"className":49397},[],[49399],{"type":26,"value":49400},"display:none",{"type":26,"value":49402}," on our options elements, and have them hidden like any other DOM element:",{"type":21,"tag":200,"props":49404,"children":49408},{"className":49405,"code":49406,"language":49407,"meta":8,"style":8},"language-css shiki shiki-themes github-light github-dark","option[disabled]{\n    display:none;\n}\n","css",[49409],{"type":21,"tag":63,"props":49410,"children":49411},{"__ignoreMap":8},[49412,49434,49455],{"type":21,"tag":209,"props":49413,"children":49414},{"class":211,"line":212},[49415,49420,49424,49429],{"type":21,"tag":209,"props":49416,"children":49417},{"style":1988},[49418],{"type":26,"value":49419},"option",{"type":21,"tag":209,"props":49421,"children":49422},{"style":222},[49423],{"type":26,"value":29977},{"type":21,"tag":209,"props":49425,"children":49426},{"style":360},[49427],{"type":26,"value":49428},"disabled",{"type":21,"tag":209,"props":49430,"children":49431},{"style":222},[49432],{"type":26,"value":49433},"]{\n",{"type":21,"tag":209,"props":49435,"children":49436},{"class":211,"line":244},[49437,49442,49446,49451],{"type":21,"tag":209,"props":49438,"children":49439},{"style":263},[49440],{"type":26,"value":49441},"    display",{"type":21,"tag":209,"props":49443,"children":49444},{"style":222},[49445],{"type":26,"value":191},{"type":21,"tag":209,"props":49447,"children":49448},{"style":263},[49449],{"type":26,"value":49450},"none",{"type":21,"tag":209,"props":49452,"children":49453},{"style":222},[49454],{"type":26,"value":241},{"type":21,"tag":209,"props":49456,"children":49457},{"class":211,"line":254},[49458],{"type":21,"tag":209,"props":49459,"children":49460},{"style":222},[49461],{"type":26,"value":7798},{"type":21,"tag":22,"props":49463,"children":49464},{},[49465],{"type":26,"value":49466},"and in most modern browsers (Firefox, IE9+, Safari), this works just fine. We can then filter in place on the elements, and selectively display them.",{"type":21,"tag":22,"props":49468,"children":49469},{},[49470],{"type":26,"value":49471},"Have you noticed the glaring omission yet? Yes, Chrome isn't among the browsers this works 'just fine' in.",{"type":21,"tag":22,"props":49473,"children":49474},{},[49475,49477,49482,49484,49489,49491,49498,49500,49507,49509,49514],{"type":26,"value":49476},"You ",{"type":21,"tag":1084,"props":49478,"children":49479},{},[49480],{"type":26,"value":49481},"can",{"type":26,"value":49483}," set ",{"type":21,"tag":63,"props":49485,"children":49487},{"className":49486},[],[49488],{"type":26,"value":49400},{"type":26,"value":49490}," on your disabled options to hide them, and that will work - but as ",{"type":21,"tag":29,"props":49492,"children":49495},{"href":49493,"rel":49494},"http://stackoverflow.com/questions/17203826/chrome-bug-on-select-element-dropdown-when-many-options-are-hidden",[93],[49496],{"type":26,"value":49497},"stackoverflow user JMack discovered",{"type":26,"value":49499},", and per ",{"type":21,"tag":29,"props":49501,"children":49504},{"href":49502,"rel":49503},"http://code.google.com/p/chromium/issues/detail?id=139595",[93],[49505],{"type":26,"value":49506},"this long-standing chromium bug",{"type":26,"value":49508}," (open since Jul 30 2012, with the most recent activity on it a ",{"type":21,"tag":5270,"props":49510,"children":49511},{},[49512],{"type":26,"value":49513},"downgrade",{"type":26,"value":49515}," in priority), when you have hidden options in your select, the select dropdown will fail to resize itself appropriately - to the point that the dropdown may not show anything beyond the initial visible option, with the rest of the visible options hidden beneath. They're still selectable, and can be scrolled to, but the dropdown list will be tiny and scrolling won't work quite right, often leaving you with the top and bottom of the next two options visible.",{"type":21,"tag":22,"props":49517,"children":49518},{},[49519],{"type":26,"value":49520},"We're not here to complain, though - we're here to get things done. Let's whip up a workaround, and then discuss how to use it, how and why it works.",{"type":21,"tag":200,"props":49522,"children":49524},{"className":9044,"code":49523,"language":9046,"meta":8,"style":8},"(function($){\n    var userAgent = window.navigator.userAgent,\n        needsWrap = (userAgent.indexOf('Trident') !== -1 || userAgent.indexOf('AppleWebKit') !== -1);\n    /**\n     * Workaround for browsers that respect hidden options elements, but then fail to resize the select dropdown\n     * to display any visible elements beyond those that appear before any hidden elements - namely, Chrome.\n     * Based on the filter function, we either select all options that match (or, if invert is true, all that\n     * don't match), set them to disabled (with the expectation that there's a css rule hiding disabled options\n     * somewhere), and then pull the disabled options out of the DOM and insert them back in at the end of the\n     * select - this is tested as working in the most recent version of Chrome (as of this writing, v34).\n     * See also http://code.google.com/p/chromium/issues/detail?id=139595 and\n     * http://stackoverflow.com/questions/17203826/chrome-bug-on-select-element-dropdown-when-many-options-are-hidden\n     * for reports of the browser bug this works around.\n     *\n     * Additionally, we handle browsers that DON'T respect hidden options, by agent-sniffing such browsers\n     * and wrapping and unwrapping as necessary options that we want hidden in a span tag.\n     *\n     * @note This works, but DOM manipulation in IE is SLOW - much slower to perform an appendChild operation\n     * than any of the other major browsers. Wrapping/unwrapping large sets of options will take a relative long time (>2s)\n     * and have the potential to hang the UI thread.\n     * @param {string|HtmlElement|jQuery} el\n     * @param {function} filter\n     * @param {boolean=} invert\n     * @returns {jQuery}\n     */\n    $.elideOptions = function(el, filter, invert){\n        var $el = (el instanceof $) ? el : $(el);\n\n        $el.each(function(){\n            if (this.tagName !== 'SELECT') return;\n            var $this = $(this),\n                opts = $this.find('option').prop('disabled', false),\n                spans;\n\n            // Unwrap all options from their span tags\n            if (needsWrap && (spans = $this.find('span')) && spans.length){\n                spans.children().unwrap();\n            }\n\n            opts = (invert) ? opts.not(filter).prop('disabled', true) :\n                opts.filter(filter).prop('disabled', true);\n\n            // Wrap options in a single hidden span to hide them on browsers that don't support\n            // display:none for options\n            if (needsWrap) {\n                opts.wrapAll('\u003Cspan class=\"hide\">\u003C/span>');\n                opts = opts.parent('span');\n            }\n\n            opts.detach().appendTo($this);\n        });\n\n        return $el;\n    };\n\n    /**\n     * Allow for the $(element) form of invocation.\n     * @param {function} filter\n     * @param {boolean=} invert\n     * @returns {jQuery}\n     */\n    $.fn.elideOptions = function(filter, invert){\n        return $.elideOptions(this, filter, invert);\n    };\n})(jQuery);\n",[49525],{"type":21,"tag":63,"props":49526,"children":49527},{"__ignoreMap":8},[49528,49551,49572,49660,49667,49675,49683,49691,49699,49707,49715,49723,49731,49739,49746,49754,49762,49769,49786,49794,49802,49823,49843,49864,49880,49887,49938,49995,50002,50027,50068,50100,50161,50169,50176,50184,50248,50274,50281,50288,50351,50391,50398,50406,50414,50426,50451,50483,50490,50497,50524,50531,50538,50550,50557,50564,50571,50579,50598,50617,50632,50639,50679,50707,50714],{"type":21,"tag":209,"props":49529,"children":49530},{"class":211,"line":212},[49531,49535,49539,49543,49547],{"type":21,"tag":209,"props":49532,"children":49533},{"style":222},[49534],{"type":26,"value":368},{"type":21,"tag":209,"props":49536,"children":49537},{"style":216},[49538],{"type":26,"value":5370},{"type":21,"tag":209,"props":49540,"children":49541},{"style":222},[49542],{"type":26,"value":368},{"type":21,"tag":209,"props":49544,"children":49545},{"style":400},[49546],{"type":26,"value":10250},{"type":21,"tag":209,"props":49548,"children":49549},{"style":222},[49550],{"type":26,"value":2369},{"type":21,"tag":209,"props":49552,"children":49553},{"class":211,"line":244},[49554,49558,49563,49567],{"type":21,"tag":209,"props":49555,"children":49556},{"style":216},[49557],{"type":26,"value":10405},{"type":21,"tag":209,"props":49559,"children":49560},{"style":222},[49561],{"type":26,"value":49562}," userAgent ",{"type":21,"tag":209,"props":49564,"children":49565},{"style":216},[49566],{"type":26,"value":1432},{"type":21,"tag":209,"props":49568,"children":49569},{"style":222},[49570],{"type":26,"value":49571}," window.navigator.userAgent,\n",{"type":21,"tag":209,"props":49573,"children":49574},{"class":211,"line":254},[49575,49580,49584,49589,49593,49597,49602,49606,49610,49614,49618,49622,49627,49631,49635,49640,49644,49648,49652,49656],{"type":21,"tag":209,"props":49576,"children":49577},{"style":222},[49578],{"type":26,"value":49579},"        needsWrap ",{"type":21,"tag":209,"props":49581,"children":49582},{"style":216},[49583],{"type":26,"value":1432},{"type":21,"tag":209,"props":49585,"children":49586},{"style":222},[49587],{"type":26,"value":49588}," (userAgent.",{"type":21,"tag":209,"props":49590,"children":49591},{"style":360},[49592],{"type":26,"value":12392},{"type":21,"tag":209,"props":49594,"children":49595},{"style":222},[49596],{"type":26,"value":368},{"type":21,"tag":209,"props":49598,"children":49599},{"style":233},[49600],{"type":26,"value":49601},"'Trident'",{"type":21,"tag":209,"props":49603,"children":49604},{"style":222},[49605],{"type":26,"value":432},{"type":21,"tag":209,"props":49607,"children":49608},{"style":216},[49609],{"type":26,"value":12011},{"type":21,"tag":209,"props":49611,"children":49612},{"style":216},[49613],{"type":26,"value":12414},{"type":21,"tag":209,"props":49615,"children":49616},{"style":263},[49617],{"type":26,"value":3224},{"type":21,"tag":209,"props":49619,"children":49620},{"style":216},[49621],{"type":26,"value":18721},{"type":21,"tag":209,"props":49623,"children":49624},{"style":222},[49625],{"type":26,"value":49626}," userAgent.",{"type":21,"tag":209,"props":49628,"children":49629},{"style":360},[49630],{"type":26,"value":12392},{"type":21,"tag":209,"props":49632,"children":49633},{"style":222},[49634],{"type":26,"value":368},{"type":21,"tag":209,"props":49636,"children":49637},{"style":233},[49638],{"type":26,"value":49639},"'AppleWebKit'",{"type":21,"tag":209,"props":49641,"children":49642},{"style":222},[49643],{"type":26,"value":432},{"type":21,"tag":209,"props":49645,"children":49646},{"style":216},[49647],{"type":26,"value":12011},{"type":21,"tag":209,"props":49649,"children":49650},{"style":216},[49651],{"type":26,"value":12414},{"type":21,"tag":209,"props":49653,"children":49654},{"style":263},[49655],{"type":26,"value":3224},{"type":21,"tag":209,"props":49657,"children":49658},{"style":222},[49659],{"type":26,"value":2608},{"type":21,"tag":209,"props":49661,"children":49662},{"class":211,"line":279},[49663],{"type":21,"tag":209,"props":49664,"children":49665},{"style":448},[49666],{"type":26,"value":4697},{"type":21,"tag":209,"props":49668,"children":49669},{"class":211,"line":288},[49670],{"type":21,"tag":209,"props":49671,"children":49672},{"style":448},[49673],{"type":26,"value":49674},"     * Workaround for browsers that respect hidden options elements, but then fail to resize the select dropdown\n",{"type":21,"tag":209,"props":49676,"children":49677},{"class":211,"line":307},[49678],{"type":21,"tag":209,"props":49679,"children":49680},{"style":448},[49681],{"type":26,"value":49682},"     * to display any visible elements beyond those that appear before any hidden elements - namely, Chrome.\n",{"type":21,"tag":209,"props":49684,"children":49685},{"class":211,"line":325},[49686],{"type":21,"tag":209,"props":49687,"children":49688},{"style":448},[49689],{"type":26,"value":49690},"     * Based on the filter function, we either select all options that match (or, if invert is true, all that\n",{"type":21,"tag":209,"props":49692,"children":49693},{"class":211,"line":334},[49694],{"type":21,"tag":209,"props":49695,"children":49696},{"style":448},[49697],{"type":26,"value":49698},"     * don't match), set them to disabled (with the expectation that there's a css rule hiding disabled options\n",{"type":21,"tag":209,"props":49700,"children":49701},{"class":211,"line":343},[49702],{"type":21,"tag":209,"props":49703,"children":49704},{"style":448},[49705],{"type":26,"value":49706},"     * somewhere), and then pull the disabled options out of the DOM and insert them back in at the end of the\n",{"type":21,"tag":209,"props":49708,"children":49709},{"class":211,"line":351},[49710],{"type":21,"tag":209,"props":49711,"children":49712},{"style":448},[49713],{"type":26,"value":49714},"     * select - this is tested as working in the most recent version of Chrome (as of this writing, v34).\n",{"type":21,"tag":209,"props":49716,"children":49717},{"class":211,"line":444},[49718],{"type":21,"tag":209,"props":49719,"children":49720},{"style":448},[49721],{"type":26,"value":49722},"     * See also http://code.google.com/p/chromium/issues/detail?id=139595 and\n",{"type":21,"tag":209,"props":49724,"children":49725},{"class":211,"line":454},[49726],{"type":21,"tag":209,"props":49727,"children":49728},{"style":448},[49729],{"type":26,"value":49730},"     * http://stackoverflow.com/questions/17203826/chrome-bug-on-select-element-dropdown-when-many-options-are-hidden\n",{"type":21,"tag":209,"props":49732,"children":49733},{"class":211,"line":463},[49734],{"type":21,"tag":209,"props":49735,"children":49736},{"style":448},[49737],{"type":26,"value":49738},"     * for reports of the browser bug this works around.\n",{"type":21,"tag":209,"props":49740,"children":49741},{"class":211,"line":472},[49742],{"type":21,"tag":209,"props":49743,"children":49744},{"style":448},[49745],{"type":26,"value":15103},{"type":21,"tag":209,"props":49747,"children":49748},{"class":211,"line":480},[49749],{"type":21,"tag":209,"props":49750,"children":49751},{"style":448},[49752],{"type":26,"value":49753},"     * Additionally, we handle browsers that DON'T respect hidden options, by agent-sniffing such browsers\n",{"type":21,"tag":209,"props":49755,"children":49756},{"class":211,"line":489},[49757],{"type":21,"tag":209,"props":49758,"children":49759},{"style":448},[49760],{"type":26,"value":49761},"     * and wrapping and unwrapping as necessary options that we want hidden in a span tag.\n",{"type":21,"tag":209,"props":49763,"children":49764},{"class":211,"line":847},[49765],{"type":21,"tag":209,"props":49766,"children":49767},{"style":448},[49768],{"type":26,"value":15103},{"type":21,"tag":209,"props":49770,"children":49771},{"class":211,"line":860},[49772,49776,49781],{"type":21,"tag":209,"props":49773,"children":49774},{"style":448},[49775],{"type":26,"value":4713},{"type":21,"tag":209,"props":49777,"children":49778},{"style":216},[49779],{"type":26,"value":49780},"@note",{"type":21,"tag":209,"props":49782,"children":49783},{"style":448},[49784],{"type":26,"value":49785}," This works, but DOM manipulation in IE is SLOW - much slower to perform an appendChild operation\n",{"type":21,"tag":209,"props":49787,"children":49788},{"class":211,"line":877},[49789],{"type":21,"tag":209,"props":49790,"children":49791},{"style":448},[49792],{"type":26,"value":49793},"     * than any of the other major browsers. Wrapping/unwrapping large sets of options will take a relative long time (>2s)\n",{"type":21,"tag":209,"props":49795,"children":49796},{"class":211,"line":889},[49797],{"type":21,"tag":209,"props":49798,"children":49799},{"style":448},[49800],{"type":26,"value":49801},"     * and have the potential to hang the UI thread.\n",{"type":21,"tag":209,"props":49803,"children":49804},{"class":211,"line":902},[49805,49809,49813,49818],{"type":21,"tag":209,"props":49806,"children":49807},{"style":448},[49808],{"type":26,"value":4713},{"type":21,"tag":209,"props":49810,"children":49811},{"style":216},[49812],{"type":26,"value":4718},{"type":21,"tag":209,"props":49814,"children":49815},{"style":360},[49816],{"type":26,"value":49817}," {string|HtmlElement|jQuery}",{"type":21,"tag":209,"props":49819,"children":49820},{"style":222},[49821],{"type":26,"value":49822}," el\n",{"type":21,"tag":209,"props":49824,"children":49825},{"class":211,"line":914},[49826,49830,49834,49838],{"type":21,"tag":209,"props":49827,"children":49828},{"style":448},[49829],{"type":26,"value":4713},{"type":21,"tag":209,"props":49831,"children":49832},{"style":216},[49833],{"type":26,"value":4718},{"type":21,"tag":209,"props":49835,"children":49836},{"style":360},[49837],{"type":26,"value":36224},{"type":21,"tag":209,"props":49839,"children":49840},{"style":222},[49841],{"type":26,"value":49842}," filter\n",{"type":21,"tag":209,"props":49844,"children":49845},{"class":211,"line":922},[49846,49850,49854,49859],{"type":21,"tag":209,"props":49847,"children":49848},{"style":448},[49849],{"type":26,"value":4713},{"type":21,"tag":209,"props":49851,"children":49852},{"style":216},[49853],{"type":26,"value":4718},{"type":21,"tag":209,"props":49855,"children":49856},{"style":360},[49857],{"type":26,"value":49858}," {boolean=}",{"type":21,"tag":209,"props":49860,"children":49861},{"style":222},[49862],{"type":26,"value":49863}," invert\n",{"type":21,"tag":209,"props":49865,"children":49866},{"class":211,"line":2312},[49867,49871,49875],{"type":21,"tag":209,"props":49868,"children":49869},{"style":448},[49870],{"type":26,"value":4713},{"type":21,"tag":209,"props":49872,"children":49873},{"style":216},[49874],{"type":26,"value":4740},{"type":21,"tag":209,"props":49876,"children":49877},{"style":360},[49878],{"type":26,"value":49879}," {jQuery}\n",{"type":21,"tag":209,"props":49881,"children":49882},{"class":211,"line":2321},[49883],{"type":21,"tag":209,"props":49884,"children":49885},{"style":448},[49886],{"type":26,"value":4753},{"type":21,"tag":209,"props":49888,"children":49889},{"class":211,"line":2372},[49890,49894,49899,49903,49907,49911,49916,49920,49925,49929,49934],{"type":21,"tag":209,"props":49891,"children":49892},{"style":222},[49893],{"type":26,"value":31124},{"type":21,"tag":209,"props":49895,"children":49896},{"style":360},[49897],{"type":26,"value":49898},"elideOptions",{"type":21,"tag":209,"props":49900,"children":49901},{"style":216},[49902],{"type":26,"value":271},{"type":21,"tag":209,"props":49904,"children":49905},{"style":216},[49906],{"type":26,"value":4766},{"type":21,"tag":209,"props":49908,"children":49909},{"style":222},[49910],{"type":26,"value":368},{"type":21,"tag":209,"props":49912,"children":49913},{"style":400},[49914],{"type":26,"value":49915},"el",{"type":21,"tag":209,"props":49917,"children":49918},{"style":222},[49919],{"type":26,"value":408},{"type":21,"tag":209,"props":49921,"children":49922},{"style":400},[49923],{"type":26,"value":49924},"filter",{"type":21,"tag":209,"props":49926,"children":49927},{"style":222},[49928],{"type":26,"value":408},{"type":21,"tag":209,"props":49930,"children":49931},{"style":400},[49932],{"type":26,"value":49933},"invert",{"type":21,"tag":209,"props":49935,"children":49936},{"style":222},[49937],{"type":26,"value":2369},{"type":21,"tag":209,"props":49939,"children":49940},{"class":211,"line":2381},[49941,49945,49950,49954,49959,49964,49969,49973,49977,49982,49986,49990],{"type":21,"tag":209,"props":49942,"children":49943},{"style":216},[49944],{"type":26,"value":5925},{"type":21,"tag":209,"props":49946,"children":49947},{"style":222},[49948],{"type":26,"value":49949}," $el ",{"type":21,"tag":209,"props":49951,"children":49952},{"style":216},[49953],{"type":26,"value":1432},{"type":21,"tag":209,"props":49955,"children":49956},{"style":222},[49957],{"type":26,"value":49958}," (el ",{"type":21,"tag":209,"props":49960,"children":49961},{"style":216},[49962],{"type":26,"value":49963},"instanceof",{"type":21,"tag":209,"props":49965,"children":49966},{"style":360},[49967],{"type":26,"value":49968}," $",{"type":21,"tag":209,"props":49970,"children":49971},{"style":222},[49972],{"type":26,"value":432},{"type":21,"tag":209,"props":49974,"children":49975},{"style":216},[49976],{"type":26,"value":15218},{"type":21,"tag":209,"props":49978,"children":49979},{"style":222},[49980],{"type":26,"value":49981}," el ",{"type":21,"tag":209,"props":49983,"children":49984},{"style":216},[49985],{"type":26,"value":191},{"type":21,"tag":209,"props":49987,"children":49988},{"style":360},[49989],{"type":26,"value":49968},{"type":21,"tag":209,"props":49991,"children":49992},{"style":222},[49993],{"type":26,"value":49994},"(el);\n",{"type":21,"tag":209,"props":49996,"children":49997},{"class":211,"line":2389},[49998],{"type":21,"tag":209,"props":49999,"children":50000},{"emptyLinePlaceholder":248},[50001],{"type":26,"value":251},{"type":21,"tag":209,"props":50003,"children":50004},{"class":211,"line":2397},[50005,50010,50015,50019,50023],{"type":21,"tag":209,"props":50006,"children":50007},{"style":222},[50008],{"type":26,"value":50009},"        $el.",{"type":21,"tag":209,"props":50011,"children":50012},{"style":360},[50013],{"type":26,"value":50014},"each",{"type":21,"tag":209,"props":50016,"children":50017},{"style":222},[50018],{"type":26,"value":368},{"type":21,"tag":209,"props":50020,"children":50021},{"style":216},[50022],{"type":26,"value":5370},{"type":21,"tag":209,"props":50024,"children":50025},{"style":222},[50026],{"type":26,"value":2561},{"type":21,"tag":209,"props":50028,"children":50029},{"class":211,"line":2406},[50030,50034,50038,50042,50047,50051,50056,50060,50064],{"type":21,"tag":209,"props":50031,"children":50032},{"style":216},[50033],{"type":26,"value":6083},{"type":21,"tag":209,"props":50035,"children":50036},{"style":222},[50037],{"type":26,"value":4776},{"type":21,"tag":209,"props":50039,"children":50040},{"style":263},[50041],{"type":26,"value":2508},{"type":21,"tag":209,"props":50043,"children":50044},{"style":222},[50045],{"type":26,"value":50046},".tagName ",{"type":21,"tag":209,"props":50048,"children":50049},{"style":216},[50050],{"type":26,"value":12011},{"type":21,"tag":209,"props":50052,"children":50053},{"style":233},[50054],{"type":26,"value":50055}," 'SELECT'",{"type":21,"tag":209,"props":50057,"children":50058},{"style":222},[50059],{"type":26,"value":432},{"type":21,"tag":209,"props":50061,"children":50062},{"style":216},[50063],{"type":26,"value":5813},{"type":21,"tag":209,"props":50065,"children":50066},{"style":222},[50067],{"type":26,"value":241},{"type":21,"tag":209,"props":50069,"children":50070},{"class":211,"line":2415},[50071,50075,50080,50084,50088,50092,50096],{"type":21,"tag":209,"props":50072,"children":50073},{"style":216},[50074],{"type":26,"value":5959},{"type":21,"tag":209,"props":50076,"children":50077},{"style":222},[50078],{"type":26,"value":50079}," $this ",{"type":21,"tag":209,"props":50081,"children":50082},{"style":216},[50083],{"type":26,"value":1432},{"type":21,"tag":209,"props":50085,"children":50086},{"style":360},[50087],{"type":26,"value":49968},{"type":21,"tag":209,"props":50089,"children":50090},{"style":222},[50091],{"type":26,"value":368},{"type":21,"tag":209,"props":50093,"children":50094},{"style":263},[50095],{"type":26,"value":2508},{"type":21,"tag":209,"props":50097,"children":50098},{"style":222},[50099],{"type":26,"value":10277},{"type":21,"tag":209,"props":50101,"children":50102},{"class":211,"line":2424},[50103,50108,50112,50117,50122,50126,50131,50135,50140,50144,50149,50153,50157],{"type":21,"tag":209,"props":50104,"children":50105},{"style":222},[50106],{"type":26,"value":50107},"                opts ",{"type":21,"tag":209,"props":50109,"children":50110},{"style":216},[50111],{"type":26,"value":1432},{"type":21,"tag":209,"props":50113,"children":50114},{"style":222},[50115],{"type":26,"value":50116}," $this.",{"type":21,"tag":209,"props":50118,"children":50119},{"style":360},[50120],{"type":26,"value":50121},"find",{"type":21,"tag":209,"props":50123,"children":50124},{"style":222},[50125],{"type":26,"value":368},{"type":21,"tag":209,"props":50127,"children":50128},{"style":233},[50129],{"type":26,"value":50130},"'option'",{"type":21,"tag":209,"props":50132,"children":50133},{"style":222},[50134],{"type":26,"value":2699},{"type":21,"tag":209,"props":50136,"children":50137},{"style":360},[50138],{"type":26,"value":50139},"prop",{"type":21,"tag":209,"props":50141,"children":50142},{"style":222},[50143],{"type":26,"value":368},{"type":21,"tag":209,"props":50145,"children":50146},{"style":233},[50147],{"type":26,"value":50148},"'disabled'",{"type":21,"tag":209,"props":50150,"children":50151},{"style":222},[50152],{"type":26,"value":408},{"type":21,"tag":209,"props":50154,"children":50155},{"style":263},[50156],{"type":26,"value":27598},{"type":21,"tag":209,"props":50158,"children":50159},{"style":222},[50160],{"type":26,"value":10277},{"type":21,"tag":209,"props":50162,"children":50163},{"class":211,"line":2433},[50164],{"type":21,"tag":209,"props":50165,"children":50166},{"style":222},[50167],{"type":26,"value":50168},"                spans;\n",{"type":21,"tag":209,"props":50170,"children":50171},{"class":211,"line":2442},[50172],{"type":21,"tag":209,"props":50173,"children":50174},{"emptyLinePlaceholder":248},[50175],{"type":26,"value":251},{"type":21,"tag":209,"props":50177,"children":50178},{"class":211,"line":2471},[50179],{"type":21,"tag":209,"props":50180,"children":50181},{"style":448},[50182],{"type":26,"value":50183},"            // Unwrap all options from their span tags\n",{"type":21,"tag":209,"props":50185,"children":50186},{"class":211,"line":2480},[50187,50191,50196,50200,50205,50209,50213,50217,50221,50226,50231,50235,50240,50244],{"type":21,"tag":209,"props":50188,"children":50189},{"style":216},[50190],{"type":26,"value":6083},{"type":21,"tag":209,"props":50192,"children":50193},{"style":222},[50194],{"type":26,"value":50195}," (needsWrap ",{"type":21,"tag":209,"props":50197,"children":50198},{"style":216},[50199],{"type":26,"value":15578},{"type":21,"tag":209,"props":50201,"children":50202},{"style":222},[50203],{"type":26,"value":50204}," (spans ",{"type":21,"tag":209,"props":50206,"children":50207},{"style":216},[50208],{"type":26,"value":1432},{"type":21,"tag":209,"props":50210,"children":50211},{"style":222},[50212],{"type":26,"value":50116},{"type":21,"tag":209,"props":50214,"children":50215},{"style":360},[50216],{"type":26,"value":50121},{"type":21,"tag":209,"props":50218,"children":50219},{"style":222},[50220],{"type":26,"value":368},{"type":21,"tag":209,"props":50222,"children":50223},{"style":233},[50224],{"type":26,"value":50225},"'span'",{"type":21,"tag":209,"props":50227,"children":50228},{"style":222},[50229],{"type":26,"value":50230},")) ",{"type":21,"tag":209,"props":50232,"children":50233},{"style":216},[50234],{"type":26,"value":15578},{"type":21,"tag":209,"props":50236,"children":50237},{"style":222},[50238],{"type":26,"value":50239}," spans.",{"type":21,"tag":209,"props":50241,"children":50242},{"style":263},[50243],{"type":26,"value":36467},{"type":21,"tag":209,"props":50245,"children":50246},{"style":222},[50247],{"type":26,"value":2369},{"type":21,"tag":209,"props":50249,"children":50250},{"class":211,"line":2489},[50251,50256,50261,50265,50270],{"type":21,"tag":209,"props":50252,"children":50253},{"style":222},[50254],{"type":26,"value":50255},"                spans.",{"type":21,"tag":209,"props":50257,"children":50258},{"style":360},[50259],{"type":26,"value":50260},"children",{"type":21,"tag":209,"props":50262,"children":50263},{"style":222},[50264],{"type":26,"value":11910},{"type":21,"tag":209,"props":50266,"children":50267},{"style":360},[50268],{"type":26,"value":50269},"unwrap",{"type":21,"tag":209,"props":50271,"children":50272},{"style":222},[50273],{"type":26,"value":4842},{"type":21,"tag":209,"props":50275,"children":50276},{"class":211,"line":2516},[50277],{"type":21,"tag":209,"props":50278,"children":50279},{"style":222},[50280],{"type":26,"value":6136},{"type":21,"tag":209,"props":50282,"children":50283},{"class":211,"line":2525},[50284],{"type":21,"tag":209,"props":50285,"children":50286},{"emptyLinePlaceholder":248},[50287],{"type":26,"value":251},{"type":21,"tag":209,"props":50289,"children":50290},{"class":211,"line":2533},[50291,50296,50300,50305,50309,50314,50318,50323,50327,50331,50335,50339,50343,50347],{"type":21,"tag":209,"props":50292,"children":50293},{"style":222},[50294],{"type":26,"value":50295},"            opts ",{"type":21,"tag":209,"props":50297,"children":50298},{"style":216},[50299],{"type":26,"value":1432},{"type":21,"tag":209,"props":50301,"children":50302},{"style":222},[50303],{"type":26,"value":50304}," (invert) ",{"type":21,"tag":209,"props":50306,"children":50307},{"style":216},[50308],{"type":26,"value":15218},{"type":21,"tag":209,"props":50310,"children":50311},{"style":222},[50312],{"type":26,"value":50313}," opts.",{"type":21,"tag":209,"props":50315,"children":50316},{"style":360},[50317],{"type":26,"value":23324},{"type":21,"tag":209,"props":50319,"children":50320},{"style":222},[50321],{"type":26,"value":50322},"(filter).",{"type":21,"tag":209,"props":50324,"children":50325},{"style":360},[50326],{"type":26,"value":50139},{"type":21,"tag":209,"props":50328,"children":50329},{"style":222},[50330],{"type":26,"value":368},{"type":21,"tag":209,"props":50332,"children":50333},{"style":233},[50334],{"type":26,"value":50148},{"type":21,"tag":209,"props":50336,"children":50337},{"style":222},[50338],{"type":26,"value":408},{"type":21,"tag":209,"props":50340,"children":50341},{"style":263},[50342],{"type":26,"value":2223},{"type":21,"tag":209,"props":50344,"children":50345},{"style":222},[50346],{"type":26,"value":432},{"type":21,"tag":209,"props":50348,"children":50349},{"style":216},[50350],{"type":26,"value":844},{"type":21,"tag":209,"props":50352,"children":50353},{"class":211,"line":2542},[50354,50359,50363,50367,50371,50375,50379,50383,50387],{"type":21,"tag":209,"props":50355,"children":50356},{"style":222},[50357],{"type":26,"value":50358},"                opts.",{"type":21,"tag":209,"props":50360,"children":50361},{"style":360},[50362],{"type":26,"value":49924},{"type":21,"tag":209,"props":50364,"children":50365},{"style":222},[50366],{"type":26,"value":50322},{"type":21,"tag":209,"props":50368,"children":50369},{"style":360},[50370],{"type":26,"value":50139},{"type":21,"tag":209,"props":50372,"children":50373},{"style":222},[50374],{"type":26,"value":368},{"type":21,"tag":209,"props":50376,"children":50377},{"style":233},[50378],{"type":26,"value":50148},{"type":21,"tag":209,"props":50380,"children":50381},{"style":222},[50382],{"type":26,"value":408},{"type":21,"tag":209,"props":50384,"children":50385},{"style":263},[50386],{"type":26,"value":2223},{"type":21,"tag":209,"props":50388,"children":50389},{"style":222},[50390],{"type":26,"value":2608},{"type":21,"tag":209,"props":50392,"children":50393},{"class":211,"line":2550},[50394],{"type":21,"tag":209,"props":50395,"children":50396},{"emptyLinePlaceholder":248},[50397],{"type":26,"value":251},{"type":21,"tag":209,"props":50399,"children":50400},{"class":211,"line":2564},[50401],{"type":21,"tag":209,"props":50402,"children":50403},{"style":448},[50404],{"type":26,"value":50405},"            // Wrap options in a single hidden span to hide them on browsers that don't support\n",{"type":21,"tag":209,"props":50407,"children":50408},{"class":211,"line":2611},[50409],{"type":21,"tag":209,"props":50410,"children":50411},{"style":448},[50412],{"type":26,"value":50413},"            // display:none for options\n",{"type":21,"tag":209,"props":50415,"children":50416},{"class":211,"line":2619},[50417,50421],{"type":21,"tag":209,"props":50418,"children":50419},{"style":216},[50420],{"type":26,"value":6083},{"type":21,"tag":209,"props":50422,"children":50423},{"style":222},[50424],{"type":26,"value":50425}," (needsWrap) {\n",{"type":21,"tag":209,"props":50427,"children":50428},{"class":211,"line":2627},[50429,50433,50438,50442,50447],{"type":21,"tag":209,"props":50430,"children":50431},{"style":222},[50432],{"type":26,"value":50358},{"type":21,"tag":209,"props":50434,"children":50435},{"style":360},[50436],{"type":26,"value":50437},"wrapAll",{"type":21,"tag":209,"props":50439,"children":50440},{"style":222},[50441],{"type":26,"value":368},{"type":21,"tag":209,"props":50443,"children":50444},{"style":233},[50445],{"type":26,"value":50446},"'\u003Cspan class=\"hide\">\u003C/span>'",{"type":21,"tag":209,"props":50448,"children":50449},{"style":222},[50450],{"type":26,"value":2608},{"type":21,"tag":209,"props":50452,"children":50453},{"class":211,"line":2636},[50454,50458,50462,50466,50471,50475,50479],{"type":21,"tag":209,"props":50455,"children":50456},{"style":222},[50457],{"type":26,"value":50107},{"type":21,"tag":209,"props":50459,"children":50460},{"style":216},[50461],{"type":26,"value":1432},{"type":21,"tag":209,"props":50463,"children":50464},{"style":222},[50465],{"type":26,"value":50313},{"type":21,"tag":209,"props":50467,"children":50468},{"style":360},[50469],{"type":26,"value":50470},"parent",{"type":21,"tag":209,"props":50472,"children":50473},{"style":222},[50474],{"type":26,"value":368},{"type":21,"tag":209,"props":50476,"children":50477},{"style":233},[50478],{"type":26,"value":50225},{"type":21,"tag":209,"props":50480,"children":50481},{"style":222},[50482],{"type":26,"value":2608},{"type":21,"tag":209,"props":50484,"children":50485},{"class":211,"line":2644},[50486],{"type":21,"tag":209,"props":50487,"children":50488},{"style":222},[50489],{"type":26,"value":6136},{"type":21,"tag":209,"props":50491,"children":50492},{"class":211,"line":2657},[50493],{"type":21,"tag":209,"props":50494,"children":50495},{"emptyLinePlaceholder":248},[50496],{"type":26,"value":251},{"type":21,"tag":209,"props":50498,"children":50499},{"class":211,"line":2728},[50500,50505,50510,50514,50519],{"type":21,"tag":209,"props":50501,"children":50502},{"style":222},[50503],{"type":26,"value":50504},"            opts.",{"type":21,"tag":209,"props":50506,"children":50507},{"style":360},[50508],{"type":26,"value":50509},"detach",{"type":21,"tag":209,"props":50511,"children":50512},{"style":222},[50513],{"type":26,"value":11910},{"type":21,"tag":209,"props":50515,"children":50516},{"style":360},[50517],{"type":26,"value":50518},"appendTo",{"type":21,"tag":209,"props":50520,"children":50521},{"style":222},[50522],{"type":26,"value":50523},"($this);\n",{"type":21,"tag":209,"props":50525,"children":50526},{"class":211,"line":2758},[50527],{"type":21,"tag":209,"props":50528,"children":50529},{"style":222},[50530],{"type":26,"value":5114},{"type":21,"tag":209,"props":50532,"children":50533},{"class":211,"line":2776},[50534],{"type":21,"tag":209,"props":50535,"children":50536},{"emptyLinePlaceholder":248},[50537],{"type":26,"value":251},{"type":21,"tag":209,"props":50539,"children":50540},{"class":211,"line":2785},[50541,50545],{"type":21,"tag":209,"props":50542,"children":50543},{"style":216},[50544],{"type":26,"value":3069},{"type":21,"tag":209,"props":50546,"children":50547},{"style":222},[50548],{"type":26,"value":50549}," $el;\n",{"type":21,"tag":209,"props":50551,"children":50552},{"class":211,"line":2793},[50553],{"type":21,"tag":209,"props":50554,"children":50555},{"style":222},[50556],{"type":26,"value":4850},{"type":21,"tag":209,"props":50558,"children":50559},{"class":211,"line":2801},[50560],{"type":21,"tag":209,"props":50561,"children":50562},{"emptyLinePlaceholder":248},[50563],{"type":26,"value":251},{"type":21,"tag":209,"props":50565,"children":50566},{"class":211,"line":2809},[50567],{"type":21,"tag":209,"props":50568,"children":50569},{"style":448},[50570],{"type":26,"value":4697},{"type":21,"tag":209,"props":50572,"children":50573},{"class":211,"line":6219},[50574],{"type":21,"tag":209,"props":50575,"children":50576},{"style":448},[50577],{"type":26,"value":50578},"     * Allow for the $(element) form of invocation.\n",{"type":21,"tag":209,"props":50580,"children":50581},{"class":211,"line":6228},[50582,50586,50590,50594],{"type":21,"tag":209,"props":50583,"children":50584},{"style":448},[50585],{"type":26,"value":4713},{"type":21,"tag":209,"props":50587,"children":50588},{"style":216},[50589],{"type":26,"value":4718},{"type":21,"tag":209,"props":50591,"children":50592},{"style":360},[50593],{"type":26,"value":36224},{"type":21,"tag":209,"props":50595,"children":50596},{"style":222},[50597],{"type":26,"value":49842},{"type":21,"tag":209,"props":50599,"children":50600},{"class":211,"line":6250},[50601,50605,50609,50613],{"type":21,"tag":209,"props":50602,"children":50603},{"style":448},[50604],{"type":26,"value":4713},{"type":21,"tag":209,"props":50606,"children":50607},{"style":216},[50608],{"type":26,"value":4718},{"type":21,"tag":209,"props":50610,"children":50611},{"style":360},[50612],{"type":26,"value":49858},{"type":21,"tag":209,"props":50614,"children":50615},{"style":222},[50616],{"type":26,"value":49863},{"type":21,"tag":209,"props":50618,"children":50619},{"class":211,"line":6258},[50620,50624,50628],{"type":21,"tag":209,"props":50621,"children":50622},{"style":448},[50623],{"type":26,"value":4713},{"type":21,"tag":209,"props":50625,"children":50626},{"style":216},[50627],{"type":26,"value":4740},{"type":21,"tag":209,"props":50629,"children":50630},{"style":360},[50631],{"type":26,"value":49879},{"type":21,"tag":209,"props":50633,"children":50634},{"class":211,"line":6267},[50635],{"type":21,"tag":209,"props":50636,"children":50637},{"style":448},[50638],{"type":26,"value":4753},{"type":21,"tag":209,"props":50640,"children":50641},{"class":211,"line":6303},[50642,50647,50651,50655,50659,50663,50667,50671,50675],{"type":21,"tag":209,"props":50643,"children":50644},{"style":222},[50645],{"type":26,"value":50646},"    $.fn.",{"type":21,"tag":209,"props":50648,"children":50649},{"style":360},[50650],{"type":26,"value":49898},{"type":21,"tag":209,"props":50652,"children":50653},{"style":216},[50654],{"type":26,"value":271},{"type":21,"tag":209,"props":50656,"children":50657},{"style":216},[50658],{"type":26,"value":4766},{"type":21,"tag":209,"props":50660,"children":50661},{"style":222},[50662],{"type":26,"value":368},{"type":21,"tag":209,"props":50664,"children":50665},{"style":400},[50666],{"type":26,"value":49924},{"type":21,"tag":209,"props":50668,"children":50669},{"style":222},[50670],{"type":26,"value":408},{"type":21,"tag":209,"props":50672,"children":50673},{"style":400},[50674],{"type":26,"value":49933},{"type":21,"tag":209,"props":50676,"children":50677},{"style":222},[50678],{"type":26,"value":2369},{"type":21,"tag":209,"props":50680,"children":50681},{"class":211,"line":6336},[50682,50686,50690,50694,50698,50702],{"type":21,"tag":209,"props":50683,"children":50684},{"style":216},[50685],{"type":26,"value":3069},{"type":21,"tag":209,"props":50687,"children":50688},{"style":222},[50689],{"type":26,"value":26905},{"type":21,"tag":209,"props":50691,"children":50692},{"style":360},[50693],{"type":26,"value":49898},{"type":21,"tag":209,"props":50695,"children":50696},{"style":222},[50697],{"type":26,"value":368},{"type":21,"tag":209,"props":50699,"children":50700},{"style":263},[50701],{"type":26,"value":2508},{"type":21,"tag":209,"props":50703,"children":50704},{"style":222},[50705],{"type":26,"value":50706},", filter, invert);\n",{"type":21,"tag":209,"props":50708,"children":50709},{"class":211,"line":6369},[50710],{"type":21,"tag":209,"props":50711,"children":50712},{"style":222},[50713],{"type":26,"value":4850},{"type":21,"tag":209,"props":50715,"children":50716},{"class":211,"line":6378},[50717],{"type":21,"tag":209,"props":50718,"children":50719},{"style":222},[50720],{"type":26,"value":50721},"})(jQuery);\n",{"type":21,"tag":22,"props":50723,"children":50724},{},[50725],{"type":26,"value":50726},"Usage for this plugin looks like:",{"type":21,"tag":200,"props":50728,"children":50730},{"className":9044,"code":50729,"language":9046,"meta":8,"style":8},"$.elideOptions('#mydiv select', function(){ \n    /* return true to keep option in selected set */\n});\n",[50731],{"type":21,"tag":63,"props":50732,"children":50733},{"__ignoreMap":8},[50734,50767,50775],{"type":21,"tag":209,"props":50735,"children":50736},{"class":211,"line":212},[50737,50741,50745,50749,50754,50758,50762],{"type":21,"tag":209,"props":50738,"children":50739},{"style":222},[50740],{"type":26,"value":17973},{"type":21,"tag":209,"props":50742,"children":50743},{"style":360},[50744],{"type":26,"value":49898},{"type":21,"tag":209,"props":50746,"children":50747},{"style":222},[50748],{"type":26,"value":368},{"type":21,"tag":209,"props":50750,"children":50751},{"style":233},[50752],{"type":26,"value":50753},"'#mydiv select'",{"type":21,"tag":209,"props":50755,"children":50756},{"style":222},[50757],{"type":26,"value":408},{"type":21,"tag":209,"props":50759,"children":50760},{"style":216},[50761],{"type":26,"value":5370},{"type":21,"tag":209,"props":50763,"children":50764},{"style":222},[50765],{"type":26,"value":50766},"(){ \n",{"type":21,"tag":209,"props":50768,"children":50769},{"class":211,"line":244},[50770],{"type":21,"tag":209,"props":50771,"children":50772},{"style":448},[50773],{"type":26,"value":50774},"    /* return true to keep option in selected set */\n",{"type":21,"tag":209,"props":50776,"children":50777},{"class":211,"line":254},[50778],{"type":21,"tag":209,"props":50779,"children":50780},{"style":222},[50781],{"type":26,"value":469},{"type":21,"tag":22,"props":50783,"children":50784},{},[50785],{"type":26,"value":21981},{"type":21,"tag":200,"props":50787,"children":50789},{"className":9044,"code":50788,"language":9046,"meta":8,"style":8},"$('#mydiv select').elideOptions(function(){ \n    /* return true to keep option in selected set */ \n});\n",[50790],{"type":21,"tag":63,"props":50791,"children":50792},{"__ignoreMap":8},[50793,50828,50840],{"type":21,"tag":209,"props":50794,"children":50795},{"class":211,"line":212},[50796,50800,50804,50808,50812,50816,50820,50824],{"type":21,"tag":209,"props":50797,"children":50798},{"style":360},[50799],{"type":26,"value":10250},{"type":21,"tag":209,"props":50801,"children":50802},{"style":222},[50803],{"type":26,"value":368},{"type":21,"tag":209,"props":50805,"children":50806},{"style":233},[50807],{"type":26,"value":50753},{"type":21,"tag":209,"props":50809,"children":50810},{"style":222},[50811],{"type":26,"value":2699},{"type":21,"tag":209,"props":50813,"children":50814},{"style":360},[50815],{"type":26,"value":49898},{"type":21,"tag":209,"props":50817,"children":50818},{"style":222},[50819],{"type":26,"value":368},{"type":21,"tag":209,"props":50821,"children":50822},{"style":216},[50823],{"type":26,"value":5370},{"type":21,"tag":209,"props":50825,"children":50826},{"style":222},[50827],{"type":26,"value":50766},{"type":21,"tag":209,"props":50829,"children":50830},{"class":211,"line":244},[50831,50836],{"type":21,"tag":209,"props":50832,"children":50833},{"style":448},[50834],{"type":26,"value":50835},"    /* return true to keep option in selected set */",{"type":21,"tag":209,"props":50837,"children":50838},{"style":222},[50839],{"type":26,"value":25950},{"type":21,"tag":209,"props":50841,"children":50842},{"class":211,"line":254},[50843],{"type":21,"tag":209,"props":50844,"children":50845},{"style":222},[50846],{"type":26,"value":469},{"type":21,"tag":22,"props":50848,"children":50849},{},[50850,50852,50857,50859,50864,50866,50871],{"type":26,"value":50851},"Additionally, you can specify a third optional parameter, ",{"type":21,"tag":63,"props":50853,"children":50855},{"className":50854},[],[50856],{"type":26,"value":49933},{"type":26,"value":50858}," - if true, the logic of the filter function is inverted (that is, options that match the criteria [ie. you return true from the filter function] will be omitted from the options that will be acted upon - essentially, using ",{"type":21,"tag":63,"props":50860,"children":50862},{"className":50861},[],[50863],{"type":26,"value":23324},{"type":26,"value":50865}," instead of ",{"type":21,"tag":63,"props":50867,"children":50869},{"className":50868},[],[50870],{"type":26,"value":49924},{"type":26,"value":50872}," on the set).",{"type":21,"tag":22,"props":50874,"children":50875},{},[50876,50878,50885],{"type":26,"value":50877},"As per the comments at the top of the above gist, we work around our issue with Chrome by performing the disable as per usual, then ",{"type":21,"tag":29,"props":50879,"children":50882},{"href":50880,"rel":50881},"https://api.jquery.com/detach/",[93],[50883],{"type":26,"value":50884},"detaching",{"type":26,"value":50886}," the disabled options from the select, and appending them back onto the end of the select.",{"type":21,"tag":22,"props":50888,"children":50889},{},[50890],{"type":26,"value":50891},"The behaviour of this bug is such that any visible options that occur after hidden elements aren't counted towards the height of the list box - by ensuring all visible options will be above any hidden options, we avoid this behaviour. Now we can still filter on the elements within the select, not needing to create a shadow element or object to store state for this select, while still having the select dropdown expand to the dimensions of the visible options as expected.",{"type":21,"tag":22,"props":50893,"children":50894},{},[50895,50897,50904],{"type":26,"value":50896},"So, we know the how - but are you curious as to the why? The answer lurks somewhere in ",{"type":21,"tag":29,"props":50898,"children":50901},{"href":50899,"rel":50900},"https://codereview.chromium.org/189543012/diff/200001/Source/core/rendering/RenderListBox.cpp",[93],[50902],{"type":26,"value":50903},"this diff",{"type":26,"value":50905},". I've only had time to give it a cursory read-through - there's not a lot to go on, given the lack of documentation (come on guys, a doc-block per function wouldn't be that hard), but given the bug behaviour, it probably has something to do with either the calculation of the list box height only including those items encountered before the first hidden item, or with the lastIndex being calculated as the last visible element before the first hidden element.",{"type":21,"tag":22,"props":50907,"children":50908},{},[50909],{"type":26,"value":50910},"Need to get the job done today? My plugin can help with that. Want to be a hero? Go fix this for realsies.",{"type":21,"tag":3490,"props":50912,"children":50913},{},[50914],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":50916},[],"content:ckeefer:2014-4:hidden-options.md","ckeefer/2014-4/hidden-options.md","ckeefer/2014-4/hidden-options",{"user":3518,"name":3519},{"_path":50922,"_dir":50923,"_draft":7,"_partial":7,"_locale":8,"title":50924,"description":50925,"publishDate":50926,"tags":50927,"excerpt":50925,"body":50928,"_type":3511,"_id":55746,"_source":3513,"_file":55747,"_stem":55748,"_extension":3516,"author":55749},"/ckeefer/2014-3/customgmapsinfowindow","2014-3","Custom Google Maps Info Windows","When it comes time to relate the ephemeral world of data to the physical world, Maps are key in both enterprise and consumer applications. Whatever else you might think of it, Google Maps tends to be the default option - certainly, its the only one I've ever had clients ask for by name.","2014-02-26",[12,46737],{"type":18,"children":50929,"toc":55738},[50930,50934,50939,50950,50956,50970,51056,51061,51074,51326,51331,51336,51341,52767,52772,52811,52823,53191,53197,53218,53223,53318,53323,53328,53468,53473,53986,53991,53997,54010,54167,54173,54178,54292,54298,54303,55729,55734],{"type":21,"tag":22,"props":50931,"children":50932},{},[50933],{"type":26,"value":50925},{"type":21,"tag":22,"props":50935,"children":50936},{},[50937],{"type":26,"value":50938},"Even when they do ask for it specifically, though, the client generally wants to set 'their map' apart from the generic experience - and this isn't as easy a task as it might be. There are a lot of areas of customization for google maps that might make for a good article, but today we'll focus on custom info windows - those displays that pop up when you click on a marker.",{"type":21,"tag":22,"props":50940,"children":50941},{},[50942,50944,50949],{"type":26,"value":50943},"And there's one added wrinkle that might catch your interest - we need to extend a google maps api object ",{"type":21,"tag":1084,"props":50945,"children":50946},{},[50947],{"type":26,"value":50948},"asynchronously",{"type":26,"value":378},{"type":21,"tag":51,"props":50951,"children":50953},{"id":50952},"loading-and-extending-google-maps-asynchronously",[50954],{"type":26,"value":50955},"Loading and Extending Google Maps Asynchronously",{"type":21,"tag":22,"props":50957,"children":50958},{},[50959,50961,50968],{"type":26,"value":50960},"You're probably familiar with loading ",{"type":21,"tag":29,"props":50962,"children":50965},{"href":50963,"rel":50964},"https://developers.google.com/maps/documentation/javascript/examples/map-simple-async",[93],[50966],{"type":26,"value":50967},"google maps async",{"type":26,"value":50969}," - you create a new script element, add the script url, and provide the api version, your api key, sensor paramater and callback as query string parameters.",{"type":21,"tag":200,"props":50971,"children":50973},{"className":9044,"code":50972,"language":9046,"meta":8,"style":8},"var script = document.createElement('script');\nscript.type = 'text/javascript';\nscript.src = 'https://maps.googleapis.com/maps/api/jsv=3&key=yourapikey&sensor=false&callback=init';\n",[50974],{"type":21,"tag":63,"props":50975,"children":50976},{"__ignoreMap":8},[50977,51014,51035],{"type":21,"tag":209,"props":50978,"children":50979},{"class":211,"line":212},[50980,50984,50989,50993,50997,51001,51005,51010],{"type":21,"tag":209,"props":50981,"children":50982},{"style":216},[50983],{"type":26,"value":8996},{"type":21,"tag":209,"props":50985,"children":50986},{"style":222},[50987],{"type":26,"value":50988}," script ",{"type":21,"tag":209,"props":50990,"children":50991},{"style":216},[50992],{"type":26,"value":1432},{"type":21,"tag":209,"props":50994,"children":50995},{"style":222},[50996],{"type":26,"value":9271},{"type":21,"tag":209,"props":50998,"children":50999},{"style":360},[51000],{"type":26,"value":9276},{"type":21,"tag":209,"props":51002,"children":51003},{"style":222},[51004],{"type":26,"value":368},{"type":21,"tag":209,"props":51006,"children":51007},{"style":233},[51008],{"type":26,"value":51009},"'script'",{"type":21,"tag":209,"props":51011,"children":51012},{"style":222},[51013],{"type":26,"value":2608},{"type":21,"tag":209,"props":51015,"children":51016},{"class":211,"line":244},[51017,51022,51026,51031],{"type":21,"tag":209,"props":51018,"children":51019},{"style":222},[51020],{"type":26,"value":51021},"script.type ",{"type":21,"tag":209,"props":51023,"children":51024},{"style":216},[51025],{"type":26,"value":1432},{"type":21,"tag":209,"props":51027,"children":51028},{"style":233},[51029],{"type":26,"value":51030}," 'text/javascript'",{"type":21,"tag":209,"props":51032,"children":51033},{"style":222},[51034],{"type":26,"value":241},{"type":21,"tag":209,"props":51036,"children":51037},{"class":211,"line":254},[51038,51043,51047,51052],{"type":21,"tag":209,"props":51039,"children":51040},{"style":222},[51041],{"type":26,"value":51042},"script.src ",{"type":21,"tag":209,"props":51044,"children":51045},{"style":216},[51046],{"type":26,"value":1432},{"type":21,"tag":209,"props":51048,"children":51049},{"style":233},[51050],{"type":26,"value":51051}," 'https://maps.googleapis.com/maps/api/jsv=3&key=yourapikey&sensor=false&callback=init'",{"type":21,"tag":209,"props":51053,"children":51054},{"style":222},[51055],{"type":26,"value":241},{"type":21,"tag":22,"props":51057,"children":51058},{},[51059],{"type":26,"value":51060},"The callback is, of course, the key to knowing when the maps api is loaded and ready to run - and so, its also the key to knowing when the api objects are available to be extended.",{"type":21,"tag":22,"props":51062,"children":51063},{},[51064,51066,51072],{"type":26,"value":51065},"In order to create our custom info window, we need to extend ",{"type":21,"tag":63,"props":51067,"children":51069},{"className":51068},[],[51070],{"type":26,"value":51071},"google.maps.OverlayView",{"type":26,"value":51073},". Let's create a simple wrapper class for maps, with an init function to be called when google maps is ready.",{"type":21,"tag":200,"props":51075,"children":51077},{"className":9044,"code":51076,"language":9046,"meta":8,"style":8},"function GMaps(){\n    // Set properties\n    this.mapReady = false;\n}\n\n/**\n* Note you'll need to have an object of type GMaps sitting in the global context ready to receive the init callback\n* which you would append to the script as object.init\n*/\nGMaps.prototype.init = function(){\n    this.mapReady = true;\n}\n\n// OR\n\n/*\n* This function is 'static', and could be passed to the callback param as GMaps.init\n*/\nGMaps.init = function(){\n    // No access to 'this' here - just perform whatever startup tasks you think are necessary\n}\n",[51078],{"type":21,"tag":63,"props":51079,"children":51080},{"__ignoreMap":8},[51081,51097,51105,51130,51137,51144,51151,51159,51167,51175,51212,51235,51242,51249,51257,51264,51272,51280,51287,51311,51319],{"type":21,"tag":209,"props":51082,"children":51083},{"class":211,"line":212},[51084,51088,51093],{"type":21,"tag":209,"props":51085,"children":51086},{"style":216},[51087],{"type":26,"value":5370},{"type":21,"tag":209,"props":51089,"children":51090},{"style":360},[51091],{"type":26,"value":51092}," GMaps",{"type":21,"tag":209,"props":51094,"children":51095},{"style":222},[51096],{"type":26,"value":2561},{"type":21,"tag":209,"props":51098,"children":51099},{"class":211,"line":244},[51100],{"type":21,"tag":209,"props":51101,"children":51102},{"style":448},[51103],{"type":26,"value":51104},"    // Set properties\n",{"type":21,"tag":209,"props":51106,"children":51107},{"class":211,"line":254},[51108,51113,51118,51122,51126],{"type":21,"tag":209,"props":51109,"children":51110},{"style":263},[51111],{"type":26,"value":51112},"    this",{"type":21,"tag":209,"props":51114,"children":51115},{"style":222},[51116],{"type":26,"value":51117},".mapReady ",{"type":21,"tag":209,"props":51119,"children":51120},{"style":216},[51121],{"type":26,"value":1432},{"type":21,"tag":209,"props":51123,"children":51124},{"style":263},[51125],{"type":26,"value":5455},{"type":21,"tag":209,"props":51127,"children":51128},{"style":222},[51129],{"type":26,"value":241},{"type":21,"tag":209,"props":51131,"children":51132},{"class":211,"line":279},[51133],{"type":21,"tag":209,"props":51134,"children":51135},{"style":222},[51136],{"type":26,"value":7798},{"type":21,"tag":209,"props":51138,"children":51139},{"class":211,"line":288},[51140],{"type":21,"tag":209,"props":51141,"children":51142},{"emptyLinePlaceholder":248},[51143],{"type":26,"value":251},{"type":21,"tag":209,"props":51145,"children":51146},{"class":211,"line":307},[51147],{"type":21,"tag":209,"props":51148,"children":51149},{"style":448},[51150],{"type":26,"value":731},{"type":21,"tag":209,"props":51152,"children":51153},{"class":211,"line":325},[51154],{"type":21,"tag":209,"props":51155,"children":51156},{"style":448},[51157],{"type":26,"value":51158},"* Note you'll need to have an object of type GMaps sitting in the global context ready to receive the init callback\n",{"type":21,"tag":209,"props":51160,"children":51161},{"class":211,"line":334},[51162],{"type":21,"tag":209,"props":51163,"children":51164},{"style":448},[51165],{"type":26,"value":51166},"* which you would append to the script as object.init\n",{"type":21,"tag":209,"props":51168,"children":51169},{"class":211,"line":343},[51170],{"type":21,"tag":209,"props":51171,"children":51172},{"style":448},[51173],{"type":26,"value":51174},"*/\n",{"type":21,"tag":209,"props":51176,"children":51177},{"class":211,"line":351},[51178,51183,51187,51191,51195,51200,51204,51208],{"type":21,"tag":209,"props":51179,"children":51180},{"style":263},[51181],{"type":26,"value":51182},"GMaps",{"type":21,"tag":209,"props":51184,"children":51185},{"style":222},[51186],{"type":26,"value":378},{"type":21,"tag":209,"props":51188,"children":51189},{"style":263},[51190],{"type":26,"value":37016},{"type":21,"tag":209,"props":51192,"children":51193},{"style":222},[51194],{"type":26,"value":378},{"type":21,"tag":209,"props":51196,"children":51197},{"style":360},[51198],{"type":26,"value":51199},"init",{"type":21,"tag":209,"props":51201,"children":51202},{"style":216},[51203],{"type":26,"value":271},{"type":21,"tag":209,"props":51205,"children":51206},{"style":216},[51207],{"type":26,"value":4766},{"type":21,"tag":209,"props":51209,"children":51210},{"style":222},[51211],{"type":26,"value":2561},{"type":21,"tag":209,"props":51213,"children":51214},{"class":211,"line":444},[51215,51219,51223,51227,51231],{"type":21,"tag":209,"props":51216,"children":51217},{"style":263},[51218],{"type":26,"value":51112},{"type":21,"tag":209,"props":51220,"children":51221},{"style":222},[51222],{"type":26,"value":51117},{"type":21,"tag":209,"props":51224,"children":51225},{"style":216},[51226],{"type":26,"value":1432},{"type":21,"tag":209,"props":51228,"children":51229},{"style":263},[51230],{"type":26,"value":6243},{"type":21,"tag":209,"props":51232,"children":51233},{"style":222},[51234],{"type":26,"value":241},{"type":21,"tag":209,"props":51236,"children":51237},{"class":211,"line":454},[51238],{"type":21,"tag":209,"props":51239,"children":51240},{"style":222},[51241],{"type":26,"value":7798},{"type":21,"tag":209,"props":51243,"children":51244},{"class":211,"line":463},[51245],{"type":21,"tag":209,"props":51246,"children":51247},{"emptyLinePlaceholder":248},[51248],{"type":26,"value":251},{"type":21,"tag":209,"props":51250,"children":51251},{"class":211,"line":472},[51252],{"type":21,"tag":209,"props":51253,"children":51254},{"style":448},[51255],{"type":26,"value":51256},"// OR\n",{"type":21,"tag":209,"props":51258,"children":51259},{"class":211,"line":480},[51260],{"type":21,"tag":209,"props":51261,"children":51262},{"emptyLinePlaceholder":248},[51263],{"type":26,"value":251},{"type":21,"tag":209,"props":51265,"children":51266},{"class":211,"line":489},[51267],{"type":21,"tag":209,"props":51268,"children":51269},{"style":448},[51270],{"type":26,"value":51271},"/*\n",{"type":21,"tag":209,"props":51273,"children":51274},{"class":211,"line":847},[51275],{"type":21,"tag":209,"props":51276,"children":51277},{"style":448},[51278],{"type":26,"value":51279},"* This function is 'static', and could be passed to the callback param as GMaps.init\n",{"type":21,"tag":209,"props":51281,"children":51282},{"class":211,"line":860},[51283],{"type":21,"tag":209,"props":51284,"children":51285},{"style":448},[51286],{"type":26,"value":51174},{"type":21,"tag":209,"props":51288,"children":51289},{"class":211,"line":877},[51290,51295,51299,51303,51307],{"type":21,"tag":209,"props":51291,"children":51292},{"style":222},[51293],{"type":26,"value":51294},"GMaps.",{"type":21,"tag":209,"props":51296,"children":51297},{"style":360},[51298],{"type":26,"value":51199},{"type":21,"tag":209,"props":51300,"children":51301},{"style":216},[51302],{"type":26,"value":271},{"type":21,"tag":209,"props":51304,"children":51305},{"style":216},[51306],{"type":26,"value":4766},{"type":21,"tag":209,"props":51308,"children":51309},{"style":222},[51310],{"type":26,"value":2561},{"type":21,"tag":209,"props":51312,"children":51313},{"class":211,"line":889},[51314],{"type":21,"tag":209,"props":51315,"children":51316},{"style":448},[51317],{"type":26,"value":51318},"    // No access to 'this' here - just perform whatever startup tasks you think are necessary\n",{"type":21,"tag":209,"props":51320,"children":51321},{"class":211,"line":902},[51322],{"type":21,"tag":209,"props":51323,"children":51324},{"style":222},[51325],{"type":26,"value":7798},{"type":21,"tag":22,"props":51327,"children":51328},{},[51329],{"type":26,"value":51330},"Whether we're using the 'static' function or not, the init callback will let us know we can now extend and instantiate an OverlayView.",{"type":21,"tag":51,"props":51332,"children":51334},{"id":51333},"customwindow",[51335],{"type":26,"value":46837},{"type":21,"tag":22,"props":51337,"children":51338},{},[51339],{"type":26,"value":51340},"We don't want to have to stick our custom window object inside of the init callback though - that would be ugly. So instead:",{"type":21,"tag":200,"props":51342,"children":51344},{"className":9044,"code":51343,"language":9046,"meta":8,"style":8},"/**\n     * Create a custom overlay for our window marker display, extending google.maps.OverlayView.\n     * This is somewhat complicated by needing to async load the google.maps api first - thus, we\n     * wrap CustomWindow into a closure, and when instantiating CustomWindow, we first execute the closure (to create\n     * our CustomWindow function, now properly extending the newly loaded google.maps.OverlayView), and then\n     * instantiate said function.\n     * Note that this version uses jQuery.\n     * @type {Function}\n     */\n(function(){\n    var CustomWindow = function(){\n        this.container = $('\u003Cdiv class=\"map-info-window\">\u003C/div>');\n        this.layer = null;\n        this.marker = null;\n        this.position = null;\n    };\n    /**\n     * Inherit from OverlayView\n     * @type {google.maps.OverlayView}\n     */\n    CustomWindow.prototype = new google.maps.OverlayView();\n    /**\n     * Called when this overlay is set to a map via this.setMap. Get the appropriate map pane\n     * to add the window to, append the container, bind to close element.\n     * @see CustomWindow.open\n     */\n    CustomWindow.prototype.onAdd = function(){\n        this.layer = $(this.getPanes().floatPane);\n        this.layer.append(this.container);\n        this.container.find('.map-info-close').on('click', _.bind(function(){\n            // Close info window on click\n            this.close();\n        }, this));\n    };\n    /**\n     * Called after onAdd, and every time the map is moved, zoomed, or anything else that\n     * would effect positions, to redraw this overlay.\n     */\n    CustomWindow.prototype.draw = function(){\n        var markerIcon = this.marker.getIcon(),\n            cHeight = this.container.outerHeight() + markerIcon.scaledSize.height + 10,\n            cWidth = this.container.width() / 2 + markerIcon.scaledSize.width / 2;\n        this.position = this.getProjection().fromLatLngToDivPixel(this.marker.getPosition());\n        this.container.css({\n            'top':this.position.y - cHeight,\n            'left':this.position.x - cWidth\n        });\n    };\n    /**\n     * Called when this overlay has its map set to null.\n     * @see CustomWindow.close\n     */\n    CustomWindow.prototype.onRemove = function(){\n        this.container.remove();\n    };\n    /**\n     * Sets the contents of this overlay.\n     * @param {string} html\n     */\n    CustomWindow.prototype.setContent = function(html){\n        this.container.html(html);\n    };\n    /**\n     * Sets the map and relevant marker for this overlay.\n     * @param {google.maps.Map} map\n     * @param {google.maps.Marker} marker\n     */\n    CustomWindow.prototype.open = function(map, marker){\n        this.marker = marker;\n        this.setMap(map);\n    };\n    /**\n     * Close this overlay by setting its map to null.\n     */\n    CustomWindow.prototype.close = function(){\n        this.setMap(null);\n    };\n    return CustomWindow;\n});\n",[51345],{"type":21,"tag":63,"props":51346,"children":51347},{"__ignoreMap":8},[51348,51355,51363,51371,51379,51387,51395,51403,51420,51427,51442,51466,51500,51524,51548,51572,51579,51586,51594,51610,51617,51654,51661,51669,51677,51694,51701,51737,51778,51808,51870,51878,51898,51913,51920,51927,51935,51943,51950,51986,52019,52070,52128,52186,52205,52235,52265,52272,52279,52286,52294,52310,52317,52353,52373,52380,52387,52395,52415,52422,52466,52486,52493,52500,52508,52529,52550,52557,52609,52629,52650,52657,52664,52672,52679,52714,52741,52748,52760],{"type":21,"tag":209,"props":51349,"children":51350},{"class":211,"line":212},[51351],{"type":21,"tag":209,"props":51352,"children":51353},{"style":448},[51354],{"type":26,"value":731},{"type":21,"tag":209,"props":51356,"children":51357},{"class":211,"line":244},[51358],{"type":21,"tag":209,"props":51359,"children":51360},{"style":448},[51361],{"type":26,"value":51362},"     * Create a custom overlay for our window marker display, extending google.maps.OverlayView.\n",{"type":21,"tag":209,"props":51364,"children":51365},{"class":211,"line":254},[51366],{"type":21,"tag":209,"props":51367,"children":51368},{"style":448},[51369],{"type":26,"value":51370},"     * This is somewhat complicated by needing to async load the google.maps api first - thus, we\n",{"type":21,"tag":209,"props":51372,"children":51373},{"class":211,"line":279},[51374],{"type":21,"tag":209,"props":51375,"children":51376},{"style":448},[51377],{"type":26,"value":51378},"     * wrap CustomWindow into a closure, and when instantiating CustomWindow, we first execute the closure (to create\n",{"type":21,"tag":209,"props":51380,"children":51381},{"class":211,"line":288},[51382],{"type":21,"tag":209,"props":51383,"children":51384},{"style":448},[51385],{"type":26,"value":51386},"     * our CustomWindow function, now properly extending the newly loaded google.maps.OverlayView), and then\n",{"type":21,"tag":209,"props":51388,"children":51389},{"class":211,"line":307},[51390],{"type":21,"tag":209,"props":51391,"children":51392},{"style":448},[51393],{"type":26,"value":51394},"     * instantiate said function.\n",{"type":21,"tag":209,"props":51396,"children":51397},{"class":211,"line":325},[51398],{"type":21,"tag":209,"props":51399,"children":51400},{"style":448},[51401],{"type":26,"value":51402},"     * Note that this version uses jQuery.\n",{"type":21,"tag":209,"props":51404,"children":51405},{"class":211,"line":334},[51406,51410,51415],{"type":21,"tag":209,"props":51407,"children":51408},{"style":448},[51409],{"type":26,"value":4713},{"type":21,"tag":209,"props":51411,"children":51412},{"style":216},[51413],{"type":26,"value":51414},"@type",{"type":21,"tag":209,"props":51416,"children":51417},{"style":360},[51418],{"type":26,"value":51419}," {Function}\n",{"type":21,"tag":209,"props":51421,"children":51422},{"class":211,"line":343},[51423],{"type":21,"tag":209,"props":51424,"children":51425},{"style":448},[51426],{"type":26,"value":4753},{"type":21,"tag":209,"props":51428,"children":51429},{"class":211,"line":351},[51430,51434,51438],{"type":21,"tag":209,"props":51431,"children":51432},{"style":222},[51433],{"type":26,"value":368},{"type":21,"tag":209,"props":51435,"children":51436},{"style":216},[51437],{"type":26,"value":5370},{"type":21,"tag":209,"props":51439,"children":51440},{"style":222},[51441],{"type":26,"value":2561},{"type":21,"tag":209,"props":51443,"children":51444},{"class":211,"line":444},[51445,51449,51454,51458,51462],{"type":21,"tag":209,"props":51446,"children":51447},{"style":216},[51448],{"type":26,"value":10405},{"type":21,"tag":209,"props":51450,"children":51451},{"style":360},[51452],{"type":26,"value":51453}," CustomWindow",{"type":21,"tag":209,"props":51455,"children":51456},{"style":216},[51457],{"type":26,"value":271},{"type":21,"tag":209,"props":51459,"children":51460},{"style":216},[51461],{"type":26,"value":4766},{"type":21,"tag":209,"props":51463,"children":51464},{"style":222},[51465],{"type":26,"value":2561},{"type":21,"tag":209,"props":51467,"children":51468},{"class":211,"line":454},[51469,51474,51479,51483,51487,51491,51496],{"type":21,"tag":209,"props":51470,"children":51471},{"style":263},[51472],{"type":26,"value":51473},"        this",{"type":21,"tag":209,"props":51475,"children":51476},{"style":222},[51477],{"type":26,"value":51478},".container ",{"type":21,"tag":209,"props":51480,"children":51481},{"style":216},[51482],{"type":26,"value":1432},{"type":21,"tag":209,"props":51484,"children":51485},{"style":360},[51486],{"type":26,"value":49968},{"type":21,"tag":209,"props":51488,"children":51489},{"style":222},[51490],{"type":26,"value":368},{"type":21,"tag":209,"props":51492,"children":51493},{"style":233},[51494],{"type":26,"value":51495},"'\u003Cdiv class=\"map-info-window\">\u003C/div>'",{"type":21,"tag":209,"props":51497,"children":51498},{"style":222},[51499],{"type":26,"value":2608},{"type":21,"tag":209,"props":51501,"children":51502},{"class":211,"line":463},[51503,51507,51512,51516,51520],{"type":21,"tag":209,"props":51504,"children":51505},{"style":263},[51506],{"type":26,"value":51473},{"type":21,"tag":209,"props":51508,"children":51509},{"style":222},[51510],{"type":26,"value":51511},".layer ",{"type":21,"tag":209,"props":51513,"children":51514},{"style":216},[51515],{"type":26,"value":1432},{"type":21,"tag":209,"props":51517,"children":51518},{"style":263},[51519],{"type":26,"value":41733},{"type":21,"tag":209,"props":51521,"children":51522},{"style":222},[51523],{"type":26,"value":241},{"type":21,"tag":209,"props":51525,"children":51526},{"class":211,"line":472},[51527,51531,51536,51540,51544],{"type":21,"tag":209,"props":51528,"children":51529},{"style":263},[51530],{"type":26,"value":51473},{"type":21,"tag":209,"props":51532,"children":51533},{"style":222},[51534],{"type":26,"value":51535},".marker ",{"type":21,"tag":209,"props":51537,"children":51538},{"style":216},[51539],{"type":26,"value":1432},{"type":21,"tag":209,"props":51541,"children":51542},{"style":263},[51543],{"type":26,"value":41733},{"type":21,"tag":209,"props":51545,"children":51546},{"style":222},[51547],{"type":26,"value":241},{"type":21,"tag":209,"props":51549,"children":51550},{"class":211,"line":480},[51551,51555,51560,51564,51568],{"type":21,"tag":209,"props":51552,"children":51553},{"style":263},[51554],{"type":26,"value":51473},{"type":21,"tag":209,"props":51556,"children":51557},{"style":222},[51558],{"type":26,"value":51559},".position ",{"type":21,"tag":209,"props":51561,"children":51562},{"style":216},[51563],{"type":26,"value":1432},{"type":21,"tag":209,"props":51565,"children":51566},{"style":263},[51567],{"type":26,"value":41733},{"type":21,"tag":209,"props":51569,"children":51570},{"style":222},[51571],{"type":26,"value":241},{"type":21,"tag":209,"props":51573,"children":51574},{"class":211,"line":489},[51575],{"type":21,"tag":209,"props":51576,"children":51577},{"style":222},[51578],{"type":26,"value":4850},{"type":21,"tag":209,"props":51580,"children":51581},{"class":211,"line":847},[51582],{"type":21,"tag":209,"props":51583,"children":51584},{"style":448},[51585],{"type":26,"value":4697},{"type":21,"tag":209,"props":51587,"children":51588},{"class":211,"line":860},[51589],{"type":21,"tag":209,"props":51590,"children":51591},{"style":448},[51592],{"type":26,"value":51593},"     * Inherit from OverlayView\n",{"type":21,"tag":209,"props":51595,"children":51596},{"class":211,"line":877},[51597,51601,51605],{"type":21,"tag":209,"props":51598,"children":51599},{"style":448},[51600],{"type":26,"value":4713},{"type":21,"tag":209,"props":51602,"children":51603},{"style":216},[51604],{"type":26,"value":51414},{"type":21,"tag":209,"props":51606,"children":51607},{"style":360},[51608],{"type":26,"value":51609}," {google.maps.OverlayView}\n",{"type":21,"tag":209,"props":51611,"children":51612},{"class":211,"line":889},[51613],{"type":21,"tag":209,"props":51614,"children":51615},{"style":448},[51616],{"type":26,"value":4753},{"type":21,"tag":209,"props":51618,"children":51619},{"class":211,"line":902},[51620,51625,51629,51633,51637,51641,51645,51650],{"type":21,"tag":209,"props":51621,"children":51622},{"style":263},[51623],{"type":26,"value":51624},"    CustomWindow",{"type":21,"tag":209,"props":51626,"children":51627},{"style":222},[51628],{"type":26,"value":378},{"type":21,"tag":209,"props":51630,"children":51631},{"style":263},[51632],{"type":26,"value":37016},{"type":21,"tag":209,"props":51634,"children":51635},{"style":216},[51636],{"type":26,"value":271},{"type":21,"tag":209,"props":51638,"children":51639},{"style":216},[51640],{"type":26,"value":4667},{"type":21,"tag":209,"props":51642,"children":51643},{"style":222},[51644],{"type":26,"value":47991},{"type":21,"tag":209,"props":51646,"children":51647},{"style":360},[51648],{"type":26,"value":51649},"OverlayView",{"type":21,"tag":209,"props":51651,"children":51652},{"style":222},[51653],{"type":26,"value":4842},{"type":21,"tag":209,"props":51655,"children":51656},{"class":211,"line":914},[51657],{"type":21,"tag":209,"props":51658,"children":51659},{"style":448},[51660],{"type":26,"value":4697},{"type":21,"tag":209,"props":51662,"children":51663},{"class":211,"line":922},[51664],{"type":21,"tag":209,"props":51665,"children":51666},{"style":448},[51667],{"type":26,"value":51668},"     * Called when this overlay is set to a map via this.setMap. Get the appropriate map pane\n",{"type":21,"tag":209,"props":51670,"children":51671},{"class":211,"line":2312},[51672],{"type":21,"tag":209,"props":51673,"children":51674},{"style":448},[51675],{"type":26,"value":51676},"     * to add the window to, append the container, bind to close element.\n",{"type":21,"tag":209,"props":51678,"children":51679},{"class":211,"line":2321},[51680,51684,51689],{"type":21,"tag":209,"props":51681,"children":51682},{"style":448},[51683],{"type":26,"value":4713},{"type":21,"tag":209,"props":51685,"children":51686},{"style":216},[51687],{"type":26,"value":51688},"@see",{"type":21,"tag":209,"props":51690,"children":51691},{"style":360},[51692],{"type":26,"value":51693}," CustomWindow.open\n",{"type":21,"tag":209,"props":51695,"children":51696},{"class":211,"line":2372},[51697],{"type":21,"tag":209,"props":51698,"children":51699},{"style":448},[51700],{"type":26,"value":4753},{"type":21,"tag":209,"props":51702,"children":51703},{"class":211,"line":2381},[51704,51708,51712,51716,51720,51725,51729,51733],{"type":21,"tag":209,"props":51705,"children":51706},{"style":263},[51707],{"type":26,"value":51624},{"type":21,"tag":209,"props":51709,"children":51710},{"style":222},[51711],{"type":26,"value":378},{"type":21,"tag":209,"props":51713,"children":51714},{"style":263},[51715],{"type":26,"value":37016},{"type":21,"tag":209,"props":51717,"children":51718},{"style":222},[51719],{"type":26,"value":378},{"type":21,"tag":209,"props":51721,"children":51722},{"style":360},[51723],{"type":26,"value":51724},"onAdd",{"type":21,"tag":209,"props":51726,"children":51727},{"style":216},[51728],{"type":26,"value":271},{"type":21,"tag":209,"props":51730,"children":51731},{"style":216},[51732],{"type":26,"value":4766},{"type":21,"tag":209,"props":51734,"children":51735},{"style":222},[51736],{"type":26,"value":2561},{"type":21,"tag":209,"props":51738,"children":51739},{"class":211,"line":2389},[51740,51744,51748,51752,51756,51760,51764,51768,51773],{"type":21,"tag":209,"props":51741,"children":51742},{"style":263},[51743],{"type":26,"value":51473},{"type":21,"tag":209,"props":51745,"children":51746},{"style":222},[51747],{"type":26,"value":51511},{"type":21,"tag":209,"props":51749,"children":51750},{"style":216},[51751],{"type":26,"value":1432},{"type":21,"tag":209,"props":51753,"children":51754},{"style":360},[51755],{"type":26,"value":49968},{"type":21,"tag":209,"props":51757,"children":51758},{"style":222},[51759],{"type":26,"value":368},{"type":21,"tag":209,"props":51761,"children":51762},{"style":263},[51763],{"type":26,"value":2508},{"type":21,"tag":209,"props":51765,"children":51766},{"style":222},[51767],{"type":26,"value":378},{"type":21,"tag":209,"props":51769,"children":51770},{"style":360},[51771],{"type":26,"value":51772},"getPanes",{"type":21,"tag":209,"props":51774,"children":51775},{"style":222},[51776],{"type":26,"value":51777},"().floatPane);\n",{"type":21,"tag":209,"props":51779,"children":51780},{"class":211,"line":2397},[51781,51785,51790,51795,51799,51803],{"type":21,"tag":209,"props":51782,"children":51783},{"style":263},[51784],{"type":26,"value":51473},{"type":21,"tag":209,"props":51786,"children":51787},{"style":222},[51788],{"type":26,"value":51789},".layer.",{"type":21,"tag":209,"props":51791,"children":51792},{"style":360},[51793],{"type":26,"value":51794},"append",{"type":21,"tag":209,"props":51796,"children":51797},{"style":222},[51798],{"type":26,"value":368},{"type":21,"tag":209,"props":51800,"children":51801},{"style":263},[51802],{"type":26,"value":2508},{"type":21,"tag":209,"props":51804,"children":51805},{"style":222},[51806],{"type":26,"value":51807},".container);\n",{"type":21,"tag":209,"props":51809,"children":51810},{"class":211,"line":2406},[51811,51815,51820,51824,51828,51833,51837,51841,51845,51849,51854,51858,51862,51866],{"type":21,"tag":209,"props":51812,"children":51813},{"style":263},[51814],{"type":26,"value":51473},{"type":21,"tag":209,"props":51816,"children":51817},{"style":222},[51818],{"type":26,"value":51819},".container.",{"type":21,"tag":209,"props":51821,"children":51822},{"style":360},[51823],{"type":26,"value":50121},{"type":21,"tag":209,"props":51825,"children":51826},{"style":222},[51827],{"type":26,"value":368},{"type":21,"tag":209,"props":51829,"children":51830},{"style":233},[51831],{"type":26,"value":51832},"'.map-info-close'",{"type":21,"tag":209,"props":51834,"children":51835},{"style":222},[51836],{"type":26,"value":2699},{"type":21,"tag":209,"props":51838,"children":51839},{"style":360},[51840],{"type":26,"value":363},{"type":21,"tag":209,"props":51842,"children":51843},{"style":222},[51844],{"type":26,"value":368},{"type":21,"tag":209,"props":51846,"children":51847},{"style":233},[51848],{"type":26,"value":6354},{"type":21,"tag":209,"props":51850,"children":51851},{"style":222},[51852],{"type":26,"value":51853},", _.",{"type":21,"tag":209,"props":51855,"children":51856},{"style":360},[51857],{"type":26,"value":17387},{"type":21,"tag":209,"props":51859,"children":51860},{"style":222},[51861],{"type":26,"value":368},{"type":21,"tag":209,"props":51863,"children":51864},{"style":216},[51865],{"type":26,"value":5370},{"type":21,"tag":209,"props":51867,"children":51868},{"style":222},[51869],{"type":26,"value":2561},{"type":21,"tag":209,"props":51871,"children":51872},{"class":211,"line":2415},[51873],{"type":21,"tag":209,"props":51874,"children":51875},{"style":448},[51876],{"type":26,"value":51877},"            // Close info window on click\n",{"type":21,"tag":209,"props":51879,"children":51880},{"class":211,"line":2424},[51881,51885,51889,51894],{"type":21,"tag":209,"props":51882,"children":51883},{"style":263},[51884],{"type":26,"value":2570},{"type":21,"tag":209,"props":51886,"children":51887},{"style":222},[51888],{"type":26,"value":378},{"type":21,"tag":209,"props":51890,"children":51891},{"style":360},[51892],{"type":26,"value":51893},"close",{"type":21,"tag":209,"props":51895,"children":51896},{"style":222},[51897],{"type":26,"value":4842},{"type":21,"tag":209,"props":51899,"children":51900},{"class":211,"line":2433},[51901,51905,51909],{"type":21,"tag":209,"props":51902,"children":51903},{"style":222},[51904],{"type":26,"value":10672},{"type":21,"tag":209,"props":51906,"children":51907},{"style":263},[51908],{"type":26,"value":2508},{"type":21,"tag":209,"props":51910,"children":51911},{"style":222},[51912],{"type":26,"value":46554},{"type":21,"tag":209,"props":51914,"children":51915},{"class":211,"line":2442},[51916],{"type":21,"tag":209,"props":51917,"children":51918},{"style":222},[51919],{"type":26,"value":4850},{"type":21,"tag":209,"props":51921,"children":51922},{"class":211,"line":2471},[51923],{"type":21,"tag":209,"props":51924,"children":51925},{"style":448},[51926],{"type":26,"value":4697},{"type":21,"tag":209,"props":51928,"children":51929},{"class":211,"line":2480},[51930],{"type":21,"tag":209,"props":51931,"children":51932},{"style":448},[51933],{"type":26,"value":51934},"     * Called after onAdd, and every time the map is moved, zoomed, or anything else that\n",{"type":21,"tag":209,"props":51936,"children":51937},{"class":211,"line":2489},[51938],{"type":21,"tag":209,"props":51939,"children":51940},{"style":448},[51941],{"type":26,"value":51942},"     * would effect positions, to redraw this overlay.\n",{"type":21,"tag":209,"props":51944,"children":51945},{"class":211,"line":2516},[51946],{"type":21,"tag":209,"props":51947,"children":51948},{"style":448},[51949],{"type":26,"value":4753},{"type":21,"tag":209,"props":51951,"children":51952},{"class":211,"line":2525},[51953,51957,51961,51965,51969,51974,51978,51982],{"type":21,"tag":209,"props":51954,"children":51955},{"style":263},[51956],{"type":26,"value":51624},{"type":21,"tag":209,"props":51958,"children":51959},{"style":222},[51960],{"type":26,"value":378},{"type":21,"tag":209,"props":51962,"children":51963},{"style":263},[51964],{"type":26,"value":37016},{"type":21,"tag":209,"props":51966,"children":51967},{"style":222},[51968],{"type":26,"value":378},{"type":21,"tag":209,"props":51970,"children":51971},{"style":360},[51972],{"type":26,"value":51973},"draw",{"type":21,"tag":209,"props":51975,"children":51976},{"style":216},[51977],{"type":26,"value":271},{"type":21,"tag":209,"props":51979,"children":51980},{"style":216},[51981],{"type":26,"value":4766},{"type":21,"tag":209,"props":51983,"children":51984},{"style":222},[51985],{"type":26,"value":2561},{"type":21,"tag":209,"props":51987,"children":51988},{"class":211,"line":2533},[51989,51993,51998,52002,52006,52010,52015],{"type":21,"tag":209,"props":51990,"children":51991},{"style":216},[51992],{"type":26,"value":5925},{"type":21,"tag":209,"props":51994,"children":51995},{"style":222},[51996],{"type":26,"value":51997}," markerIcon ",{"type":21,"tag":209,"props":51999,"children":52000},{"style":216},[52001],{"type":26,"value":1432},{"type":21,"tag":209,"props":52003,"children":52004},{"style":263},[52005],{"type":26,"value":17698},{"type":21,"tag":209,"props":52007,"children":52008},{"style":222},[52009],{"type":26,"value":46912},{"type":21,"tag":209,"props":52011,"children":52012},{"style":360},[52013],{"type":26,"value":52014},"getIcon",{"type":21,"tag":209,"props":52016,"children":52017},{"style":222},[52018],{"type":26,"value":5405},{"type":21,"tag":209,"props":52020,"children":52021},{"class":211,"line":2542},[52022,52027,52031,52035,52039,52044,52048,52052,52057,52061,52066],{"type":21,"tag":209,"props":52023,"children":52024},{"style":222},[52025],{"type":26,"value":52026},"            cHeight ",{"type":21,"tag":209,"props":52028,"children":52029},{"style":216},[52030],{"type":26,"value":1432},{"type":21,"tag":209,"props":52032,"children":52033},{"style":263},[52034],{"type":26,"value":17698},{"type":21,"tag":209,"props":52036,"children":52037},{"style":222},[52038],{"type":26,"value":51819},{"type":21,"tag":209,"props":52040,"children":52041},{"style":360},[52042],{"type":26,"value":52043},"outerHeight",{"type":21,"tag":209,"props":52045,"children":52046},{"style":222},[52047],{"type":26,"value":14393},{"type":21,"tag":209,"props":52049,"children":52050},{"style":216},[52051],{"type":26,"value":10237},{"type":21,"tag":209,"props":52053,"children":52054},{"style":222},[52055],{"type":26,"value":52056}," markerIcon.scaledSize.height ",{"type":21,"tag":209,"props":52058,"children":52059},{"style":216},[52060],{"type":26,"value":10237},{"type":21,"tag":209,"props":52062,"children":52063},{"style":263},[52064],{"type":26,"value":52065}," 10",{"type":21,"tag":209,"props":52067,"children":52068},{"style":222},[52069],{"type":26,"value":304},{"type":21,"tag":209,"props":52071,"children":52072},{"class":211,"line":2550},[52073,52078,52082,52086,52090,52095,52099,52103,52107,52111,52116,52120,52124],{"type":21,"tag":209,"props":52074,"children":52075},{"style":222},[52076],{"type":26,"value":52077},"            cWidth ",{"type":21,"tag":209,"props":52079,"children":52080},{"style":216},[52081],{"type":26,"value":1432},{"type":21,"tag":209,"props":52083,"children":52084},{"style":263},[52085],{"type":26,"value":17698},{"type":21,"tag":209,"props":52087,"children":52088},{"style":222},[52089],{"type":26,"value":51819},{"type":21,"tag":209,"props":52091,"children":52092},{"style":360},[52093],{"type":26,"value":52094},"width",{"type":21,"tag":209,"props":52096,"children":52097},{"style":222},[52098],{"type":26,"value":14393},{"type":21,"tag":209,"props":52100,"children":52101},{"style":216},[52102],{"type":26,"value":9749},{"type":21,"tag":209,"props":52104,"children":52105},{"style":263},[52106],{"type":26,"value":36498},{"type":21,"tag":209,"props":52108,"children":52109},{"style":216},[52110],{"type":26,"value":10659},{"type":21,"tag":209,"props":52112,"children":52113},{"style":222},[52114],{"type":26,"value":52115}," markerIcon.scaledSize.width ",{"type":21,"tag":209,"props":52117,"children":52118},{"style":216},[52119],{"type":26,"value":9749},{"type":21,"tag":209,"props":52121,"children":52122},{"style":263},[52123],{"type":26,"value":36498},{"type":21,"tag":209,"props":52125,"children":52126},{"style":222},[52127],{"type":26,"value":241},{"type":21,"tag":209,"props":52129,"children":52130},{"class":211,"line":2564},[52131,52135,52139,52143,52147,52151,52156,52160,52165,52169,52173,52177,52181],{"type":21,"tag":209,"props":52132,"children":52133},{"style":263},[52134],{"type":26,"value":51473},{"type":21,"tag":209,"props":52136,"children":52137},{"style":222},[52138],{"type":26,"value":51559},{"type":21,"tag":209,"props":52140,"children":52141},{"style":216},[52142],{"type":26,"value":1432},{"type":21,"tag":209,"props":52144,"children":52145},{"style":263},[52146],{"type":26,"value":17698},{"type":21,"tag":209,"props":52148,"children":52149},{"style":222},[52150],{"type":26,"value":378},{"type":21,"tag":209,"props":52152,"children":52153},{"style":360},[52154],{"type":26,"value":52155},"getProjection",{"type":21,"tag":209,"props":52157,"children":52158},{"style":222},[52159],{"type":26,"value":11910},{"type":21,"tag":209,"props":52161,"children":52162},{"style":360},[52163],{"type":26,"value":52164},"fromLatLngToDivPixel",{"type":21,"tag":209,"props":52166,"children":52167},{"style":222},[52168],{"type":26,"value":368},{"type":21,"tag":209,"props":52170,"children":52171},{"style":263},[52172],{"type":26,"value":2508},{"type":21,"tag":209,"props":52174,"children":52175},{"style":222},[52176],{"type":26,"value":46912},{"type":21,"tag":209,"props":52178,"children":52179},{"style":360},[52180],{"type":26,"value":46917},{"type":21,"tag":209,"props":52182,"children":52183},{"style":222},[52184],{"type":26,"value":52185},"());\n",{"type":21,"tag":209,"props":52187,"children":52188},{"class":211,"line":2611},[52189,52193,52197,52201],{"type":21,"tag":209,"props":52190,"children":52191},{"style":263},[52192],{"type":26,"value":51473},{"type":21,"tag":209,"props":52194,"children":52195},{"style":222},[52196],{"type":26,"value":51819},{"type":21,"tag":209,"props":52198,"children":52199},{"style":360},[52200],{"type":26,"value":49407},{"type":21,"tag":209,"props":52202,"children":52203},{"style":222},[52204],{"type":26,"value":17983},{"type":21,"tag":209,"props":52206,"children":52207},{"class":211,"line":2619},[52208,52213,52217,52221,52226,52230],{"type":21,"tag":209,"props":52209,"children":52210},{"style":233},[52211],{"type":26,"value":52212},"            'top'",{"type":21,"tag":209,"props":52214,"children":52215},{"style":222},[52216],{"type":26,"value":191},{"type":21,"tag":209,"props":52218,"children":52219},{"style":263},[52220],{"type":26,"value":2508},{"type":21,"tag":209,"props":52222,"children":52223},{"style":222},[52224],{"type":26,"value":52225},".position.y ",{"type":21,"tag":209,"props":52227,"children":52228},{"style":216},[52229],{"type":26,"value":13012},{"type":21,"tag":209,"props":52231,"children":52232},{"style":222},[52233],{"type":26,"value":52234}," cHeight,\n",{"type":21,"tag":209,"props":52236,"children":52237},{"class":211,"line":2627},[52238,52243,52247,52251,52256,52260],{"type":21,"tag":209,"props":52239,"children":52240},{"style":233},[52241],{"type":26,"value":52242},"            'left'",{"type":21,"tag":209,"props":52244,"children":52245},{"style":222},[52246],{"type":26,"value":191},{"type":21,"tag":209,"props":52248,"children":52249},{"style":263},[52250],{"type":26,"value":2508},{"type":21,"tag":209,"props":52252,"children":52253},{"style":222},[52254],{"type":26,"value":52255},".position.x ",{"type":21,"tag":209,"props":52257,"children":52258},{"style":216},[52259],{"type":26,"value":13012},{"type":21,"tag":209,"props":52261,"children":52262},{"style":222},[52263],{"type":26,"value":52264}," cWidth\n",{"type":21,"tag":209,"props":52266,"children":52267},{"class":211,"line":2636},[52268],{"type":21,"tag":209,"props":52269,"children":52270},{"style":222},[52271],{"type":26,"value":5114},{"type":21,"tag":209,"props":52273,"children":52274},{"class":211,"line":2644},[52275],{"type":21,"tag":209,"props":52276,"children":52277},{"style":222},[52278],{"type":26,"value":4850},{"type":21,"tag":209,"props":52280,"children":52281},{"class":211,"line":2657},[52282],{"type":21,"tag":209,"props":52283,"children":52284},{"style":448},[52285],{"type":26,"value":4697},{"type":21,"tag":209,"props":52287,"children":52288},{"class":211,"line":2728},[52289],{"type":21,"tag":209,"props":52290,"children":52291},{"style":448},[52292],{"type":26,"value":52293},"     * Called when this overlay has its map set to null.\n",{"type":21,"tag":209,"props":52295,"children":52296},{"class":211,"line":2758},[52297,52301,52305],{"type":21,"tag":209,"props":52298,"children":52299},{"style":448},[52300],{"type":26,"value":4713},{"type":21,"tag":209,"props":52302,"children":52303},{"style":216},[52304],{"type":26,"value":51688},{"type":21,"tag":209,"props":52306,"children":52307},{"style":360},[52308],{"type":26,"value":52309}," CustomWindow.close\n",{"type":21,"tag":209,"props":52311,"children":52312},{"class":211,"line":2776},[52313],{"type":21,"tag":209,"props":52314,"children":52315},{"style":448},[52316],{"type":26,"value":4753},{"type":21,"tag":209,"props":52318,"children":52319},{"class":211,"line":2785},[52320,52324,52328,52332,52336,52341,52345,52349],{"type":21,"tag":209,"props":52321,"children":52322},{"style":263},[52323],{"type":26,"value":51624},{"type":21,"tag":209,"props":52325,"children":52326},{"style":222},[52327],{"type":26,"value":378},{"type":21,"tag":209,"props":52329,"children":52330},{"style":263},[52331],{"type":26,"value":37016},{"type":21,"tag":209,"props":52333,"children":52334},{"style":222},[52335],{"type":26,"value":378},{"type":21,"tag":209,"props":52337,"children":52338},{"style":360},[52339],{"type":26,"value":52340},"onRemove",{"type":21,"tag":209,"props":52342,"children":52343},{"style":216},[52344],{"type":26,"value":271},{"type":21,"tag":209,"props":52346,"children":52347},{"style":216},[52348],{"type":26,"value":4766},{"type":21,"tag":209,"props":52350,"children":52351},{"style":222},[52352],{"type":26,"value":2561},{"type":21,"tag":209,"props":52354,"children":52355},{"class":211,"line":2793},[52356,52360,52364,52369],{"type":21,"tag":209,"props":52357,"children":52358},{"style":263},[52359],{"type":26,"value":51473},{"type":21,"tag":209,"props":52361,"children":52362},{"style":222},[52363],{"type":26,"value":51819},{"type":21,"tag":209,"props":52365,"children":52366},{"style":360},[52367],{"type":26,"value":52368},"remove",{"type":21,"tag":209,"props":52370,"children":52371},{"style":222},[52372],{"type":26,"value":4842},{"type":21,"tag":209,"props":52374,"children":52375},{"class":211,"line":2801},[52376],{"type":21,"tag":209,"props":52377,"children":52378},{"style":222},[52379],{"type":26,"value":4850},{"type":21,"tag":209,"props":52381,"children":52382},{"class":211,"line":2809},[52383],{"type":21,"tag":209,"props":52384,"children":52385},{"style":448},[52386],{"type":26,"value":4697},{"type":21,"tag":209,"props":52388,"children":52389},{"class":211,"line":6219},[52390],{"type":21,"tag":209,"props":52391,"children":52392},{"style":448},[52393],{"type":26,"value":52394},"     * Sets the contents of this overlay.\n",{"type":21,"tag":209,"props":52396,"children":52397},{"class":211,"line":6228},[52398,52402,52406,52410],{"type":21,"tag":209,"props":52399,"children":52400},{"style":448},[52401],{"type":26,"value":4713},{"type":21,"tag":209,"props":52403,"children":52404},{"style":216},[52405],{"type":26,"value":4718},{"type":21,"tag":209,"props":52407,"children":52408},{"style":360},[52409],{"type":26,"value":4723},{"type":21,"tag":209,"props":52411,"children":52412},{"style":222},[52413],{"type":26,"value":52414}," html\n",{"type":21,"tag":209,"props":52416,"children":52417},{"class":211,"line":6250},[52418],{"type":21,"tag":209,"props":52419,"children":52420},{"style":448},[52421],{"type":26,"value":4753},{"type":21,"tag":209,"props":52423,"children":52424},{"class":211,"line":6258},[52425,52429,52433,52437,52441,52446,52450,52454,52458,52462],{"type":21,"tag":209,"props":52426,"children":52427},{"style":263},[52428],{"type":26,"value":51624},{"type":21,"tag":209,"props":52430,"children":52431},{"style":222},[52432],{"type":26,"value":378},{"type":21,"tag":209,"props":52434,"children":52435},{"style":263},[52436],{"type":26,"value":37016},{"type":21,"tag":209,"props":52438,"children":52439},{"style":222},[52440],{"type":26,"value":378},{"type":21,"tag":209,"props":52442,"children":52443},{"style":360},[52444],{"type":26,"value":52445},"setContent",{"type":21,"tag":209,"props":52447,"children":52448},{"style":216},[52449],{"type":26,"value":271},{"type":21,"tag":209,"props":52451,"children":52452},{"style":216},[52453],{"type":26,"value":4766},{"type":21,"tag":209,"props":52455,"children":52456},{"style":222},[52457],{"type":26,"value":368},{"type":21,"tag":209,"props":52459,"children":52460},{"style":400},[52461],{"type":26,"value":7949},{"type":21,"tag":209,"props":52463,"children":52464},{"style":222},[52465],{"type":26,"value":2369},{"type":21,"tag":209,"props":52467,"children":52468},{"class":211,"line":6267},[52469,52473,52477,52481],{"type":21,"tag":209,"props":52470,"children":52471},{"style":263},[52472],{"type":26,"value":51473},{"type":21,"tag":209,"props":52474,"children":52475},{"style":222},[52476],{"type":26,"value":51819},{"type":21,"tag":209,"props":52478,"children":52479},{"style":360},[52480],{"type":26,"value":7949},{"type":21,"tag":209,"props":52482,"children":52483},{"style":222},[52484],{"type":26,"value":52485},"(html);\n",{"type":21,"tag":209,"props":52487,"children":52488},{"class":211,"line":6303},[52489],{"type":21,"tag":209,"props":52490,"children":52491},{"style":222},[52492],{"type":26,"value":4850},{"type":21,"tag":209,"props":52494,"children":52495},{"class":211,"line":6336},[52496],{"type":21,"tag":209,"props":52497,"children":52498},{"style":448},[52499],{"type":26,"value":4697},{"type":21,"tag":209,"props":52501,"children":52502},{"class":211,"line":6369},[52503],{"type":21,"tag":209,"props":52504,"children":52505},{"style":448},[52506],{"type":26,"value":52507},"     * Sets the map and relevant marker for this overlay.\n",{"type":21,"tag":209,"props":52509,"children":52510},{"class":211,"line":6378},[52511,52515,52519,52524],{"type":21,"tag":209,"props":52512,"children":52513},{"style":448},[52514],{"type":26,"value":4713},{"type":21,"tag":209,"props":52516,"children":52517},{"style":216},[52518],{"type":26,"value":4718},{"type":21,"tag":209,"props":52520,"children":52521},{"style":360},[52522],{"type":26,"value":52523}," {google.maps.Map}",{"type":21,"tag":209,"props":52525,"children":52526},{"style":222},[52527],{"type":26,"value":52528}," map\n",{"type":21,"tag":209,"props":52530,"children":52531},{"class":211,"line":6387},[52532,52536,52540,52545],{"type":21,"tag":209,"props":52533,"children":52534},{"style":448},[52535],{"type":26,"value":4713},{"type":21,"tag":209,"props":52537,"children":52538},{"style":216},[52539],{"type":26,"value":4718},{"type":21,"tag":209,"props":52541,"children":52542},{"style":360},[52543],{"type":26,"value":52544}," {google.maps.Marker}",{"type":21,"tag":209,"props":52546,"children":52547},{"style":222},[52548],{"type":26,"value":52549}," marker\n",{"type":21,"tag":209,"props":52551,"children":52552},{"class":211,"line":6395},[52553],{"type":21,"tag":209,"props":52554,"children":52555},{"style":448},[52556],{"type":26,"value":4753},{"type":21,"tag":209,"props":52558,"children":52559},{"class":211,"line":6404},[52560,52564,52568,52572,52576,52580,52584,52588,52592,52596,52600,52605],{"type":21,"tag":209,"props":52561,"children":52562},{"style":263},[52563],{"type":26,"value":51624},{"type":21,"tag":209,"props":52565,"children":52566},{"style":222},[52567],{"type":26,"value":378},{"type":21,"tag":209,"props":52569,"children":52570},{"style":263},[52571],{"type":26,"value":37016},{"type":21,"tag":209,"props":52573,"children":52574},{"style":222},[52575],{"type":26,"value":378},{"type":21,"tag":209,"props":52577,"children":52578},{"style":360},[52579],{"type":26,"value":11610},{"type":21,"tag":209,"props":52581,"children":52582},{"style":216},[52583],{"type":26,"value":271},{"type":21,"tag":209,"props":52585,"children":52586},{"style":216},[52587],{"type":26,"value":4766},{"type":21,"tag":209,"props":52589,"children":52590},{"style":222},[52591],{"type":26,"value":368},{"type":21,"tag":209,"props":52593,"children":52594},{"style":400},[52595],{"type":26,"value":11972},{"type":21,"tag":209,"props":52597,"children":52598},{"style":222},[52599],{"type":26,"value":408},{"type":21,"tag":209,"props":52601,"children":52602},{"style":400},[52603],{"type":26,"value":52604},"marker",{"type":21,"tag":209,"props":52606,"children":52607},{"style":222},[52608],{"type":26,"value":2369},{"type":21,"tag":209,"props":52610,"children":52611},{"class":211,"line":6413},[52612,52616,52620,52624],{"type":21,"tag":209,"props":52613,"children":52614},{"style":263},[52615],{"type":26,"value":51473},{"type":21,"tag":209,"props":52617,"children":52618},{"style":222},[52619],{"type":26,"value":51535},{"type":21,"tag":209,"props":52621,"children":52622},{"style":216},[52623],{"type":26,"value":1432},{"type":21,"tag":209,"props":52625,"children":52626},{"style":222},[52627],{"type":26,"value":52628}," marker;\n",{"type":21,"tag":209,"props":52630,"children":52631},{"class":211,"line":6447},[52632,52636,52640,52645],{"type":21,"tag":209,"props":52633,"children":52634},{"style":263},[52635],{"type":26,"value":51473},{"type":21,"tag":209,"props":52637,"children":52638},{"style":222},[52639],{"type":26,"value":378},{"type":21,"tag":209,"props":52641,"children":52642},{"style":360},[52643],{"type":26,"value":52644},"setMap",{"type":21,"tag":209,"props":52646,"children":52647},{"style":222},[52648],{"type":26,"value":52649},"(map);\n",{"type":21,"tag":209,"props":52651,"children":52652},{"class":211,"line":6479},[52653],{"type":21,"tag":209,"props":52654,"children":52655},{"style":222},[52656],{"type":26,"value":4850},{"type":21,"tag":209,"props":52658,"children":52659},{"class":211,"line":6511},[52660],{"type":21,"tag":209,"props":52661,"children":52662},{"style":448},[52663],{"type":26,"value":4697},{"type":21,"tag":209,"props":52665,"children":52666},{"class":211,"line":6519},[52667],{"type":21,"tag":209,"props":52668,"children":52669},{"style":448},[52670],{"type":26,"value":52671},"     * Close this overlay by setting its map to null.\n",{"type":21,"tag":209,"props":52673,"children":52674},{"class":211,"line":6527},[52675],{"type":21,"tag":209,"props":52676,"children":52677},{"style":448},[52678],{"type":26,"value":4753},{"type":21,"tag":209,"props":52680,"children":52681},{"class":211,"line":6535},[52682,52686,52690,52694,52698,52702,52706,52710],{"type":21,"tag":209,"props":52683,"children":52684},{"style":263},[52685],{"type":26,"value":51624},{"type":21,"tag":209,"props":52687,"children":52688},{"style":222},[52689],{"type":26,"value":378},{"type":21,"tag":209,"props":52691,"children":52692},{"style":263},[52693],{"type":26,"value":37016},{"type":21,"tag":209,"props":52695,"children":52696},{"style":222},[52697],{"type":26,"value":378},{"type":21,"tag":209,"props":52699,"children":52700},{"style":360},[52701],{"type":26,"value":51893},{"type":21,"tag":209,"props":52703,"children":52704},{"style":216},[52705],{"type":26,"value":271},{"type":21,"tag":209,"props":52707,"children":52708},{"style":216},[52709],{"type":26,"value":4766},{"type":21,"tag":209,"props":52711,"children":52712},{"style":222},[52713],{"type":26,"value":2561},{"type":21,"tag":209,"props":52715,"children":52716},{"class":211,"line":6543},[52717,52721,52725,52729,52733,52737],{"type":21,"tag":209,"props":52718,"children":52719},{"style":263},[52720],{"type":26,"value":51473},{"type":21,"tag":209,"props":52722,"children":52723},{"style":222},[52724],{"type":26,"value":378},{"type":21,"tag":209,"props":52726,"children":52727},{"style":360},[52728],{"type":26,"value":52644},{"type":21,"tag":209,"props":52730,"children":52731},{"style":222},[52732],{"type":26,"value":368},{"type":21,"tag":209,"props":52734,"children":52735},{"style":263},[52736],{"type":26,"value":17396},{"type":21,"tag":209,"props":52738,"children":52739},{"style":222},[52740],{"type":26,"value":2608},{"type":21,"tag":209,"props":52742,"children":52743},{"class":211,"line":6552},[52744],{"type":21,"tag":209,"props":52745,"children":52746},{"style":222},[52747],{"type":26,"value":4850},{"type":21,"tag":209,"props":52749,"children":52750},{"class":211,"line":6572},[52751,52755],{"type":21,"tag":209,"props":52752,"children":52753},{"style":216},[52754],{"type":26,"value":1298},{"type":21,"tag":209,"props":52756,"children":52757},{"style":222},[52758],{"type":26,"value":52759}," CustomWindow;\n",{"type":21,"tag":209,"props":52761,"children":52762},{"class":211,"line":6589},[52763],{"type":21,"tag":209,"props":52764,"children":52765},{"style":222},[52766],{"type":26,"value":469},{"type":21,"tag":22,"props":52768,"children":52769},{},[52770],{"type":26,"value":52771},"We create a closure that contains our custom window object, and extend OverlayView within. You'll notice this isn't executing - we don't want to call it immediately, but rather wait until init. We'll assume we've assigned this function to a property of GMaps, for example:",{"type":21,"tag":200,"props":52773,"children":52775},{"className":9044,"code":52774,"language":9046,"meta":8,"style":8},"GMaps.CustomWindow = (function(){\n...\n",[52776],{"type":21,"tag":63,"props":52777,"children":52778},{"__ignoreMap":8},[52779,52803],{"type":21,"tag":209,"props":52780,"children":52781},{"class":211,"line":212},[52782,52787,52791,52795,52799],{"type":21,"tag":209,"props":52783,"children":52784},{"style":222},[52785],{"type":26,"value":52786},"GMaps.CustomWindow ",{"type":21,"tag":209,"props":52788,"children":52789},{"style":216},[52790],{"type":26,"value":1432},{"type":21,"tag":209,"props":52792,"children":52793},{"style":222},[52794],{"type":26,"value":4776},{"type":21,"tag":209,"props":52796,"children":52797},{"style":216},[52798],{"type":26,"value":5370},{"type":21,"tag":209,"props":52800,"children":52801},{"style":222},[52802],{"type":26,"value":2561},{"type":21,"tag":209,"props":52804,"children":52805},{"class":211,"line":244},[52806],{"type":21,"tag":209,"props":52807,"children":52808},{"style":216},[52809],{"type":26,"value":52810},"...\n",{"type":21,"tag":22,"props":52812,"children":52813},{},[52814,52816,52821],{"type":26,"value":52815},"There's a few ways we could now create our custom info window, depending on whether we decided to use an instantiated object or a 'static' function as our init callback. We could use a listener (listening for an event triggered on some guaranteed-present element, like 'body') for the static, so that we access to ",{"type":21,"tag":63,"props":52817,"children":52819},{"className":52818},[],[52820],{"type":26,"value":2508},{"type":26,"value":52822}," when we create the info window; or, if we already have our GMaps object, we could simply instantiate it in our init function itself.",{"type":21,"tag":200,"props":52824,"children":52826},{"className":9044,"code":52825,"language":9046,"meta":8,"style":8},"function GMaps(){\n    // Set properties\n    this.mapReady = false;\n    $('body').one('gmaps:ready', function(){\n        this.mapReady = true;\n        this.infoWindow = (GMaps.CustomWindow())();\n    }.bind(this));\n}\n\nGMaps.init = function(){\n    $('body').trigger('gmaps:ready');\n}\n\n// OR\n\nGMaps.prototype.init = function(){\n    this.mapReady = true;\n    this.infoWindow = (GMaps.CustomWindow())();\n}\n",[52827],{"type":21,"tag":63,"props":52828,"children":52829},{"__ignoreMap":8},[52830,52845,52852,52875,52922,52945,52975,52999,53006,53013,53036,53071,53078,53085,53092,53099,53134,53157,53184],{"type":21,"tag":209,"props":52831,"children":52832},{"class":211,"line":212},[52833,52837,52841],{"type":21,"tag":209,"props":52834,"children":52835},{"style":216},[52836],{"type":26,"value":5370},{"type":21,"tag":209,"props":52838,"children":52839},{"style":360},[52840],{"type":26,"value":51092},{"type":21,"tag":209,"props":52842,"children":52843},{"style":222},[52844],{"type":26,"value":2561},{"type":21,"tag":209,"props":52846,"children":52847},{"class":211,"line":244},[52848],{"type":21,"tag":209,"props":52849,"children":52850},{"style":448},[52851],{"type":26,"value":51104},{"type":21,"tag":209,"props":52853,"children":52854},{"class":211,"line":254},[52855,52859,52863,52867,52871],{"type":21,"tag":209,"props":52856,"children":52857},{"style":263},[52858],{"type":26,"value":51112},{"type":21,"tag":209,"props":52860,"children":52861},{"style":222},[52862],{"type":26,"value":51117},{"type":21,"tag":209,"props":52864,"children":52865},{"style":216},[52866],{"type":26,"value":1432},{"type":21,"tag":209,"props":52868,"children":52869},{"style":263},[52870],{"type":26,"value":5455},{"type":21,"tag":209,"props":52872,"children":52873},{"style":222},[52874],{"type":26,"value":241},{"type":21,"tag":209,"props":52876,"children":52877},{"class":211,"line":279},[52878,52883,52887,52892,52896,52901,52905,52910,52914,52918],{"type":21,"tag":209,"props":52879,"children":52880},{"style":360},[52881],{"type":26,"value":52882},"    $",{"type":21,"tag":209,"props":52884,"children":52885},{"style":222},[52886],{"type":26,"value":368},{"type":21,"tag":209,"props":52888,"children":52889},{"style":233},[52890],{"type":26,"value":52891},"'body'",{"type":21,"tag":209,"props":52893,"children":52894},{"style":222},[52895],{"type":26,"value":2699},{"type":21,"tag":209,"props":52897,"children":52898},{"style":360},[52899],{"type":26,"value":52900},"one",{"type":21,"tag":209,"props":52902,"children":52903},{"style":222},[52904],{"type":26,"value":368},{"type":21,"tag":209,"props":52906,"children":52907},{"style":233},[52908],{"type":26,"value":52909},"'gmaps:ready'",{"type":21,"tag":209,"props":52911,"children":52912},{"style":222},[52913],{"type":26,"value":408},{"type":21,"tag":209,"props":52915,"children":52916},{"style":216},[52917],{"type":26,"value":5370},{"type":21,"tag":209,"props":52919,"children":52920},{"style":222},[52921],{"type":26,"value":2561},{"type":21,"tag":209,"props":52923,"children":52924},{"class":211,"line":288},[52925,52929,52933,52937,52941],{"type":21,"tag":209,"props":52926,"children":52927},{"style":263},[52928],{"type":26,"value":51473},{"type":21,"tag":209,"props":52930,"children":52931},{"style":222},[52932],{"type":26,"value":51117},{"type":21,"tag":209,"props":52934,"children":52935},{"style":216},[52936],{"type":26,"value":1432},{"type":21,"tag":209,"props":52938,"children":52939},{"style":263},[52940],{"type":26,"value":6243},{"type":21,"tag":209,"props":52942,"children":52943},{"style":222},[52944],{"type":26,"value":241},{"type":21,"tag":209,"props":52946,"children":52947},{"class":211,"line":307},[52948,52952,52957,52961,52966,52970],{"type":21,"tag":209,"props":52949,"children":52950},{"style":263},[52951],{"type":26,"value":51473},{"type":21,"tag":209,"props":52953,"children":52954},{"style":222},[52955],{"type":26,"value":52956},".infoWindow ",{"type":21,"tag":209,"props":52958,"children":52959},{"style":216},[52960],{"type":26,"value":1432},{"type":21,"tag":209,"props":52962,"children":52963},{"style":222},[52964],{"type":26,"value":52965}," (GMaps.",{"type":21,"tag":209,"props":52967,"children":52968},{"style":360},[52969],{"type":26,"value":46837},{"type":21,"tag":209,"props":52971,"children":52972},{"style":222},[52973],{"type":26,"value":52974},"())();\n",{"type":21,"tag":209,"props":52976,"children":52977},{"class":211,"line":325},[52978,52983,52987,52991,52995],{"type":21,"tag":209,"props":52979,"children":52980},{"style":222},[52981],{"type":26,"value":52982},"    }.",{"type":21,"tag":209,"props":52984,"children":52985},{"style":360},[52986],{"type":26,"value":17387},{"type":21,"tag":209,"props":52988,"children":52989},{"style":222},[52990],{"type":26,"value":368},{"type":21,"tag":209,"props":52992,"children":52993},{"style":263},[52994],{"type":26,"value":2508},{"type":21,"tag":209,"props":52996,"children":52997},{"style":222},[52998],{"type":26,"value":46554},{"type":21,"tag":209,"props":53000,"children":53001},{"class":211,"line":334},[53002],{"type":21,"tag":209,"props":53003,"children":53004},{"style":222},[53005],{"type":26,"value":7798},{"type":21,"tag":209,"props":53007,"children":53008},{"class":211,"line":343},[53009],{"type":21,"tag":209,"props":53010,"children":53011},{"emptyLinePlaceholder":248},[53012],{"type":26,"value":251},{"type":21,"tag":209,"props":53014,"children":53015},{"class":211,"line":351},[53016,53020,53024,53028,53032],{"type":21,"tag":209,"props":53017,"children":53018},{"style":222},[53019],{"type":26,"value":51294},{"type":21,"tag":209,"props":53021,"children":53022},{"style":360},[53023],{"type":26,"value":51199},{"type":21,"tag":209,"props":53025,"children":53026},{"style":216},[53027],{"type":26,"value":271},{"type":21,"tag":209,"props":53029,"children":53030},{"style":216},[53031],{"type":26,"value":4766},{"type":21,"tag":209,"props":53033,"children":53034},{"style":222},[53035],{"type":26,"value":2561},{"type":21,"tag":209,"props":53037,"children":53038},{"class":211,"line":444},[53039,53043,53047,53051,53055,53059,53063,53067],{"type":21,"tag":209,"props":53040,"children":53041},{"style":360},[53042],{"type":26,"value":52882},{"type":21,"tag":209,"props":53044,"children":53045},{"style":222},[53046],{"type":26,"value":368},{"type":21,"tag":209,"props":53048,"children":53049},{"style":233},[53050],{"type":26,"value":52891},{"type":21,"tag":209,"props":53052,"children":53053},{"style":222},[53054],{"type":26,"value":2699},{"type":21,"tag":209,"props":53056,"children":53057},{"style":360},[53058],{"type":26,"value":499},{"type":21,"tag":209,"props":53060,"children":53061},{"style":222},[53062],{"type":26,"value":368},{"type":21,"tag":209,"props":53064,"children":53065},{"style":233},[53066],{"type":26,"value":52909},{"type":21,"tag":209,"props":53068,"children":53069},{"style":222},[53070],{"type":26,"value":2608},{"type":21,"tag":209,"props":53072,"children":53073},{"class":211,"line":454},[53074],{"type":21,"tag":209,"props":53075,"children":53076},{"style":222},[53077],{"type":26,"value":7798},{"type":21,"tag":209,"props":53079,"children":53080},{"class":211,"line":463},[53081],{"type":21,"tag":209,"props":53082,"children":53083},{"emptyLinePlaceholder":248},[53084],{"type":26,"value":251},{"type":21,"tag":209,"props":53086,"children":53087},{"class":211,"line":472},[53088],{"type":21,"tag":209,"props":53089,"children":53090},{"style":448},[53091],{"type":26,"value":51256},{"type":21,"tag":209,"props":53093,"children":53094},{"class":211,"line":480},[53095],{"type":21,"tag":209,"props":53096,"children":53097},{"emptyLinePlaceholder":248},[53098],{"type":26,"value":251},{"type":21,"tag":209,"props":53100,"children":53101},{"class":211,"line":489},[53102,53106,53110,53114,53118,53122,53126,53130],{"type":21,"tag":209,"props":53103,"children":53104},{"style":263},[53105],{"type":26,"value":51182},{"type":21,"tag":209,"props":53107,"children":53108},{"style":222},[53109],{"type":26,"value":378},{"type":21,"tag":209,"props":53111,"children":53112},{"style":263},[53113],{"type":26,"value":37016},{"type":21,"tag":209,"props":53115,"children":53116},{"style":222},[53117],{"type":26,"value":378},{"type":21,"tag":209,"props":53119,"children":53120},{"style":360},[53121],{"type":26,"value":51199},{"type":21,"tag":209,"props":53123,"children":53124},{"style":216},[53125],{"type":26,"value":271},{"type":21,"tag":209,"props":53127,"children":53128},{"style":216},[53129],{"type":26,"value":4766},{"type":21,"tag":209,"props":53131,"children":53132},{"style":222},[53133],{"type":26,"value":2561},{"type":21,"tag":209,"props":53135,"children":53136},{"class":211,"line":847},[53137,53141,53145,53149,53153],{"type":21,"tag":209,"props":53138,"children":53139},{"style":263},[53140],{"type":26,"value":51112},{"type":21,"tag":209,"props":53142,"children":53143},{"style":222},[53144],{"type":26,"value":51117},{"type":21,"tag":209,"props":53146,"children":53147},{"style":216},[53148],{"type":26,"value":1432},{"type":21,"tag":209,"props":53150,"children":53151},{"style":263},[53152],{"type":26,"value":6243},{"type":21,"tag":209,"props":53154,"children":53155},{"style":222},[53156],{"type":26,"value":241},{"type":21,"tag":209,"props":53158,"children":53159},{"class":211,"line":860},[53160,53164,53168,53172,53176,53180],{"type":21,"tag":209,"props":53161,"children":53162},{"style":263},[53163],{"type":26,"value":51112},{"type":21,"tag":209,"props":53165,"children":53166},{"style":222},[53167],{"type":26,"value":52956},{"type":21,"tag":209,"props":53169,"children":53170},{"style":216},[53171],{"type":26,"value":1432},{"type":21,"tag":209,"props":53173,"children":53174},{"style":222},[53175],{"type":26,"value":52965},{"type":21,"tag":209,"props":53177,"children":53178},{"style":360},[53179],{"type":26,"value":46837},{"type":21,"tag":209,"props":53181,"children":53182},{"style":222},[53183],{"type":26,"value":52974},{"type":21,"tag":209,"props":53185,"children":53186},{"class":211,"line":877},[53187],{"type":21,"tag":209,"props":53188,"children":53189},{"style":222},[53190],{"type":26,"value":7798},{"type":21,"tag":51,"props":53192,"children":53194},{"id":53193},"content-and-styling",[53195],{"type":26,"value":53196},"Content and Styling",{"type":21,"tag":22,"props":53198,"children":53199},{},[53200,53202,53208,53210,53216],{"type":26,"value":53201},"There are some assumptions built in to the object - namely, that we want a div with the class ",{"type":21,"tag":63,"props":53203,"children":53205},{"className":53204},[],[53206],{"type":26,"value":53207},"map-info-window",{"type":26,"value":53209}," feel free to change this however you please. There's one other element addressed by class name, ",{"type":21,"tag":63,"props":53211,"children":53213},{"className":53212},[],[53214],{"type":26,"value":53215},"map-info-close",{"type":26,"value":53217}," this is our close button, obviously.",{"type":21,"tag":22,"props":53219,"children":53220},{},[53221],{"type":26,"value":53222},"The expected markup for our info window looks something like:",{"type":21,"tag":200,"props":53224,"children":53226},{"className":7947,"code":53225,"language":7949,"meta":8,"style":8},"\u003Cdiv class=\"map-info-window\">\n    \u003Cdiv class=\"map-info-close\">x\u003C/div>\n    \u003C!-- The rest of your content -->\n\u003C/div>\n",[53227],{"type":21,"tag":63,"props":53228,"children":53229},{"__ignoreMap":8},[53230,53258,53295,53303],{"type":21,"tag":209,"props":53231,"children":53232},{"class":211,"line":212},[53233,53237,53241,53245,53249,53254],{"type":21,"tag":209,"props":53234,"children":53235},{"style":222},[53236],{"type":26,"value":1985},{"type":21,"tag":209,"props":53238,"children":53239},{"style":1988},[53240],{"type":26,"value":2009},{"type":21,"tag":209,"props":53242,"children":53243},{"style":360},[53244],{"type":26,"value":33949},{"type":21,"tag":209,"props":53246,"children":53247},{"style":222},[53248],{"type":26,"value":1432},{"type":21,"tag":209,"props":53250,"children":53251},{"style":233},[53252],{"type":26,"value":53253},"\"map-info-window\"",{"type":21,"tag":209,"props":53255,"children":53256},{"style":222},[53257],{"type":26,"value":1996},{"type":21,"tag":209,"props":53259,"children":53260},{"class":211,"line":244},[53261,53265,53269,53273,53277,53282,53287,53291],{"type":21,"tag":209,"props":53262,"children":53263},{"style":222},[53264],{"type":26,"value":2004},{"type":21,"tag":209,"props":53266,"children":53267},{"style":1988},[53268],{"type":26,"value":2009},{"type":21,"tag":209,"props":53270,"children":53271},{"style":360},[53272],{"type":26,"value":33949},{"type":21,"tag":209,"props":53274,"children":53275},{"style":222},[53276],{"type":26,"value":1432},{"type":21,"tag":209,"props":53278,"children":53279},{"style":233},[53280],{"type":26,"value":53281},"\"map-info-close\"",{"type":21,"tag":209,"props":53283,"children":53284},{"style":222},[53285],{"type":26,"value":53286},">x\u003C/",{"type":21,"tag":209,"props":53288,"children":53289},{"style":1988},[53290],{"type":26,"value":2009},{"type":21,"tag":209,"props":53292,"children":53293},{"style":222},[53294],{"type":26,"value":1996},{"type":21,"tag":209,"props":53296,"children":53297},{"class":211,"line":254},[53298],{"type":21,"tag":209,"props":53299,"children":53300},{"style":448},[53301],{"type":26,"value":53302},"    \u003C!-- The rest of your content -->\n",{"type":21,"tag":209,"props":53304,"children":53305},{"class":211,"line":279},[53306,53310,53314],{"type":21,"tag":209,"props":53307,"children":53308},{"style":222},[53309],{"type":26,"value":2024},{"type":21,"tag":209,"props":53311,"children":53312},{"style":1988},[53313],{"type":26,"value":2009},{"type":21,"tag":209,"props":53315,"children":53316},{"style":222},[53317],{"type":26,"value":1996},{"type":21,"tag":22,"props":53319,"children":53320},{},[53321],{"type":26,"value":53322},"You can insert arbitrary html content into this div (via setContent), just as you would with a standard infoWindow. This content can then be styled as per usual.",{"type":21,"tag":22,"props":53324,"children":53325},{},[53326],{"type":26,"value":53327},"The absolute minimum required css looks like:",{"type":21,"tag":200,"props":53329,"children":53331},{"className":49405,"code":53330,"language":49407,"meta":8,"style":8},".map-info-window{\n    overflow:hidden;\n    position:absolute;\n}\n\n.map-info-window .map-info-close{\n    float:right;\n    cursor:pointer;\n}\n",[53332],{"type":21,"tag":63,"props":53333,"children":53334},{"__ignoreMap":8},[53335,53347,53368,53389,53396,53403,53419,53440,53461],{"type":21,"tag":209,"props":53336,"children":53337},{"class":211,"line":212},[53338,53343],{"type":21,"tag":209,"props":53339,"children":53340},{"style":360},[53341],{"type":26,"value":53342},".map-info-window",{"type":21,"tag":209,"props":53344,"children":53345},{"style":222},[53346],{"type":26,"value":7414},{"type":21,"tag":209,"props":53348,"children":53349},{"class":211,"line":244},[53350,53355,53359,53364],{"type":21,"tag":209,"props":53351,"children":53352},{"style":263},[53353],{"type":26,"value":53354},"    overflow",{"type":21,"tag":209,"props":53356,"children":53357},{"style":222},[53358],{"type":26,"value":191},{"type":21,"tag":209,"props":53360,"children":53361},{"style":263},[53362],{"type":26,"value":53363},"hidden",{"type":21,"tag":209,"props":53365,"children":53366},{"style":222},[53367],{"type":26,"value":241},{"type":21,"tag":209,"props":53369,"children":53370},{"class":211,"line":254},[53371,53376,53380,53385],{"type":21,"tag":209,"props":53372,"children":53373},{"style":263},[53374],{"type":26,"value":53375},"    position",{"type":21,"tag":209,"props":53377,"children":53378},{"style":222},[53379],{"type":26,"value":191},{"type":21,"tag":209,"props":53381,"children":53382},{"style":263},[53383],{"type":26,"value":53384},"absolute",{"type":21,"tag":209,"props":53386,"children":53387},{"style":222},[53388],{"type":26,"value":241},{"type":21,"tag":209,"props":53390,"children":53391},{"class":211,"line":279},[53392],{"type":21,"tag":209,"props":53393,"children":53394},{"style":222},[53395],{"type":26,"value":7798},{"type":21,"tag":209,"props":53397,"children":53398},{"class":211,"line":288},[53399],{"type":21,"tag":209,"props":53400,"children":53401},{"emptyLinePlaceholder":248},[53402],{"type":26,"value":251},{"type":21,"tag":209,"props":53404,"children":53405},{"class":211,"line":307},[53406,53410,53415],{"type":21,"tag":209,"props":53407,"children":53408},{"style":360},[53409],{"type":26,"value":53342},{"type":21,"tag":209,"props":53411,"children":53412},{"style":360},[53413],{"type":26,"value":53414}," .map-info-close",{"type":21,"tag":209,"props":53416,"children":53417},{"style":222},[53418],{"type":26,"value":7414},{"type":21,"tag":209,"props":53420,"children":53421},{"class":211,"line":325},[53422,53427,53431,53436],{"type":21,"tag":209,"props":53423,"children":53424},{"style":263},[53425],{"type":26,"value":53426},"    float",{"type":21,"tag":209,"props":53428,"children":53429},{"style":222},[53430],{"type":26,"value":191},{"type":21,"tag":209,"props":53432,"children":53433},{"style":263},[53434],{"type":26,"value":53435},"right",{"type":21,"tag":209,"props":53437,"children":53438},{"style":222},[53439],{"type":26,"value":241},{"type":21,"tag":209,"props":53441,"children":53442},{"class":211,"line":334},[53443,53448,53452,53457],{"type":21,"tag":209,"props":53444,"children":53445},{"style":263},[53446],{"type":26,"value":53447},"    cursor",{"type":21,"tag":209,"props":53449,"children":53450},{"style":222},[53451],{"type":26,"value":191},{"type":21,"tag":209,"props":53453,"children":53454},{"style":263},[53455],{"type":26,"value":53456},"pointer",{"type":21,"tag":209,"props":53458,"children":53459},{"style":222},[53460],{"type":26,"value":241},{"type":21,"tag":209,"props":53462,"children":53463},{"class":211,"line":343},[53464],{"type":21,"tag":209,"props":53465,"children":53466},{"style":222},[53467],{"type":26,"value":7798},{"type":21,"tag":22,"props":53469,"children":53470},{},[53471],{"type":26,"value":53472},"In order to get your info window to look something like the top-image example, you'll want a little more than the barebones:",{"type":21,"tag":200,"props":53474,"children":53476},{"className":49405,"code":53475,"language":49407,"meta":8,"style":8},".map-info-window{\n    background:#333;\n    border-radius:4px;\n    box-shadow:8px 8px 16px #222;\n    color:#fff;\n    max-width:200px;\n    max-height:300px;\n    text-align:center;\n    padding:5px 20px 10px;\n    overflow:hidden;\n    position:absolute;\n    text-transform:uppercase;\n}\n.map-info-window .map-info-close{\n    float:right;\n    cursor:pointer;\n    margin-right:-5px;\n    margin-left:5px;\n}\n\n.map-info-window h5{\n    font-weight:bold;\n}\n.map-info-window p{\n    color:#939393;\n}\n",[53477],{"type":21,"tag":63,"props":53478,"children":53479},{"__ignoreMap":8},[53480,53491,53512,53538,53584,53605,53629,53654,53675,53717,53736,53755,53776,53783,53798,53817,53836,53861,53885,53892,53899,53915,53936,53943,53959,53979],{"type":21,"tag":209,"props":53481,"children":53482},{"class":211,"line":212},[53483,53487],{"type":21,"tag":209,"props":53484,"children":53485},{"style":360},[53486],{"type":26,"value":53342},{"type":21,"tag":209,"props":53488,"children":53489},{"style":222},[53490],{"type":26,"value":7414},{"type":21,"tag":209,"props":53492,"children":53493},{"class":211,"line":244},[53494,53499,53503,53508],{"type":21,"tag":209,"props":53495,"children":53496},{"style":263},[53497],{"type":26,"value":53498},"    background",{"type":21,"tag":209,"props":53500,"children":53501},{"style":222},[53502],{"type":26,"value":191},{"type":21,"tag":209,"props":53504,"children":53505},{"style":263},[53506],{"type":26,"value":53507},"#333",{"type":21,"tag":209,"props":53509,"children":53510},{"style":222},[53511],{"type":26,"value":241},{"type":21,"tag":209,"props":53513,"children":53514},{"class":211,"line":254},[53515,53520,53524,53529,53534],{"type":21,"tag":209,"props":53516,"children":53517},{"style":263},[53518],{"type":26,"value":53519},"    border-radius",{"type":21,"tag":209,"props":53521,"children":53522},{"style":222},[53523],{"type":26,"value":191},{"type":21,"tag":209,"props":53525,"children":53526},{"style":263},[53527],{"type":26,"value":53528},"4",{"type":21,"tag":209,"props":53530,"children":53531},{"style":216},[53532],{"type":26,"value":53533},"px",{"type":21,"tag":209,"props":53535,"children":53536},{"style":222},[53537],{"type":26,"value":241},{"type":21,"tag":209,"props":53539,"children":53540},{"class":211,"line":279},[53541,53546,53550,53555,53559,53563,53567,53571,53575,53580],{"type":21,"tag":209,"props":53542,"children":53543},{"style":263},[53544],{"type":26,"value":53545},"    box-shadow",{"type":21,"tag":209,"props":53547,"children":53548},{"style":222},[53549],{"type":26,"value":191},{"type":21,"tag":209,"props":53551,"children":53552},{"style":263},[53553],{"type":26,"value":53554},"8",{"type":21,"tag":209,"props":53556,"children":53557},{"style":216},[53558],{"type":26,"value":53533},{"type":21,"tag":209,"props":53560,"children":53561},{"style":263},[53562],{"type":26,"value":36745},{"type":21,"tag":209,"props":53564,"children":53565},{"style":216},[53566],{"type":26,"value":53533},{"type":21,"tag":209,"props":53568,"children":53569},{"style":263},[53570],{"type":26,"value":36782},{"type":21,"tag":209,"props":53572,"children":53573},{"style":216},[53574],{"type":26,"value":53533},{"type":21,"tag":209,"props":53576,"children":53577},{"style":263},[53578],{"type":26,"value":53579}," #222",{"type":21,"tag":209,"props":53581,"children":53582},{"style":222},[53583],{"type":26,"value":241},{"type":21,"tag":209,"props":53585,"children":53586},{"class":211,"line":288},[53587,53592,53596,53601],{"type":21,"tag":209,"props":53588,"children":53589},{"style":263},[53590],{"type":26,"value":53591},"    color",{"type":21,"tag":209,"props":53593,"children":53594},{"style":222},[53595],{"type":26,"value":191},{"type":21,"tag":209,"props":53597,"children":53598},{"style":263},[53599],{"type":26,"value":53600},"#fff",{"type":21,"tag":209,"props":53602,"children":53603},{"style":222},[53604],{"type":26,"value":241},{"type":21,"tag":209,"props":53606,"children":53607},{"class":211,"line":307},[53608,53613,53617,53621,53625],{"type":21,"tag":209,"props":53609,"children":53610},{"style":263},[53611],{"type":26,"value":53612},"    max-width",{"type":21,"tag":209,"props":53614,"children":53615},{"style":222},[53616],{"type":26,"value":191},{"type":21,"tag":209,"props":53618,"children":53619},{"style":263},[53620],{"type":26,"value":14764},{"type":21,"tag":209,"props":53622,"children":53623},{"style":216},[53624],{"type":26,"value":53533},{"type":21,"tag":209,"props":53626,"children":53627},{"style":222},[53628],{"type":26,"value":241},{"type":21,"tag":209,"props":53630,"children":53631},{"class":211,"line":325},[53632,53637,53641,53646,53650],{"type":21,"tag":209,"props":53633,"children":53634},{"style":263},[53635],{"type":26,"value":53636},"    max-height",{"type":21,"tag":209,"props":53638,"children":53639},{"style":222},[53640],{"type":26,"value":191},{"type":21,"tag":209,"props":53642,"children":53643},{"style":263},[53644],{"type":26,"value":53645},"300",{"type":21,"tag":209,"props":53647,"children":53648},{"style":216},[53649],{"type":26,"value":53533},{"type":21,"tag":209,"props":53651,"children":53652},{"style":222},[53653],{"type":26,"value":241},{"type":21,"tag":209,"props":53655,"children":53656},{"class":211,"line":334},[53657,53662,53666,53671],{"type":21,"tag":209,"props":53658,"children":53659},{"style":263},[53660],{"type":26,"value":53661},"    text-align",{"type":21,"tag":209,"props":53663,"children":53664},{"style":222},[53665],{"type":26,"value":191},{"type":21,"tag":209,"props":53667,"children":53668},{"style":263},[53669],{"type":26,"value":53670},"center",{"type":21,"tag":209,"props":53672,"children":53673},{"style":222},[53674],{"type":26,"value":241},{"type":21,"tag":209,"props":53676,"children":53677},{"class":211,"line":343},[53678,53683,53687,53692,53696,53701,53705,53709,53713],{"type":21,"tag":209,"props":53679,"children":53680},{"style":263},[53681],{"type":26,"value":53682},"    padding",{"type":21,"tag":209,"props":53684,"children":53685},{"style":222},[53686],{"type":26,"value":191},{"type":21,"tag":209,"props":53688,"children":53689},{"style":263},[53690],{"type":26,"value":53691},"5",{"type":21,"tag":209,"props":53693,"children":53694},{"style":216},[53695],{"type":26,"value":53533},{"type":21,"tag":209,"props":53697,"children":53698},{"style":263},[53699],{"type":26,"value":53700}," 20",{"type":21,"tag":209,"props":53702,"children":53703},{"style":216},[53704],{"type":26,"value":53533},{"type":21,"tag":209,"props":53706,"children":53707},{"style":263},[53708],{"type":26,"value":52065},{"type":21,"tag":209,"props":53710,"children":53711},{"style":216},[53712],{"type":26,"value":53533},{"type":21,"tag":209,"props":53714,"children":53715},{"style":222},[53716],{"type":26,"value":241},{"type":21,"tag":209,"props":53718,"children":53719},{"class":211,"line":351},[53720,53724,53728,53732],{"type":21,"tag":209,"props":53721,"children":53722},{"style":263},[53723],{"type":26,"value":53354},{"type":21,"tag":209,"props":53725,"children":53726},{"style":222},[53727],{"type":26,"value":191},{"type":21,"tag":209,"props":53729,"children":53730},{"style":263},[53731],{"type":26,"value":53363},{"type":21,"tag":209,"props":53733,"children":53734},{"style":222},[53735],{"type":26,"value":241},{"type":21,"tag":209,"props":53737,"children":53738},{"class":211,"line":444},[53739,53743,53747,53751],{"type":21,"tag":209,"props":53740,"children":53741},{"style":263},[53742],{"type":26,"value":53375},{"type":21,"tag":209,"props":53744,"children":53745},{"style":222},[53746],{"type":26,"value":191},{"type":21,"tag":209,"props":53748,"children":53749},{"style":263},[53750],{"type":26,"value":53384},{"type":21,"tag":209,"props":53752,"children":53753},{"style":222},[53754],{"type":26,"value":241},{"type":21,"tag":209,"props":53756,"children":53757},{"class":211,"line":454},[53758,53763,53767,53772],{"type":21,"tag":209,"props":53759,"children":53760},{"style":263},[53761],{"type":26,"value":53762},"    text-transform",{"type":21,"tag":209,"props":53764,"children":53765},{"style":222},[53766],{"type":26,"value":191},{"type":21,"tag":209,"props":53768,"children":53769},{"style":263},[53770],{"type":26,"value":53771},"uppercase",{"type":21,"tag":209,"props":53773,"children":53774},{"style":222},[53775],{"type":26,"value":241},{"type":21,"tag":209,"props":53777,"children":53778},{"class":211,"line":463},[53779],{"type":21,"tag":209,"props":53780,"children":53781},{"style":222},[53782],{"type":26,"value":7798},{"type":21,"tag":209,"props":53784,"children":53785},{"class":211,"line":472},[53786,53790,53794],{"type":21,"tag":209,"props":53787,"children":53788},{"style":360},[53789],{"type":26,"value":53342},{"type":21,"tag":209,"props":53791,"children":53792},{"style":360},[53793],{"type":26,"value":53414},{"type":21,"tag":209,"props":53795,"children":53796},{"style":222},[53797],{"type":26,"value":7414},{"type":21,"tag":209,"props":53799,"children":53800},{"class":211,"line":480},[53801,53805,53809,53813],{"type":21,"tag":209,"props":53802,"children":53803},{"style":263},[53804],{"type":26,"value":53426},{"type":21,"tag":209,"props":53806,"children":53807},{"style":222},[53808],{"type":26,"value":191},{"type":21,"tag":209,"props":53810,"children":53811},{"style":263},[53812],{"type":26,"value":53435},{"type":21,"tag":209,"props":53814,"children":53815},{"style":222},[53816],{"type":26,"value":241},{"type":21,"tag":209,"props":53818,"children":53819},{"class":211,"line":489},[53820,53824,53828,53832],{"type":21,"tag":209,"props":53821,"children":53822},{"style":263},[53823],{"type":26,"value":53447},{"type":21,"tag":209,"props":53825,"children":53826},{"style":222},[53827],{"type":26,"value":191},{"type":21,"tag":209,"props":53829,"children":53830},{"style":263},[53831],{"type":26,"value":53456},{"type":21,"tag":209,"props":53833,"children":53834},{"style":222},[53835],{"type":26,"value":241},{"type":21,"tag":209,"props":53837,"children":53838},{"class":211,"line":847},[53839,53844,53848,53853,53857],{"type":21,"tag":209,"props":53840,"children":53841},{"style":263},[53842],{"type":26,"value":53843},"    margin-right",{"type":21,"tag":209,"props":53845,"children":53846},{"style":222},[53847],{"type":26,"value":191},{"type":21,"tag":209,"props":53849,"children":53850},{"style":263},[53851],{"type":26,"value":53852},"-5",{"type":21,"tag":209,"props":53854,"children":53855},{"style":216},[53856],{"type":26,"value":53533},{"type":21,"tag":209,"props":53858,"children":53859},{"style":222},[53860],{"type":26,"value":241},{"type":21,"tag":209,"props":53862,"children":53863},{"class":211,"line":860},[53864,53869,53873,53877,53881],{"type":21,"tag":209,"props":53865,"children":53866},{"style":263},[53867],{"type":26,"value":53868},"    margin-left",{"type":21,"tag":209,"props":53870,"children":53871},{"style":222},[53872],{"type":26,"value":191},{"type":21,"tag":209,"props":53874,"children":53875},{"style":263},[53876],{"type":26,"value":53691},{"type":21,"tag":209,"props":53878,"children":53879},{"style":216},[53880],{"type":26,"value":53533},{"type":21,"tag":209,"props":53882,"children":53883},{"style":222},[53884],{"type":26,"value":241},{"type":21,"tag":209,"props":53886,"children":53887},{"class":211,"line":877},[53888],{"type":21,"tag":209,"props":53889,"children":53890},{"style":222},[53891],{"type":26,"value":7798},{"type":21,"tag":209,"props":53893,"children":53894},{"class":211,"line":889},[53895],{"type":21,"tag":209,"props":53896,"children":53897},{"emptyLinePlaceholder":248},[53898],{"type":26,"value":251},{"type":21,"tag":209,"props":53900,"children":53901},{"class":211,"line":902},[53902,53906,53911],{"type":21,"tag":209,"props":53903,"children":53904},{"style":360},[53905],{"type":26,"value":53342},{"type":21,"tag":209,"props":53907,"children":53908},{"style":1988},[53909],{"type":26,"value":53910}," h5",{"type":21,"tag":209,"props":53912,"children":53913},{"style":222},[53914],{"type":26,"value":7414},{"type":21,"tag":209,"props":53916,"children":53917},{"class":211,"line":914},[53918,53923,53927,53932],{"type":21,"tag":209,"props":53919,"children":53920},{"style":263},[53921],{"type":26,"value":53922},"    font-weight",{"type":21,"tag":209,"props":53924,"children":53925},{"style":222},[53926],{"type":26,"value":191},{"type":21,"tag":209,"props":53928,"children":53929},{"style":263},[53930],{"type":26,"value":53931},"bold",{"type":21,"tag":209,"props":53933,"children":53934},{"style":222},[53935],{"type":26,"value":241},{"type":21,"tag":209,"props":53937,"children":53938},{"class":211,"line":922},[53939],{"type":21,"tag":209,"props":53940,"children":53941},{"style":222},[53942],{"type":26,"value":7798},{"type":21,"tag":209,"props":53944,"children":53945},{"class":211,"line":2312},[53946,53950,53955],{"type":21,"tag":209,"props":53947,"children":53948},{"style":360},[53949],{"type":26,"value":53342},{"type":21,"tag":209,"props":53951,"children":53952},{"style":1988},[53953],{"type":26,"value":53954}," p",{"type":21,"tag":209,"props":53956,"children":53957},{"style":222},[53958],{"type":26,"value":7414},{"type":21,"tag":209,"props":53960,"children":53961},{"class":211,"line":2321},[53962,53966,53970,53975],{"type":21,"tag":209,"props":53963,"children":53964},{"style":263},[53965],{"type":26,"value":53591},{"type":21,"tag":209,"props":53967,"children":53968},{"style":222},[53969],{"type":26,"value":191},{"type":21,"tag":209,"props":53971,"children":53972},{"style":263},[53973],{"type":26,"value":53974},"#939393",{"type":21,"tag":209,"props":53976,"children":53977},{"style":222},[53978],{"type":26,"value":241},{"type":21,"tag":209,"props":53980,"children":53981},{"class":211,"line":2372},[53982],{"type":21,"tag":209,"props":53983,"children":53984},{"style":222},[53985],{"type":26,"value":7798},{"type":21,"tag":22,"props":53987,"children":53988},{},[53989],{"type":26,"value":53990},"Of course, the info window itself and all content can be styled however you please.",{"type":21,"tag":51,"props":53992,"children":53994},{"id":53993},"marker-prerequisites",[53995],{"type":26,"value":53996},"Marker Prerequisites",{"type":21,"tag":22,"props":53998,"children":53999},{},[54000,54002,54008],{"type":26,"value":54001},"There are some prerequisites to your marker setup, however - namely, you need to specify an icon, with the ",{"type":21,"tag":63,"props":54003,"children":54005},{"className":54004},[],[54006],{"type":26,"value":54007},"scaledSize",{"type":26,"value":54009}," set appropriately. You can still use the generic google maps icon image, if so desired:",{"type":21,"tag":200,"props":54011,"children":54013},{"className":9044,"code":54012,"language":9046,"meta":8,"style":8},"var marker = new google.maps.Marker({\n    icon:{\n        url:http://maps.google.com/mapfiles/ms/icons/red-dot.png,\n        size:new google.maps.Size(32, 32),\n        scaledSize:new google.maps.Size(32, 32)\n    };\n});\n",[54014],{"type":21,"tag":63,"props":54015,"children":54016},{"__ignoreMap":8},[54017,54050,54058,54071,54113,54153,54160],{"type":21,"tag":209,"props":54018,"children":54019},{"class":211,"line":212},[54020,54024,54029,54033,54037,54041,54046],{"type":21,"tag":209,"props":54021,"children":54022},{"style":216},[54023],{"type":26,"value":8996},{"type":21,"tag":209,"props":54025,"children":54026},{"style":222},[54027],{"type":26,"value":54028}," marker ",{"type":21,"tag":209,"props":54030,"children":54031},{"style":216},[54032],{"type":26,"value":1432},{"type":21,"tag":209,"props":54034,"children":54035},{"style":216},[54036],{"type":26,"value":4667},{"type":21,"tag":209,"props":54038,"children":54039},{"style":222},[54040],{"type":26,"value":47991},{"type":21,"tag":209,"props":54042,"children":54043},{"style":360},[54044],{"type":26,"value":54045},"Marker",{"type":21,"tag":209,"props":54047,"children":54048},{"style":222},[54049],{"type":26,"value":17983},{"type":21,"tag":209,"props":54051,"children":54052},{"class":211,"line":244},[54053],{"type":21,"tag":209,"props":54054,"children":54055},{"style":222},[54056],{"type":26,"value":54057},"    icon:{\n",{"type":21,"tag":209,"props":54059,"children":54060},{"class":211,"line":254},[54061,54066],{"type":21,"tag":209,"props":54062,"children":54063},{"style":222},[54064],{"type":26,"value":54065},"        url:http:",{"type":21,"tag":209,"props":54067,"children":54068},{"style":448},[54069],{"type":26,"value":54070},"//maps.google.com/mapfiles/ms/icons/red-dot.png,\n",{"type":21,"tag":209,"props":54072,"children":54073},{"class":211,"line":279},[54074,54079,54083,54087,54092,54096,54101,54105,54109],{"type":21,"tag":209,"props":54075,"children":54076},{"style":222},[54077],{"type":26,"value":54078},"        size:",{"type":21,"tag":209,"props":54080,"children":54081},{"style":216},[54082],{"type":26,"value":21569},{"type":21,"tag":209,"props":54084,"children":54085},{"style":222},[54086],{"type":26,"value":47991},{"type":21,"tag":209,"props":54088,"children":54089},{"style":360},[54090],{"type":26,"value":54091},"Size",{"type":21,"tag":209,"props":54093,"children":54094},{"style":222},[54095],{"type":26,"value":368},{"type":21,"tag":209,"props":54097,"children":54098},{"style":263},[54099],{"type":26,"value":54100},"32",{"type":21,"tag":209,"props":54102,"children":54103},{"style":222},[54104],{"type":26,"value":408},{"type":21,"tag":209,"props":54106,"children":54107},{"style":263},[54108],{"type":26,"value":54100},{"type":21,"tag":209,"props":54110,"children":54111},{"style":222},[54112],{"type":26,"value":10277},{"type":21,"tag":209,"props":54114,"children":54115},{"class":211,"line":288},[54116,54121,54125,54129,54133,54137,54141,54145,54149],{"type":21,"tag":209,"props":54117,"children":54118},{"style":222},[54119],{"type":26,"value":54120},"        scaledSize:",{"type":21,"tag":209,"props":54122,"children":54123},{"style":216},[54124],{"type":26,"value":21569},{"type":21,"tag":209,"props":54126,"children":54127},{"style":222},[54128],{"type":26,"value":47991},{"type":21,"tag":209,"props":54130,"children":54131},{"style":360},[54132],{"type":26,"value":54091},{"type":21,"tag":209,"props":54134,"children":54135},{"style":222},[54136],{"type":26,"value":368},{"type":21,"tag":209,"props":54138,"children":54139},{"style":263},[54140],{"type":26,"value":54100},{"type":21,"tag":209,"props":54142,"children":54143},{"style":222},[54144],{"type":26,"value":408},{"type":21,"tag":209,"props":54146,"children":54147},{"style":263},[54148],{"type":26,"value":54100},{"type":21,"tag":209,"props":54150,"children":54151},{"style":222},[54152],{"type":26,"value":10112},{"type":21,"tag":209,"props":54154,"children":54155},{"class":211,"line":307},[54156],{"type":21,"tag":209,"props":54157,"children":54158},{"style":222},[54159],{"type":26,"value":4850},{"type":21,"tag":209,"props":54161,"children":54162},{"class":211,"line":325},[54163],{"type":21,"tag":209,"props":54164,"children":54165},{"style":222},[54166],{"type":26,"value":469},{"type":21,"tag":51,"props":54168,"children":54170},{"id":54169},"calling-the-custom-window",[54171],{"type":26,"value":54172},"Calling the Custom Window",{"type":21,"tag":22,"props":54174,"children":54175},{},[54176],{"type":26,"value":54177},"This works exactly the same as calling the standard info window. Assuming our infoWindow is living in GMaps as this.infoWindow, and we're inside the GMaps 'class':",{"type":21,"tag":200,"props":54179,"children":54181},{"className":9044,"code":54180,"language":9046,"meta":8,"style":8},"google.maps.event.addListener(marker, 'click', function(){\n    this.infoWindow.setContent('your html content');\n    this.infoWindow.open(map, marker);\n}.bind(this));\n",[54182],{"type":21,"tag":63,"props":54183,"children":54184},{"__ignoreMap":8},[54185,54219,54248,54268],{"type":21,"tag":209,"props":54186,"children":54187},{"class":211,"line":212},[54188,54193,54198,54203,54207,54211,54215],{"type":21,"tag":209,"props":54189,"children":54190},{"style":222},[54191],{"type":26,"value":54192},"google.maps.event.",{"type":21,"tag":209,"props":54194,"children":54195},{"style":360},[54196],{"type":26,"value":54197},"addListener",{"type":21,"tag":209,"props":54199,"children":54200},{"style":222},[54201],{"type":26,"value":54202},"(marker, ",{"type":21,"tag":209,"props":54204,"children":54205},{"style":233},[54206],{"type":26,"value":6354},{"type":21,"tag":209,"props":54208,"children":54209},{"style":222},[54210],{"type":26,"value":408},{"type":21,"tag":209,"props":54212,"children":54213},{"style":216},[54214],{"type":26,"value":5370},{"type":21,"tag":209,"props":54216,"children":54217},{"style":222},[54218],{"type":26,"value":2561},{"type":21,"tag":209,"props":54220,"children":54221},{"class":211,"line":244},[54222,54226,54231,54235,54239,54244],{"type":21,"tag":209,"props":54223,"children":54224},{"style":263},[54225],{"type":26,"value":51112},{"type":21,"tag":209,"props":54227,"children":54228},{"style":222},[54229],{"type":26,"value":54230},".infoWindow.",{"type":21,"tag":209,"props":54232,"children":54233},{"style":360},[54234],{"type":26,"value":52445},{"type":21,"tag":209,"props":54236,"children":54237},{"style":222},[54238],{"type":26,"value":368},{"type":21,"tag":209,"props":54240,"children":54241},{"style":233},[54242],{"type":26,"value":54243},"'your html content'",{"type":21,"tag":209,"props":54245,"children":54246},{"style":222},[54247],{"type":26,"value":2608},{"type":21,"tag":209,"props":54249,"children":54250},{"class":211,"line":254},[54251,54255,54259,54263],{"type":21,"tag":209,"props":54252,"children":54253},{"style":263},[54254],{"type":26,"value":51112},{"type":21,"tag":209,"props":54256,"children":54257},{"style":222},[54258],{"type":26,"value":54230},{"type":21,"tag":209,"props":54260,"children":54261},{"style":360},[54262],{"type":26,"value":11610},{"type":21,"tag":209,"props":54264,"children":54265},{"style":222},[54266],{"type":26,"value":54267},"(map, marker);\n",{"type":21,"tag":209,"props":54269,"children":54270},{"class":211,"line":279},[54271,54276,54280,54284,54288],{"type":21,"tag":209,"props":54272,"children":54273},{"style":222},[54274],{"type":26,"value":54275},"}.",{"type":21,"tag":209,"props":54277,"children":54278},{"style":360},[54279],{"type":26,"value":17387},{"type":21,"tag":209,"props":54281,"children":54282},{"style":222},[54283],{"type":26,"value":368},{"type":21,"tag":209,"props":54285,"children":54286},{"style":263},[54287],{"type":26,"value":2508},{"type":21,"tag":209,"props":54289,"children":54290},{"style":222},[54291],{"type":26,"value":46554},{"type":21,"tag":51,"props":54293,"children":54295},{"id":54294},"jquery-free",[54296],{"type":26,"value":54297},"jQuery Free",{"type":21,"tag":22,"props":54299,"children":54300},{},[54301],{"type":26,"value":54302},"This isn't a jQuery plugin, so if we want to do without jQuery, we certainly can:",{"type":21,"tag":200,"props":54304,"children":54306},{"className":9044,"code":54305,"language":9046,"meta":8,"style":8},"/**\n * Create a custom overlay for our window marker display, extending google.maps.OverlayView.\n * This is somewhat complicated by needing to async load the google.maps api first - thus, we\n * wrap CustomWindow into a closure, and when instantiating CustomNativeWindow, we first execute the closure\n * (to create our CustomNativeWindow function, now properly extending the newly loaded google.maps.OverlayView),\n * and then instantiate said function.\n * @type {Function}\n * @see _mapView.onRender\n */\n(function(){\n    var CustomWindow = function(){\n        this.container = document.createElement('div');\n        this.container.classList.add('map-info-window');\n        this.layer = null;\n        this.marker = null;\n        this.position = null;\n    };\n    /**\n     * Inherit from OverlayView\n     * @type {google.maps.OverlayView}\n     */\n    CustomWindow.prototype = new google.maps.OverlayView();\n    /**\n     * Called when this overlay is set to a map via this.setMap. Get the appropriate map pane\n     * to add the window to, append the container, bind to close element.\n     * @see CustomWindow.open\n     */\n    CustomWindow.prototype.onAdd = function(){\n        this.layer = this.getPanes().floatPane;\n        this.layer.appendChild(this.container);\n        this.container.getElementsByClassName('map-info-close')[0].addEventListener('click', function(){\n            // Close info window on click\n            this.close();\n        }.bind(this), false);\n    };\n    /**\n     * Called after onAdd, and every time the map is moved, zoomed, or anything else that\n     * would effect positions, to redraw this overlay.\n     */\n    CustomWindow.prototype.draw = function(){\n        var markerIcon = this.marker.getIcon(),\n            cBounds = this.container.getBoundingClientRect(),\n            cHeight = cBounds.height + markerIcon.scaledSize.height + 10,\n            cWidth = cBounds.width / 2;\n        this.position = this.getProjection().fromLatLngToDivPixel(this.marker.getPosition());\n        this.container.style.top = this.position.y - cHeight+'px';\n        this.container.style.left = this.position.x - cWidth+'px';\n    };\n    /**\n     * Called when this overlay has its map set to null.\n     * @see CustomWindow.close\n     */\n    CustomWindow.prototype.onRemove = function(){\n        this.layer.removeChild(this.container);\n    };\n    /**\n     * Sets the contents of this overlay.\n     * @param {string} html\n     */\n    CustomWindow.prototype.setContent = function(html){\n        this.container.innerHTML = html;\n    };\n    /**\n     * Sets the map and relevant marker for this overlay.\n     * @param {google.maps.Map} map\n     * @param {google.maps.Marker} marker\n     */\n    CustomWindow.prototype.open = function(map, marker){\n        this.marker = marker;\n        this.setMap(map);\n    };\n    /**\n     * Close this overlay by setting its map to null.\n     */\n    CustomWindow.prototype.close = function(){\n        this.setMap(null);\n    };\n    return CustomWindow;\n});\n",[54307],{"type":21,"tag":63,"props":54308,"children":54309},{"__ignoreMap":8},[54310,54317,54325,54333,54341,54349,54357,54372,54388,54395,54410,54433,54469,54499,54522,54545,54568,54575,54582,54589,54604,54611,54646,54653,54660,54667,54682,54689,54724,54756,54783,54845,54852,54871,54903,54910,54917,54924,54931,54938,54973,55004,55033,55069,55097,55152,55198,55243,55250,55257,55264,55279,55286,55321,55348,55355,55362,55369,55388,55395,55438,55459,55466,55473,55480,55499,55518,55525,55576,55595,55614,55621,55628,55635,55642,55677,55704,55711,55722],{"type":21,"tag":209,"props":54311,"children":54312},{"class":211,"line":212},[54313],{"type":21,"tag":209,"props":54314,"children":54315},{"style":448},[54316],{"type":26,"value":731},{"type":21,"tag":209,"props":54318,"children":54319},{"class":211,"line":244},[54320],{"type":21,"tag":209,"props":54321,"children":54322},{"style":448},[54323],{"type":26,"value":54324}," * Create a custom overlay for our window marker display, extending google.maps.OverlayView.\n",{"type":21,"tag":209,"props":54326,"children":54327},{"class":211,"line":254},[54328],{"type":21,"tag":209,"props":54329,"children":54330},{"style":448},[54331],{"type":26,"value":54332}," * This is somewhat complicated by needing to async load the google.maps api first - thus, we\n",{"type":21,"tag":209,"props":54334,"children":54335},{"class":211,"line":279},[54336],{"type":21,"tag":209,"props":54337,"children":54338},{"style":448},[54339],{"type":26,"value":54340}," * wrap CustomWindow into a closure, and when instantiating CustomNativeWindow, we first execute the closure\n",{"type":21,"tag":209,"props":54342,"children":54343},{"class":211,"line":288},[54344],{"type":21,"tag":209,"props":54345,"children":54346},{"style":448},[54347],{"type":26,"value":54348}," * (to create our CustomNativeWindow function, now properly extending the newly loaded google.maps.OverlayView),\n",{"type":21,"tag":209,"props":54350,"children":54351},{"class":211,"line":307},[54352],{"type":21,"tag":209,"props":54353,"children":54354},{"style":448},[54355],{"type":26,"value":54356}," * and then instantiate said function.\n",{"type":21,"tag":209,"props":54358,"children":54359},{"class":211,"line":325},[54360,54364,54368],{"type":21,"tag":209,"props":54361,"children":54362},{"style":448},[54363],{"type":26,"value":11233},{"type":21,"tag":209,"props":54365,"children":54366},{"style":216},[54367],{"type":26,"value":51414},{"type":21,"tag":209,"props":54369,"children":54370},{"style":360},[54371],{"type":26,"value":51419},{"type":21,"tag":209,"props":54373,"children":54374},{"class":211,"line":334},[54375,54379,54383],{"type":21,"tag":209,"props":54376,"children":54377},{"style":448},[54378],{"type":26,"value":11233},{"type":21,"tag":209,"props":54380,"children":54381},{"style":216},[54382],{"type":26,"value":51688},{"type":21,"tag":209,"props":54384,"children":54385},{"style":360},[54386],{"type":26,"value":54387}," _mapView.onRender\n",{"type":21,"tag":209,"props":54389,"children":54390},{"class":211,"line":343},[54391],{"type":21,"tag":209,"props":54392,"children":54393},{"style":448},[54394],{"type":26,"value":755},{"type":21,"tag":209,"props":54396,"children":54397},{"class":211,"line":351},[54398,54402,54406],{"type":21,"tag":209,"props":54399,"children":54400},{"style":222},[54401],{"type":26,"value":368},{"type":21,"tag":209,"props":54403,"children":54404},{"style":216},[54405],{"type":26,"value":5370},{"type":21,"tag":209,"props":54407,"children":54408},{"style":222},[54409],{"type":26,"value":2561},{"type":21,"tag":209,"props":54411,"children":54412},{"class":211,"line":444},[54413,54417,54421,54425,54429],{"type":21,"tag":209,"props":54414,"children":54415},{"style":216},[54416],{"type":26,"value":10405},{"type":21,"tag":209,"props":54418,"children":54419},{"style":360},[54420],{"type":26,"value":51453},{"type":21,"tag":209,"props":54422,"children":54423},{"style":216},[54424],{"type":26,"value":271},{"type":21,"tag":209,"props":54426,"children":54427},{"style":216},[54428],{"type":26,"value":4766},{"type":21,"tag":209,"props":54430,"children":54431},{"style":222},[54432],{"type":26,"value":2561},{"type":21,"tag":209,"props":54434,"children":54435},{"class":211,"line":454},[54436,54440,54444,54448,54452,54456,54460,54465],{"type":21,"tag":209,"props":54437,"children":54438},{"style":263},[54439],{"type":26,"value":51473},{"type":21,"tag":209,"props":54441,"children":54442},{"style":222},[54443],{"type":26,"value":51478},{"type":21,"tag":209,"props":54445,"children":54446},{"style":216},[54447],{"type":26,"value":1432},{"type":21,"tag":209,"props":54449,"children":54450},{"style":222},[54451],{"type":26,"value":9271},{"type":21,"tag":209,"props":54453,"children":54454},{"style":360},[54455],{"type":26,"value":9276},{"type":21,"tag":209,"props":54457,"children":54458},{"style":222},[54459],{"type":26,"value":368},{"type":21,"tag":209,"props":54461,"children":54462},{"style":233},[54463],{"type":26,"value":54464},"'div'",{"type":21,"tag":209,"props":54466,"children":54467},{"style":222},[54468],{"type":26,"value":2608},{"type":21,"tag":209,"props":54470,"children":54471},{"class":211,"line":463},[54472,54476,54481,54486,54490,54495],{"type":21,"tag":209,"props":54473,"children":54474},{"style":263},[54475],{"type":26,"value":51473},{"type":21,"tag":209,"props":54477,"children":54478},{"style":222},[54479],{"type":26,"value":54480},".container.classList.",{"type":21,"tag":209,"props":54482,"children":54483},{"style":360},[54484],{"type":26,"value":54485},"add",{"type":21,"tag":209,"props":54487,"children":54488},{"style":222},[54489],{"type":26,"value":368},{"type":21,"tag":209,"props":54491,"children":54492},{"style":233},[54493],{"type":26,"value":54494},"'map-info-window'",{"type":21,"tag":209,"props":54496,"children":54497},{"style":222},[54498],{"type":26,"value":2608},{"type":21,"tag":209,"props":54500,"children":54501},{"class":211,"line":472},[54502,54506,54510,54514,54518],{"type":21,"tag":209,"props":54503,"children":54504},{"style":263},[54505],{"type":26,"value":51473},{"type":21,"tag":209,"props":54507,"children":54508},{"style":222},[54509],{"type":26,"value":51511},{"type":21,"tag":209,"props":54511,"children":54512},{"style":216},[54513],{"type":26,"value":1432},{"type":21,"tag":209,"props":54515,"children":54516},{"style":263},[54517],{"type":26,"value":41733},{"type":21,"tag":209,"props":54519,"children":54520},{"style":222},[54521],{"type":26,"value":241},{"type":21,"tag":209,"props":54523,"children":54524},{"class":211,"line":480},[54525,54529,54533,54537,54541],{"type":21,"tag":209,"props":54526,"children":54527},{"style":263},[54528],{"type":26,"value":51473},{"type":21,"tag":209,"props":54530,"children":54531},{"style":222},[54532],{"type":26,"value":51535},{"type":21,"tag":209,"props":54534,"children":54535},{"style":216},[54536],{"type":26,"value":1432},{"type":21,"tag":209,"props":54538,"children":54539},{"style":263},[54540],{"type":26,"value":41733},{"type":21,"tag":209,"props":54542,"children":54543},{"style":222},[54544],{"type":26,"value":241},{"type":21,"tag":209,"props":54546,"children":54547},{"class":211,"line":489},[54548,54552,54556,54560,54564],{"type":21,"tag":209,"props":54549,"children":54550},{"style":263},[54551],{"type":26,"value":51473},{"type":21,"tag":209,"props":54553,"children":54554},{"style":222},[54555],{"type":26,"value":51559},{"type":21,"tag":209,"props":54557,"children":54558},{"style":216},[54559],{"type":26,"value":1432},{"type":21,"tag":209,"props":54561,"children":54562},{"style":263},[54563],{"type":26,"value":41733},{"type":21,"tag":209,"props":54565,"children":54566},{"style":222},[54567],{"type":26,"value":241},{"type":21,"tag":209,"props":54569,"children":54570},{"class":211,"line":847},[54571],{"type":21,"tag":209,"props":54572,"children":54573},{"style":222},[54574],{"type":26,"value":4850},{"type":21,"tag":209,"props":54576,"children":54577},{"class":211,"line":860},[54578],{"type":21,"tag":209,"props":54579,"children":54580},{"style":448},[54581],{"type":26,"value":4697},{"type":21,"tag":209,"props":54583,"children":54584},{"class":211,"line":877},[54585],{"type":21,"tag":209,"props":54586,"children":54587},{"style":448},[54588],{"type":26,"value":51593},{"type":21,"tag":209,"props":54590,"children":54591},{"class":211,"line":889},[54592,54596,54600],{"type":21,"tag":209,"props":54593,"children":54594},{"style":448},[54595],{"type":26,"value":4713},{"type":21,"tag":209,"props":54597,"children":54598},{"style":216},[54599],{"type":26,"value":51414},{"type":21,"tag":209,"props":54601,"children":54602},{"style":360},[54603],{"type":26,"value":51609},{"type":21,"tag":209,"props":54605,"children":54606},{"class":211,"line":902},[54607],{"type":21,"tag":209,"props":54608,"children":54609},{"style":448},[54610],{"type":26,"value":4753},{"type":21,"tag":209,"props":54612,"children":54613},{"class":211,"line":914},[54614,54618,54622,54626,54630,54634,54638,54642],{"type":21,"tag":209,"props":54615,"children":54616},{"style":263},[54617],{"type":26,"value":51624},{"type":21,"tag":209,"props":54619,"children":54620},{"style":222},[54621],{"type":26,"value":378},{"type":21,"tag":209,"props":54623,"children":54624},{"style":263},[54625],{"type":26,"value":37016},{"type":21,"tag":209,"props":54627,"children":54628},{"style":216},[54629],{"type":26,"value":271},{"type":21,"tag":209,"props":54631,"children":54632},{"style":216},[54633],{"type":26,"value":4667},{"type":21,"tag":209,"props":54635,"children":54636},{"style":222},[54637],{"type":26,"value":47991},{"type":21,"tag":209,"props":54639,"children":54640},{"style":360},[54641],{"type":26,"value":51649},{"type":21,"tag":209,"props":54643,"children":54644},{"style":222},[54645],{"type":26,"value":4842},{"type":21,"tag":209,"props":54647,"children":54648},{"class":211,"line":922},[54649],{"type":21,"tag":209,"props":54650,"children":54651},{"style":448},[54652],{"type":26,"value":4697},{"type":21,"tag":209,"props":54654,"children":54655},{"class":211,"line":2312},[54656],{"type":21,"tag":209,"props":54657,"children":54658},{"style":448},[54659],{"type":26,"value":51668},{"type":21,"tag":209,"props":54661,"children":54662},{"class":211,"line":2321},[54663],{"type":21,"tag":209,"props":54664,"children":54665},{"style":448},[54666],{"type":26,"value":51676},{"type":21,"tag":209,"props":54668,"children":54669},{"class":211,"line":2372},[54670,54674,54678],{"type":21,"tag":209,"props":54671,"children":54672},{"style":448},[54673],{"type":26,"value":4713},{"type":21,"tag":209,"props":54675,"children":54676},{"style":216},[54677],{"type":26,"value":51688},{"type":21,"tag":209,"props":54679,"children":54680},{"style":360},[54681],{"type":26,"value":51693},{"type":21,"tag":209,"props":54683,"children":54684},{"class":211,"line":2381},[54685],{"type":21,"tag":209,"props":54686,"children":54687},{"style":448},[54688],{"type":26,"value":4753},{"type":21,"tag":209,"props":54690,"children":54691},{"class":211,"line":2389},[54692,54696,54700,54704,54708,54712,54716,54720],{"type":21,"tag":209,"props":54693,"children":54694},{"style":263},[54695],{"type":26,"value":51624},{"type":21,"tag":209,"props":54697,"children":54698},{"style":222},[54699],{"type":26,"value":378},{"type":21,"tag":209,"props":54701,"children":54702},{"style":263},[54703],{"type":26,"value":37016},{"type":21,"tag":209,"props":54705,"children":54706},{"style":222},[54707],{"type":26,"value":378},{"type":21,"tag":209,"props":54709,"children":54710},{"style":360},[54711],{"type":26,"value":51724},{"type":21,"tag":209,"props":54713,"children":54714},{"style":216},[54715],{"type":26,"value":271},{"type":21,"tag":209,"props":54717,"children":54718},{"style":216},[54719],{"type":26,"value":4766},{"type":21,"tag":209,"props":54721,"children":54722},{"style":222},[54723],{"type":26,"value":2561},{"type":21,"tag":209,"props":54725,"children":54726},{"class":211,"line":2397},[54727,54731,54735,54739,54743,54747,54751],{"type":21,"tag":209,"props":54728,"children":54729},{"style":263},[54730],{"type":26,"value":51473},{"type":21,"tag":209,"props":54732,"children":54733},{"style":222},[54734],{"type":26,"value":51511},{"type":21,"tag":209,"props":54736,"children":54737},{"style":216},[54738],{"type":26,"value":1432},{"type":21,"tag":209,"props":54740,"children":54741},{"style":263},[54742],{"type":26,"value":17698},{"type":21,"tag":209,"props":54744,"children":54745},{"style":222},[54746],{"type":26,"value":378},{"type":21,"tag":209,"props":54748,"children":54749},{"style":360},[54750],{"type":26,"value":51772},{"type":21,"tag":209,"props":54752,"children":54753},{"style":222},[54754],{"type":26,"value":54755},"().floatPane;\n",{"type":21,"tag":209,"props":54757,"children":54758},{"class":211,"line":2406},[54759,54763,54767,54771,54775,54779],{"type":21,"tag":209,"props":54760,"children":54761},{"style":263},[54762],{"type":26,"value":51473},{"type":21,"tag":209,"props":54764,"children":54765},{"style":222},[54766],{"type":26,"value":51789},{"type":21,"tag":209,"props":54768,"children":54769},{"style":360},[54770],{"type":26,"value":9373},{"type":21,"tag":209,"props":54772,"children":54773},{"style":222},[54774],{"type":26,"value":368},{"type":21,"tag":209,"props":54776,"children":54777},{"style":263},[54778],{"type":26,"value":2508},{"type":21,"tag":209,"props":54780,"children":54781},{"style":222},[54782],{"type":26,"value":51807},{"type":21,"tag":209,"props":54784,"children":54785},{"class":211,"line":2415},[54786,54790,54794,54799,54803,54808,54812,54816,54821,54825,54829,54833,54837,54841],{"type":21,"tag":209,"props":54787,"children":54788},{"style":263},[54789],{"type":26,"value":51473},{"type":21,"tag":209,"props":54791,"children":54792},{"style":222},[54793],{"type":26,"value":51819},{"type":21,"tag":209,"props":54795,"children":54796},{"style":360},[54797],{"type":26,"value":54798},"getElementsByClassName",{"type":21,"tag":209,"props":54800,"children":54801},{"style":222},[54802],{"type":26,"value":368},{"type":21,"tag":209,"props":54804,"children":54805},{"style":233},[54806],{"type":26,"value":54807},"'map-info-close'",{"type":21,"tag":209,"props":54809,"children":54810},{"style":222},[54811],{"type":26,"value":24289},{"type":21,"tag":209,"props":54813,"children":54814},{"style":263},[54815],{"type":26,"value":6048},{"type":21,"tag":209,"props":54817,"children":54818},{"style":222},[54819],{"type":26,"value":54820},"].",{"type":21,"tag":209,"props":54822,"children":54823},{"style":360},[54824],{"type":26,"value":6424},{"type":21,"tag":209,"props":54826,"children":54827},{"style":222},[54828],{"type":26,"value":368},{"type":21,"tag":209,"props":54830,"children":54831},{"style":233},[54832],{"type":26,"value":6354},{"type":21,"tag":209,"props":54834,"children":54835},{"style":222},[54836],{"type":26,"value":408},{"type":21,"tag":209,"props":54838,"children":54839},{"style":216},[54840],{"type":26,"value":5370},{"type":21,"tag":209,"props":54842,"children":54843},{"style":222},[54844],{"type":26,"value":2561},{"type":21,"tag":209,"props":54846,"children":54847},{"class":211,"line":2424},[54848],{"type":21,"tag":209,"props":54849,"children":54850},{"style":448},[54851],{"type":26,"value":51877},{"type":21,"tag":209,"props":54853,"children":54854},{"class":211,"line":2433},[54855,54859,54863,54867],{"type":21,"tag":209,"props":54856,"children":54857},{"style":263},[54858],{"type":26,"value":2570},{"type":21,"tag":209,"props":54860,"children":54861},{"style":222},[54862],{"type":26,"value":378},{"type":21,"tag":209,"props":54864,"children":54865},{"style":360},[54866],{"type":26,"value":51893},{"type":21,"tag":209,"props":54868,"children":54869},{"style":222},[54870],{"type":26,"value":4842},{"type":21,"tag":209,"props":54872,"children":54873},{"class":211,"line":2442},[54874,54878,54882,54886,54890,54895,54899],{"type":21,"tag":209,"props":54875,"children":54876},{"style":222},[54877],{"type":26,"value":24336},{"type":21,"tag":209,"props":54879,"children":54880},{"style":360},[54881],{"type":26,"value":17387},{"type":21,"tag":209,"props":54883,"children":54884},{"style":222},[54885],{"type":26,"value":368},{"type":21,"tag":209,"props":54887,"children":54888},{"style":263},[54889],{"type":26,"value":2508},{"type":21,"tag":209,"props":54891,"children":54892},{"style":222},[54893],{"type":26,"value":54894},"), ",{"type":21,"tag":209,"props":54896,"children":54897},{"style":263},[54898],{"type":26,"value":27598},{"type":21,"tag":209,"props":54900,"children":54901},{"style":222},[54902],{"type":26,"value":2608},{"type":21,"tag":209,"props":54904,"children":54905},{"class":211,"line":2471},[54906],{"type":21,"tag":209,"props":54907,"children":54908},{"style":222},[54909],{"type":26,"value":4850},{"type":21,"tag":209,"props":54911,"children":54912},{"class":211,"line":2480},[54913],{"type":21,"tag":209,"props":54914,"children":54915},{"style":448},[54916],{"type":26,"value":4697},{"type":21,"tag":209,"props":54918,"children":54919},{"class":211,"line":2489},[54920],{"type":21,"tag":209,"props":54921,"children":54922},{"style":448},[54923],{"type":26,"value":51934},{"type":21,"tag":209,"props":54925,"children":54926},{"class":211,"line":2516},[54927],{"type":21,"tag":209,"props":54928,"children":54929},{"style":448},[54930],{"type":26,"value":51942},{"type":21,"tag":209,"props":54932,"children":54933},{"class":211,"line":2525},[54934],{"type":21,"tag":209,"props":54935,"children":54936},{"style":448},[54937],{"type":26,"value":4753},{"type":21,"tag":209,"props":54939,"children":54940},{"class":211,"line":2533},[54941,54945,54949,54953,54957,54961,54965,54969],{"type":21,"tag":209,"props":54942,"children":54943},{"style":263},[54944],{"type":26,"value":51624},{"type":21,"tag":209,"props":54946,"children":54947},{"style":222},[54948],{"type":26,"value":378},{"type":21,"tag":209,"props":54950,"children":54951},{"style":263},[54952],{"type":26,"value":37016},{"type":21,"tag":209,"props":54954,"children":54955},{"style":222},[54956],{"type":26,"value":378},{"type":21,"tag":209,"props":54958,"children":54959},{"style":360},[54960],{"type":26,"value":51973},{"type":21,"tag":209,"props":54962,"children":54963},{"style":216},[54964],{"type":26,"value":271},{"type":21,"tag":209,"props":54966,"children":54967},{"style":216},[54968],{"type":26,"value":4766},{"type":21,"tag":209,"props":54970,"children":54971},{"style":222},[54972],{"type":26,"value":2561},{"type":21,"tag":209,"props":54974,"children":54975},{"class":211,"line":2542},[54976,54980,54984,54988,54992,54996,55000],{"type":21,"tag":209,"props":54977,"children":54978},{"style":216},[54979],{"type":26,"value":5925},{"type":21,"tag":209,"props":54981,"children":54982},{"style":222},[54983],{"type":26,"value":51997},{"type":21,"tag":209,"props":54985,"children":54986},{"style":216},[54987],{"type":26,"value":1432},{"type":21,"tag":209,"props":54989,"children":54990},{"style":263},[54991],{"type":26,"value":17698},{"type":21,"tag":209,"props":54993,"children":54994},{"style":222},[54995],{"type":26,"value":46912},{"type":21,"tag":209,"props":54997,"children":54998},{"style":360},[54999],{"type":26,"value":52014},{"type":21,"tag":209,"props":55001,"children":55002},{"style":222},[55003],{"type":26,"value":5405},{"type":21,"tag":209,"props":55005,"children":55006},{"class":211,"line":2550},[55007,55012,55016,55020,55024,55029],{"type":21,"tag":209,"props":55008,"children":55009},{"style":222},[55010],{"type":26,"value":55011},"            cBounds ",{"type":21,"tag":209,"props":55013,"children":55014},{"style":216},[55015],{"type":26,"value":1432},{"type":21,"tag":209,"props":55017,"children":55018},{"style":263},[55019],{"type":26,"value":17698},{"type":21,"tag":209,"props":55021,"children":55022},{"style":222},[55023],{"type":26,"value":51819},{"type":21,"tag":209,"props":55025,"children":55026},{"style":360},[55027],{"type":26,"value":55028},"getBoundingClientRect",{"type":21,"tag":209,"props":55030,"children":55031},{"style":222},[55032],{"type":26,"value":5405},{"type":21,"tag":209,"props":55034,"children":55035},{"class":211,"line":2564},[55036,55040,55044,55049,55053,55057,55061,55065],{"type":21,"tag":209,"props":55037,"children":55038},{"style":222},[55039],{"type":26,"value":52026},{"type":21,"tag":209,"props":55041,"children":55042},{"style":216},[55043],{"type":26,"value":1432},{"type":21,"tag":209,"props":55045,"children":55046},{"style":222},[55047],{"type":26,"value":55048}," cBounds.height ",{"type":21,"tag":209,"props":55050,"children":55051},{"style":216},[55052],{"type":26,"value":10237},{"type":21,"tag":209,"props":55054,"children":55055},{"style":222},[55056],{"type":26,"value":52056},{"type":21,"tag":209,"props":55058,"children":55059},{"style":216},[55060],{"type":26,"value":10237},{"type":21,"tag":209,"props":55062,"children":55063},{"style":263},[55064],{"type":26,"value":52065},{"type":21,"tag":209,"props":55066,"children":55067},{"style":222},[55068],{"type":26,"value":304},{"type":21,"tag":209,"props":55070,"children":55071},{"class":211,"line":2611},[55072,55076,55080,55085,55089,55093],{"type":21,"tag":209,"props":55073,"children":55074},{"style":222},[55075],{"type":26,"value":52077},{"type":21,"tag":209,"props":55077,"children":55078},{"style":216},[55079],{"type":26,"value":1432},{"type":21,"tag":209,"props":55081,"children":55082},{"style":222},[55083],{"type":26,"value":55084}," cBounds.width ",{"type":21,"tag":209,"props":55086,"children":55087},{"style":216},[55088],{"type":26,"value":9749},{"type":21,"tag":209,"props":55090,"children":55091},{"style":263},[55092],{"type":26,"value":36498},{"type":21,"tag":209,"props":55094,"children":55095},{"style":222},[55096],{"type":26,"value":241},{"type":21,"tag":209,"props":55098,"children":55099},{"class":211,"line":2619},[55100,55104,55108,55112,55116,55120,55124,55128,55132,55136,55140,55144,55148],{"type":21,"tag":209,"props":55101,"children":55102},{"style":263},[55103],{"type":26,"value":51473},{"type":21,"tag":209,"props":55105,"children":55106},{"style":222},[55107],{"type":26,"value":51559},{"type":21,"tag":209,"props":55109,"children":55110},{"style":216},[55111],{"type":26,"value":1432},{"type":21,"tag":209,"props":55113,"children":55114},{"style":263},[55115],{"type":26,"value":17698},{"type":21,"tag":209,"props":55117,"children":55118},{"style":222},[55119],{"type":26,"value":378},{"type":21,"tag":209,"props":55121,"children":55122},{"style":360},[55123],{"type":26,"value":52155},{"type":21,"tag":209,"props":55125,"children":55126},{"style":222},[55127],{"type":26,"value":11910},{"type":21,"tag":209,"props":55129,"children":55130},{"style":360},[55131],{"type":26,"value":52164},{"type":21,"tag":209,"props":55133,"children":55134},{"style":222},[55135],{"type":26,"value":368},{"type":21,"tag":209,"props":55137,"children":55138},{"style":263},[55139],{"type":26,"value":2508},{"type":21,"tag":209,"props":55141,"children":55142},{"style":222},[55143],{"type":26,"value":46912},{"type":21,"tag":209,"props":55145,"children":55146},{"style":360},[55147],{"type":26,"value":46917},{"type":21,"tag":209,"props":55149,"children":55150},{"style":222},[55151],{"type":26,"value":52185},{"type":21,"tag":209,"props":55153,"children":55154},{"class":211,"line":2627},[55155,55159,55164,55168,55172,55176,55180,55185,55189,55194],{"type":21,"tag":209,"props":55156,"children":55157},{"style":263},[55158],{"type":26,"value":51473},{"type":21,"tag":209,"props":55160,"children":55161},{"style":222},[55162],{"type":26,"value":55163},".container.style.top ",{"type":21,"tag":209,"props":55165,"children":55166},{"style":216},[55167],{"type":26,"value":1432},{"type":21,"tag":209,"props":55169,"children":55170},{"style":263},[55171],{"type":26,"value":17698},{"type":21,"tag":209,"props":55173,"children":55174},{"style":222},[55175],{"type":26,"value":52225},{"type":21,"tag":209,"props":55177,"children":55178},{"style":216},[55179],{"type":26,"value":13012},{"type":21,"tag":209,"props":55181,"children":55182},{"style":222},[55183],{"type":26,"value":55184}," cHeight",{"type":21,"tag":209,"props":55186,"children":55187},{"style":216},[55188],{"type":26,"value":10237},{"type":21,"tag":209,"props":55190,"children":55191},{"style":233},[55192],{"type":26,"value":55193},"'px'",{"type":21,"tag":209,"props":55195,"children":55196},{"style":222},[55197],{"type":26,"value":241},{"type":21,"tag":209,"props":55199,"children":55200},{"class":211,"line":2636},[55201,55205,55210,55214,55218,55222,55226,55231,55235,55239],{"type":21,"tag":209,"props":55202,"children":55203},{"style":263},[55204],{"type":26,"value":51473},{"type":21,"tag":209,"props":55206,"children":55207},{"style":222},[55208],{"type":26,"value":55209},".container.style.left ",{"type":21,"tag":209,"props":55211,"children":55212},{"style":216},[55213],{"type":26,"value":1432},{"type":21,"tag":209,"props":55215,"children":55216},{"style":263},[55217],{"type":26,"value":17698},{"type":21,"tag":209,"props":55219,"children":55220},{"style":222},[55221],{"type":26,"value":52255},{"type":21,"tag":209,"props":55223,"children":55224},{"style":216},[55225],{"type":26,"value":13012},{"type":21,"tag":209,"props":55227,"children":55228},{"style":222},[55229],{"type":26,"value":55230}," cWidth",{"type":21,"tag":209,"props":55232,"children":55233},{"style":216},[55234],{"type":26,"value":10237},{"type":21,"tag":209,"props":55236,"children":55237},{"style":233},[55238],{"type":26,"value":55193},{"type":21,"tag":209,"props":55240,"children":55241},{"style":222},[55242],{"type":26,"value":241},{"type":21,"tag":209,"props":55244,"children":55245},{"class":211,"line":2644},[55246],{"type":21,"tag":209,"props":55247,"children":55248},{"style":222},[55249],{"type":26,"value":4850},{"type":21,"tag":209,"props":55251,"children":55252},{"class":211,"line":2657},[55253],{"type":21,"tag":209,"props":55254,"children":55255},{"style":448},[55256],{"type":26,"value":4697},{"type":21,"tag":209,"props":55258,"children":55259},{"class":211,"line":2728},[55260],{"type":21,"tag":209,"props":55261,"children":55262},{"style":448},[55263],{"type":26,"value":52293},{"type":21,"tag":209,"props":55265,"children":55266},{"class":211,"line":2758},[55267,55271,55275],{"type":21,"tag":209,"props":55268,"children":55269},{"style":448},[55270],{"type":26,"value":4713},{"type":21,"tag":209,"props":55272,"children":55273},{"style":216},[55274],{"type":26,"value":51688},{"type":21,"tag":209,"props":55276,"children":55277},{"style":360},[55278],{"type":26,"value":52309},{"type":21,"tag":209,"props":55280,"children":55281},{"class":211,"line":2776},[55282],{"type":21,"tag":209,"props":55283,"children":55284},{"style":448},[55285],{"type":26,"value":4753},{"type":21,"tag":209,"props":55287,"children":55288},{"class":211,"line":2785},[55289,55293,55297,55301,55305,55309,55313,55317],{"type":21,"tag":209,"props":55290,"children":55291},{"style":263},[55292],{"type":26,"value":51624},{"type":21,"tag":209,"props":55294,"children":55295},{"style":222},[55296],{"type":26,"value":378},{"type":21,"tag":209,"props":55298,"children":55299},{"style":263},[55300],{"type":26,"value":37016},{"type":21,"tag":209,"props":55302,"children":55303},{"style":222},[55304],{"type":26,"value":378},{"type":21,"tag":209,"props":55306,"children":55307},{"style":360},[55308],{"type":26,"value":52340},{"type":21,"tag":209,"props":55310,"children":55311},{"style":216},[55312],{"type":26,"value":271},{"type":21,"tag":209,"props":55314,"children":55315},{"style":216},[55316],{"type":26,"value":4766},{"type":21,"tag":209,"props":55318,"children":55319},{"style":222},[55320],{"type":26,"value":2561},{"type":21,"tag":209,"props":55322,"children":55323},{"class":211,"line":2793},[55324,55328,55332,55336,55340,55344],{"type":21,"tag":209,"props":55325,"children":55326},{"style":263},[55327],{"type":26,"value":51473},{"type":21,"tag":209,"props":55329,"children":55330},{"style":222},[55331],{"type":26,"value":51789},{"type":21,"tag":209,"props":55333,"children":55334},{"style":360},[55335],{"type":26,"value":9461},{"type":21,"tag":209,"props":55337,"children":55338},{"style":222},[55339],{"type":26,"value":368},{"type":21,"tag":209,"props":55341,"children":55342},{"style":263},[55343],{"type":26,"value":2508},{"type":21,"tag":209,"props":55345,"children":55346},{"style":222},[55347],{"type":26,"value":51807},{"type":21,"tag":209,"props":55349,"children":55350},{"class":211,"line":2801},[55351],{"type":21,"tag":209,"props":55352,"children":55353},{"style":222},[55354],{"type":26,"value":4850},{"type":21,"tag":209,"props":55356,"children":55357},{"class":211,"line":2809},[55358],{"type":21,"tag":209,"props":55359,"children":55360},{"style":448},[55361],{"type":26,"value":4697},{"type":21,"tag":209,"props":55363,"children":55364},{"class":211,"line":6219},[55365],{"type":21,"tag":209,"props":55366,"children":55367},{"style":448},[55368],{"type":26,"value":52394},{"type":21,"tag":209,"props":55370,"children":55371},{"class":211,"line":6228},[55372,55376,55380,55384],{"type":21,"tag":209,"props":55373,"children":55374},{"style":448},[55375],{"type":26,"value":4713},{"type":21,"tag":209,"props":55377,"children":55378},{"style":216},[55379],{"type":26,"value":4718},{"type":21,"tag":209,"props":55381,"children":55382},{"style":360},[55383],{"type":26,"value":4723},{"type":21,"tag":209,"props":55385,"children":55386},{"style":222},[55387],{"type":26,"value":52414},{"type":21,"tag":209,"props":55389,"children":55390},{"class":211,"line":6250},[55391],{"type":21,"tag":209,"props":55392,"children":55393},{"style":448},[55394],{"type":26,"value":4753},{"type":21,"tag":209,"props":55396,"children":55397},{"class":211,"line":6258},[55398,55402,55406,55410,55414,55418,55422,55426,55430,55434],{"type":21,"tag":209,"props":55399,"children":55400},{"style":263},[55401],{"type":26,"value":51624},{"type":21,"tag":209,"props":55403,"children":55404},{"style":222},[55405],{"type":26,"value":378},{"type":21,"tag":209,"props":55407,"children":55408},{"style":263},[55409],{"type":26,"value":37016},{"type":21,"tag":209,"props":55411,"children":55412},{"style":222},[55413],{"type":26,"value":378},{"type":21,"tag":209,"props":55415,"children":55416},{"style":360},[55417],{"type":26,"value":52445},{"type":21,"tag":209,"props":55419,"children":55420},{"style":216},[55421],{"type":26,"value":271},{"type":21,"tag":209,"props":55423,"children":55424},{"style":216},[55425],{"type":26,"value":4766},{"type":21,"tag":209,"props":55427,"children":55428},{"style":222},[55429],{"type":26,"value":368},{"type":21,"tag":209,"props":55431,"children":55432},{"style":400},[55433],{"type":26,"value":7949},{"type":21,"tag":209,"props":55435,"children":55436},{"style":222},[55437],{"type":26,"value":2369},{"type":21,"tag":209,"props":55439,"children":55440},{"class":211,"line":6267},[55441,55445,55450,55454],{"type":21,"tag":209,"props":55442,"children":55443},{"style":263},[55444],{"type":26,"value":51473},{"type":21,"tag":209,"props":55446,"children":55447},{"style":222},[55448],{"type":26,"value":55449},".container.innerHTML ",{"type":21,"tag":209,"props":55451,"children":55452},{"style":216},[55453],{"type":26,"value":1432},{"type":21,"tag":209,"props":55455,"children":55456},{"style":222},[55457],{"type":26,"value":55458}," html;\n",{"type":21,"tag":209,"props":55460,"children":55461},{"class":211,"line":6303},[55462],{"type":21,"tag":209,"props":55463,"children":55464},{"style":222},[55465],{"type":26,"value":4850},{"type":21,"tag":209,"props":55467,"children":55468},{"class":211,"line":6336},[55469],{"type":21,"tag":209,"props":55470,"children":55471},{"style":448},[55472],{"type":26,"value":4697},{"type":21,"tag":209,"props":55474,"children":55475},{"class":211,"line":6369},[55476],{"type":21,"tag":209,"props":55477,"children":55478},{"style":448},[55479],{"type":26,"value":52507},{"type":21,"tag":209,"props":55481,"children":55482},{"class":211,"line":6378},[55483,55487,55491,55495],{"type":21,"tag":209,"props":55484,"children":55485},{"style":448},[55486],{"type":26,"value":4713},{"type":21,"tag":209,"props":55488,"children":55489},{"style":216},[55490],{"type":26,"value":4718},{"type":21,"tag":209,"props":55492,"children":55493},{"style":360},[55494],{"type":26,"value":52523},{"type":21,"tag":209,"props":55496,"children":55497},{"style":222},[55498],{"type":26,"value":52528},{"type":21,"tag":209,"props":55500,"children":55501},{"class":211,"line":6387},[55502,55506,55510,55514],{"type":21,"tag":209,"props":55503,"children":55504},{"style":448},[55505],{"type":26,"value":4713},{"type":21,"tag":209,"props":55507,"children":55508},{"style":216},[55509],{"type":26,"value":4718},{"type":21,"tag":209,"props":55511,"children":55512},{"style":360},[55513],{"type":26,"value":52544},{"type":21,"tag":209,"props":55515,"children":55516},{"style":222},[55517],{"type":26,"value":52549},{"type":21,"tag":209,"props":55519,"children":55520},{"class":211,"line":6395},[55521],{"type":21,"tag":209,"props":55522,"children":55523},{"style":448},[55524],{"type":26,"value":4753},{"type":21,"tag":209,"props":55526,"children":55527},{"class":211,"line":6404},[55528,55532,55536,55540,55544,55548,55552,55556,55560,55564,55568,55572],{"type":21,"tag":209,"props":55529,"children":55530},{"style":263},[55531],{"type":26,"value":51624},{"type":21,"tag":209,"props":55533,"children":55534},{"style":222},[55535],{"type":26,"value":378},{"type":21,"tag":209,"props":55537,"children":55538},{"style":263},[55539],{"type":26,"value":37016},{"type":21,"tag":209,"props":55541,"children":55542},{"style":222},[55543],{"type":26,"value":378},{"type":21,"tag":209,"props":55545,"children":55546},{"style":360},[55547],{"type":26,"value":11610},{"type":21,"tag":209,"props":55549,"children":55550},{"style":216},[55551],{"type":26,"value":271},{"type":21,"tag":209,"props":55553,"children":55554},{"style":216},[55555],{"type":26,"value":4766},{"type":21,"tag":209,"props":55557,"children":55558},{"style":222},[55559],{"type":26,"value":368},{"type":21,"tag":209,"props":55561,"children":55562},{"style":400},[55563],{"type":26,"value":11972},{"type":21,"tag":209,"props":55565,"children":55566},{"style":222},[55567],{"type":26,"value":408},{"type":21,"tag":209,"props":55569,"children":55570},{"style":400},[55571],{"type":26,"value":52604},{"type":21,"tag":209,"props":55573,"children":55574},{"style":222},[55575],{"type":26,"value":2369},{"type":21,"tag":209,"props":55577,"children":55578},{"class":211,"line":6413},[55579,55583,55587,55591],{"type":21,"tag":209,"props":55580,"children":55581},{"style":263},[55582],{"type":26,"value":51473},{"type":21,"tag":209,"props":55584,"children":55585},{"style":222},[55586],{"type":26,"value":51535},{"type":21,"tag":209,"props":55588,"children":55589},{"style":216},[55590],{"type":26,"value":1432},{"type":21,"tag":209,"props":55592,"children":55593},{"style":222},[55594],{"type":26,"value":52628},{"type":21,"tag":209,"props":55596,"children":55597},{"class":211,"line":6447},[55598,55602,55606,55610],{"type":21,"tag":209,"props":55599,"children":55600},{"style":263},[55601],{"type":26,"value":51473},{"type":21,"tag":209,"props":55603,"children":55604},{"style":222},[55605],{"type":26,"value":378},{"type":21,"tag":209,"props":55607,"children":55608},{"style":360},[55609],{"type":26,"value":52644},{"type":21,"tag":209,"props":55611,"children":55612},{"style":222},[55613],{"type":26,"value":52649},{"type":21,"tag":209,"props":55615,"children":55616},{"class":211,"line":6479},[55617],{"type":21,"tag":209,"props":55618,"children":55619},{"style":222},[55620],{"type":26,"value":4850},{"type":21,"tag":209,"props":55622,"children":55623},{"class":211,"line":6511},[55624],{"type":21,"tag":209,"props":55625,"children":55626},{"style":448},[55627],{"type":26,"value":4697},{"type":21,"tag":209,"props":55629,"children":55630},{"class":211,"line":6519},[55631],{"type":21,"tag":209,"props":55632,"children":55633},{"style":448},[55634],{"type":26,"value":52671},{"type":21,"tag":209,"props":55636,"children":55637},{"class":211,"line":6527},[55638],{"type":21,"tag":209,"props":55639,"children":55640},{"style":448},[55641],{"type":26,"value":4753},{"type":21,"tag":209,"props":55643,"children":55644},{"class":211,"line":6535},[55645,55649,55653,55657,55661,55665,55669,55673],{"type":21,"tag":209,"props":55646,"children":55647},{"style":263},[55648],{"type":26,"value":51624},{"type":21,"tag":209,"props":55650,"children":55651},{"style":222},[55652],{"type":26,"value":378},{"type":21,"tag":209,"props":55654,"children":55655},{"style":263},[55656],{"type":26,"value":37016},{"type":21,"tag":209,"props":55658,"children":55659},{"style":222},[55660],{"type":26,"value":378},{"type":21,"tag":209,"props":55662,"children":55663},{"style":360},[55664],{"type":26,"value":51893},{"type":21,"tag":209,"props":55666,"children":55667},{"style":216},[55668],{"type":26,"value":271},{"type":21,"tag":209,"props":55670,"children":55671},{"style":216},[55672],{"type":26,"value":4766},{"type":21,"tag":209,"props":55674,"children":55675},{"style":222},[55676],{"type":26,"value":2561},{"type":21,"tag":209,"props":55678,"children":55679},{"class":211,"line":6543},[55680,55684,55688,55692,55696,55700],{"type":21,"tag":209,"props":55681,"children":55682},{"style":263},[55683],{"type":26,"value":51473},{"type":21,"tag":209,"props":55685,"children":55686},{"style":222},[55687],{"type":26,"value":378},{"type":21,"tag":209,"props":55689,"children":55690},{"style":360},[55691],{"type":26,"value":52644},{"type":21,"tag":209,"props":55693,"children":55694},{"style":222},[55695],{"type":26,"value":368},{"type":21,"tag":209,"props":55697,"children":55698},{"style":263},[55699],{"type":26,"value":17396},{"type":21,"tag":209,"props":55701,"children":55702},{"style":222},[55703],{"type":26,"value":2608},{"type":21,"tag":209,"props":55705,"children":55706},{"class":211,"line":6552},[55707],{"type":21,"tag":209,"props":55708,"children":55709},{"style":222},[55710],{"type":26,"value":4850},{"type":21,"tag":209,"props":55712,"children":55713},{"class":211,"line":6572},[55714,55718],{"type":21,"tag":209,"props":55715,"children":55716},{"style":216},[55717],{"type":26,"value":1298},{"type":21,"tag":209,"props":55719,"children":55720},{"style":222},[55721],{"type":26,"value":52759},{"type":21,"tag":209,"props":55723,"children":55724},{"class":211,"line":6589},[55725],{"type":21,"tag":209,"props":55726,"children":55727},{"style":222},[55728],{"type":26,"value":469},{"type":21,"tag":22,"props":55730,"children":55731},{},[55732],{"type":26,"value":55733},"That's it.",{"type":21,"tag":3490,"props":55735,"children":55736},{},[55737],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":55739},[55740,55741,55742,55743,55744,55745],{"id":50952,"depth":254,"text":50955},{"id":51333,"depth":254,"text":46837},{"id":53193,"depth":254,"text":53196},{"id":53993,"depth":254,"text":53996},{"id":54169,"depth":254,"text":54172},{"id":54294,"depth":254,"text":54297},"content:ckeefer:2014-3:customgmapsinfowindow.md","ckeefer/2014-3/customgmapsinfowindow.md","ckeefer/2014-3/customgmapsinfowindow",{"user":3518,"name":3519},{"_path":55751,"_dir":55752,"_draft":7,"_partial":7,"_locale":8,"title":55753,"description":55754,"publishDate":55755,"tags":55756,"image":55758,"excerpt":55754,"body":55759,"_type":3511,"_id":58418,"_source":3513,"_file":58419,"_stem":58420,"_extension":3516,"author":58421},"/ckeefer/2013-5/ajax-uploader","2013-5","Ajax Upload XHR2, Take 2","It's a pleasure to be able to interact with files in the browser at long last, isn't it? Reading files in without needing to bounce them against the server first opens up a lot of possibilities - and getting progress from a chunked ajax upload is miles away from the indeterminate form uploads of days past.","2014-02-19",[13804,12,55757],"xhr2","/ckeefer/2013-5/img/html5.jpg",{"type":18,"children":55760,"toc":58413},[55761,55765,55775,55789,55795,55809,55822,56352,56357,56362,56367,56372,57088,57109,57114,58365,58371,58376,58381,58387,58409],{"type":21,"tag":22,"props":55762,"children":55763},{},[55764],{"type":26,"value":55754},{"type":21,"tag":22,"props":55766,"children":55767},{},[55768,55773],{"type":21,"tag":29,"props":55769,"children":55771},{"href":55770},"/search/ajax/upload/filereader/user:ckeefer",[55772],{"type":26,"value":7347},{"type":26,"value":55774}," we touched this subject, I shared an (admittedly rough) jQuery plugin that allowed you to enjoy HTML5 ajax uploading and file reading with the familiar event interface, and convert any element into a drag-and-drop target.",{"type":21,"tag":22,"props":55776,"children":55777},{},[55778,55780,55787],{"type":26,"value":55779},"At the request of reader ",{"type":21,"tag":29,"props":55781,"children":55784},{"href":55782,"rel":55783},"https://github.com/SaneMethod/HUp/issues/1",[93],[55785],{"type":26,"value":55786},"Mateusz",{"type":26,"value":55788},", let's revisit our HUp plugin, and polish it up a little by adding a new feature - the ability to filter files to be read/uploaded by their file size, and/or their mime-type.",{"type":21,"tag":3549,"props":55790,"children":55792},{"id":55791},"filtering-by-type",[55793],{"type":26,"value":55794},"Filtering By Type",{"type":21,"tag":22,"props":55796,"children":55797},{},[55798,55800,55807],{"type":26,"value":55799},"This can get tricky, given the wide variety of files and their associated mime types. We want to be able to specify something similar to the ",{"type":21,"tag":29,"props":55801,"children":55804},{"href":55802,"rel":55803},"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Input#Specifications",[93],[55805],{"type":26,"value":55806},"accept attribute",{"type":26,"value":55808}," on file inputs - but a little looser and friendlier, allowing just the extension to be specified, with the plugin handling the hard work of mapping that to a mime-type - at least, when we know the extension.",{"type":21,"tag":22,"props":55810,"children":55811},{},[55812,55814,55820],{"type":26,"value":55813},"The logic for this is split up within ",{"type":21,"tag":63,"props":55815,"children":55817},{"className":55816},[],[55818],{"type":26,"value":55819},"hup.js",{"type":26,"value":55821},". To begin with, we need to create an array of known mime-types, and a mapping between extensions and their mime-types.",{"type":21,"tag":200,"props":55823,"children":55825},{"className":9044,"code":55824,"language":9046,"meta":8,"style":8},"var filters = {},\n    fileTypes = [];\n    /**\n    * Populate the filters and fileTypes object and array, with the former containing a mapping between\n    * file extensions and their mime types, and the latter the mimetypes themselves.\n    */\n(function(mimetypes){\n    var mimes = mimetypes.split(/,/),\n        exts = [];\n    for (var i=0, len=mimes.length; i \u003C len; i+=2)\n    {\n        fileTypes.push(mimes[i]);\n        exts = mimes[i+1].split(/ /);\n        for (var j=0, jlen = exts.length; j \u003C jlen; j++)\n        {\n            filters[exts[j]] = mimes[i];\n        }\n    }\n})(\n        \"application/msword,doc dot,application/pdf,pdf,application/pgp-signature,pgp,application/postscript,\" +\n        \"ps ai eps,application/rtf,rtf,application/vnd.ms-excel,xls xlb,application/vnd.ms-powerpoint,\" +\n        \"ppt pps pot,application/zip,zip,application/x-shockwave-flash,swf swfl,application/x-javascript,js,\" +\n        \"application/json,json,audio/mpeg,mpga mpega mp2 mp3,audio/x-wav,wav,audio/mp4,m4a,image/bmp,bmp,\" +\n        \"image/gif,gif,image/jpeg,jpeg jpg jpe,image/photoshop,psd,image/png,png,image/svg+xml,svg svgz,\" +\n        \"image/tiff,tiff tif,text/plain,asc txt text diff log,text/html,htm html xhtml,text/css,css,text/csv,\" +\n        \"csv,text/rtf,rtf,video/mpeg,mpeg mpg mpe m2v,video/quicktime,qt mov,video/mp4,mp4,video/x-m4v,m4v,\" +\n        \"video/x-flv,flv,video/x-ms-wmv,wmv,video/avi,avi,video/webm,webm,video/3gpp,3gp,video/3gpp2,3g2,\" +\n        \"application/octet-stream,exe\"\n    );\n",[55826],{"type":21,"tag":63,"props":55827,"children":55828},{"__ignoreMap":8},[55829,55849,55866,55873,55881,55889,55896,55920,55966,55982,56053,56060,56078,56127,56195,56202,56219,56226,56233,56241,56253,56265,56277,56289,56301,56313,56325,56337,56345],{"type":21,"tag":209,"props":55830,"children":55831},{"class":211,"line":212},[55832,55836,55841,55845],{"type":21,"tag":209,"props":55833,"children":55834},{"style":216},[55835],{"type":26,"value":8996},{"type":21,"tag":209,"props":55837,"children":55838},{"style":222},[55839],{"type":26,"value":55840}," filters ",{"type":21,"tag":209,"props":55842,"children":55843},{"style":216},[55844],{"type":26,"value":1432},{"type":21,"tag":209,"props":55846,"children":55847},{"style":222},[55848],{"type":26,"value":47144},{"type":21,"tag":209,"props":55850,"children":55851},{"class":211,"line":244},[55852,55857,55861],{"type":21,"tag":209,"props":55853,"children":55854},{"style":222},[55855],{"type":26,"value":55856},"    fileTypes ",{"type":21,"tag":209,"props":55858,"children":55859},{"style":216},[55860],{"type":26,"value":1432},{"type":21,"tag":209,"props":55862,"children":55863},{"style":222},[55864],{"type":26,"value":55865}," [];\n",{"type":21,"tag":209,"props":55867,"children":55868},{"class":211,"line":254},[55869],{"type":21,"tag":209,"props":55870,"children":55871},{"style":448},[55872],{"type":26,"value":4697},{"type":21,"tag":209,"props":55874,"children":55875},{"class":211,"line":279},[55876],{"type":21,"tag":209,"props":55877,"children":55878},{"style":448},[55879],{"type":26,"value":55880},"    * Populate the filters and fileTypes object and array, with the former containing a mapping between\n",{"type":21,"tag":209,"props":55882,"children":55883},{"class":211,"line":288},[55884],{"type":21,"tag":209,"props":55885,"children":55886},{"style":448},[55887],{"type":26,"value":55888},"    * file extensions and their mime types, and the latter the mimetypes themselves.\n",{"type":21,"tag":209,"props":55890,"children":55891},{"class":211,"line":307},[55892],{"type":21,"tag":209,"props":55893,"children":55894},{"style":448},[55895],{"type":26,"value":14136},{"type":21,"tag":209,"props":55897,"children":55898},{"class":211,"line":325},[55899,55903,55907,55911,55916],{"type":21,"tag":209,"props":55900,"children":55901},{"style":222},[55902],{"type":26,"value":368},{"type":21,"tag":209,"props":55904,"children":55905},{"style":216},[55906],{"type":26,"value":5370},{"type":21,"tag":209,"props":55908,"children":55909},{"style":222},[55910],{"type":26,"value":368},{"type":21,"tag":209,"props":55912,"children":55913},{"style":400},[55914],{"type":26,"value":55915},"mimetypes",{"type":21,"tag":209,"props":55917,"children":55918},{"style":222},[55919],{"type":26,"value":2369},{"type":21,"tag":209,"props":55921,"children":55922},{"class":211,"line":334},[55923,55927,55932,55936,55941,55945,55949,55953,55958,55962],{"type":21,"tag":209,"props":55924,"children":55925},{"style":216},[55926],{"type":26,"value":10405},{"type":21,"tag":209,"props":55928,"children":55929},{"style":222},[55930],{"type":26,"value":55931}," mimes ",{"type":21,"tag":209,"props":55933,"children":55934},{"style":216},[55935],{"type":26,"value":1432},{"type":21,"tag":209,"props":55937,"children":55938},{"style":222},[55939],{"type":26,"value":55940}," mimetypes.",{"type":21,"tag":209,"props":55942,"children":55943},{"style":360},[55944],{"type":26,"value":36423},{"type":21,"tag":209,"props":55946,"children":55947},{"style":222},[55948],{"type":26,"value":368},{"type":21,"tag":209,"props":55950,"children":55951},{"style":233},[55952],{"type":26,"value":9749},{"type":21,"tag":209,"props":55954,"children":55955},{"style":10204},[55956],{"type":26,"value":55957},",",{"type":21,"tag":209,"props":55959,"children":55960},{"style":233},[55961],{"type":26,"value":9749},{"type":21,"tag":209,"props":55963,"children":55964},{"style":222},[55965],{"type":26,"value":10277},{"type":21,"tag":209,"props":55967,"children":55968},{"class":211,"line":343},[55969,55974,55978],{"type":21,"tag":209,"props":55970,"children":55971},{"style":222},[55972],{"type":26,"value":55973},"        exts ",{"type":21,"tag":209,"props":55975,"children":55976},{"style":216},[55977],{"type":26,"value":1432},{"type":21,"tag":209,"props":55979,"children":55980},{"style":222},[55981],{"type":26,"value":55865},{"type":21,"tag":209,"props":55983,"children":55984},{"class":211,"line":351},[55985,55990,55994,55998,56002,56006,56010,56015,56019,56024,56028,56032,56036,56041,56045,56049],{"type":21,"tag":209,"props":55986,"children":55987},{"style":216},[55988],{"type":26,"value":55989},"    for",{"type":21,"tag":209,"props":55991,"children":55992},{"style":222},[55993],{"type":26,"value":4776},{"type":21,"tag":209,"props":55995,"children":55996},{"style":216},[55997],{"type":26,"value":8996},{"type":21,"tag":209,"props":55999,"children":56000},{"style":222},[56001],{"type":26,"value":36621},{"type":21,"tag":209,"props":56003,"children":56004},{"style":216},[56005],{"type":26,"value":1432},{"type":21,"tag":209,"props":56007,"children":56008},{"style":263},[56009],{"type":26,"value":6048},{"type":21,"tag":209,"props":56011,"children":56012},{"style":222},[56013],{"type":26,"value":56014},", len",{"type":21,"tag":209,"props":56016,"children":56017},{"style":216},[56018],{"type":26,"value":1432},{"type":21,"tag":209,"props":56020,"children":56021},{"style":222},[56022],{"type":26,"value":56023},"mimes.",{"type":21,"tag":209,"props":56025,"children":56026},{"style":263},[56027],{"type":26,"value":36467},{"type":21,"tag":209,"props":56029,"children":56030},{"style":222},[56031],{"type":26,"value":36647},{"type":21,"tag":209,"props":56033,"children":56034},{"style":216},[56035],{"type":26,"value":1985},{"type":21,"tag":209,"props":56037,"children":56038},{"style":222},[56039],{"type":26,"value":56040}," len; i",{"type":21,"tag":209,"props":56042,"children":56043},{"style":216},[56044],{"type":26,"value":13131},{"type":21,"tag":209,"props":56046,"children":56047},{"style":263},[56048],{"type":26,"value":3233},{"type":21,"tag":209,"props":56050,"children":56051},{"style":222},[56052],{"type":26,"value":10112},{"type":21,"tag":209,"props":56054,"children":56055},{"class":211,"line":444},[56056],{"type":21,"tag":209,"props":56057,"children":56058},{"style":222},[56059],{"type":26,"value":37029},{"type":21,"tag":209,"props":56061,"children":56062},{"class":211,"line":454},[56063,56068,56073],{"type":21,"tag":209,"props":56064,"children":56065},{"style":222},[56066],{"type":26,"value":56067},"        fileTypes.",{"type":21,"tag":209,"props":56069,"children":56070},{"style":360},[56071],{"type":26,"value":56072},"push",{"type":21,"tag":209,"props":56074,"children":56075},{"style":222},[56076],{"type":26,"value":56077},"(mimes[i]);\n",{"type":21,"tag":209,"props":56079,"children":56080},{"class":211,"line":463},[56081,56085,56089,56094,56098,56102,56106,56110,56114,56118,56123],{"type":21,"tag":209,"props":56082,"children":56083},{"style":222},[56084],{"type":26,"value":55973},{"type":21,"tag":209,"props":56086,"children":56087},{"style":216},[56088],{"type":26,"value":1432},{"type":21,"tag":209,"props":56090,"children":56091},{"style":222},[56092],{"type":26,"value":56093}," mimes[i",{"type":21,"tag":209,"props":56095,"children":56096},{"style":216},[56097],{"type":26,"value":10237},{"type":21,"tag":209,"props":56099,"children":56100},{"style":263},[56101],{"type":26,"value":3224},{"type":21,"tag":209,"props":56103,"children":56104},{"style":222},[56105],{"type":26,"value":54820},{"type":21,"tag":209,"props":56107,"children":56108},{"style":360},[56109],{"type":26,"value":36423},{"type":21,"tag":209,"props":56111,"children":56112},{"style":222},[56113],{"type":26,"value":368},{"type":21,"tag":209,"props":56115,"children":56116},{"style":233},[56117],{"type":26,"value":9749},{"type":21,"tag":209,"props":56119,"children":56120},{"style":233},[56121],{"type":26,"value":56122}," /",{"type":21,"tag":209,"props":56124,"children":56125},{"style":222},[56126],{"type":26,"value":2608},{"type":21,"tag":209,"props":56128,"children":56129},{"class":211,"line":472},[56130,56134,56138,56142,56147,56151,56155,56160,56164,56169,56173,56178,56182,56187,56191],{"type":21,"tag":209,"props":56131,"children":56132},{"style":216},[56133],{"type":26,"value":36608},{"type":21,"tag":209,"props":56135,"children":56136},{"style":222},[56137],{"type":26,"value":4776},{"type":21,"tag":209,"props":56139,"children":56140},{"style":216},[56141],{"type":26,"value":8996},{"type":21,"tag":209,"props":56143,"children":56144},{"style":222},[56145],{"type":26,"value":56146}," j",{"type":21,"tag":209,"props":56148,"children":56149},{"style":216},[56150],{"type":26,"value":1432},{"type":21,"tag":209,"props":56152,"children":56153},{"style":263},[56154],{"type":26,"value":6048},{"type":21,"tag":209,"props":56156,"children":56157},{"style":222},[56158],{"type":26,"value":56159},", jlen ",{"type":21,"tag":209,"props":56161,"children":56162},{"style":216},[56163],{"type":26,"value":1432},{"type":21,"tag":209,"props":56165,"children":56166},{"style":222},[56167],{"type":26,"value":56168}," exts.",{"type":21,"tag":209,"props":56170,"children":56171},{"style":263},[56172],{"type":26,"value":36467},{"type":21,"tag":209,"props":56174,"children":56175},{"style":222},[56176],{"type":26,"value":56177},"; j ",{"type":21,"tag":209,"props":56179,"children":56180},{"style":216},[56181],{"type":26,"value":1985},{"type":21,"tag":209,"props":56183,"children":56184},{"style":222},[56185],{"type":26,"value":56186}," jlen; j",{"type":21,"tag":209,"props":56188,"children":56189},{"style":216},[56190],{"type":26,"value":36661},{"type":21,"tag":209,"props":56192,"children":56193},{"style":222},[56194],{"type":26,"value":10112},{"type":21,"tag":209,"props":56196,"children":56197},{"class":211,"line":480},[56198],{"type":21,"tag":209,"props":56199,"children":56200},{"style":222},[56201],{"type":26,"value":7561},{"type":21,"tag":209,"props":56203,"children":56204},{"class":211,"line":489},[56205,56210,56214],{"type":21,"tag":209,"props":56206,"children":56207},{"style":222},[56208],{"type":26,"value":56209},"            filters[exts[j]] ",{"type":21,"tag":209,"props":56211,"children":56212},{"style":216},[56213],{"type":26,"value":1432},{"type":21,"tag":209,"props":56215,"children":56216},{"style":222},[56217],{"type":26,"value":56218}," mimes[i];\n",{"type":21,"tag":209,"props":56220,"children":56221},{"class":211,"line":847},[56222],{"type":21,"tag":209,"props":56223,"children":56224},{"style":222},[56225],{"type":26,"value":2235},{"type":21,"tag":209,"props":56227,"children":56228},{"class":211,"line":860},[56229],{"type":21,"tag":209,"props":56230,"children":56231},{"style":222},[56232],{"type":26,"value":331},{"type":21,"tag":209,"props":56234,"children":56235},{"class":211,"line":877},[56236],{"type":21,"tag":209,"props":56237,"children":56238},{"style":222},[56239],{"type":26,"value":56240},"})(\n",{"type":21,"tag":209,"props":56242,"children":56243},{"class":211,"line":889},[56244,56249],{"type":21,"tag":209,"props":56245,"children":56246},{"style":233},[56247],{"type":26,"value":56248},"        \"application/msword,doc dot,application/pdf,pdf,application/pgp-signature,pgp,application/postscript,\"",{"type":21,"tag":209,"props":56250,"children":56251},{"style":216},[56252],{"type":26,"value":15642},{"type":21,"tag":209,"props":56254,"children":56255},{"class":211,"line":902},[56256,56261],{"type":21,"tag":209,"props":56257,"children":56258},{"style":233},[56259],{"type":26,"value":56260},"        \"ps ai eps,application/rtf,rtf,application/vnd.ms-excel,xls xlb,application/vnd.ms-powerpoint,\"",{"type":21,"tag":209,"props":56262,"children":56263},{"style":216},[56264],{"type":26,"value":15642},{"type":21,"tag":209,"props":56266,"children":56267},{"class":211,"line":914},[56268,56273],{"type":21,"tag":209,"props":56269,"children":56270},{"style":233},[56271],{"type":26,"value":56272},"        \"ppt pps pot,application/zip,zip,application/x-shockwave-flash,swf swfl,application/x-javascript,js,\"",{"type":21,"tag":209,"props":56274,"children":56275},{"style":216},[56276],{"type":26,"value":15642},{"type":21,"tag":209,"props":56278,"children":56279},{"class":211,"line":922},[56280,56285],{"type":21,"tag":209,"props":56281,"children":56282},{"style":233},[56283],{"type":26,"value":56284},"        \"application/json,json,audio/mpeg,mpga mpega mp2 mp3,audio/x-wav,wav,audio/mp4,m4a,image/bmp,bmp,\"",{"type":21,"tag":209,"props":56286,"children":56287},{"style":216},[56288],{"type":26,"value":15642},{"type":21,"tag":209,"props":56290,"children":56291},{"class":211,"line":2312},[56292,56297],{"type":21,"tag":209,"props":56293,"children":56294},{"style":233},[56295],{"type":26,"value":56296},"        \"image/gif,gif,image/jpeg,jpeg jpg jpe,image/photoshop,psd,image/png,png,image/svg+xml,svg svgz,\"",{"type":21,"tag":209,"props":56298,"children":56299},{"style":216},[56300],{"type":26,"value":15642},{"type":21,"tag":209,"props":56302,"children":56303},{"class":211,"line":2321},[56304,56309],{"type":21,"tag":209,"props":56305,"children":56306},{"style":233},[56307],{"type":26,"value":56308},"        \"image/tiff,tiff tif,text/plain,asc txt text diff log,text/html,htm html xhtml,text/css,css,text/csv,\"",{"type":21,"tag":209,"props":56310,"children":56311},{"style":216},[56312],{"type":26,"value":15642},{"type":21,"tag":209,"props":56314,"children":56315},{"class":211,"line":2372},[56316,56321],{"type":21,"tag":209,"props":56317,"children":56318},{"style":233},[56319],{"type":26,"value":56320},"        \"csv,text/rtf,rtf,video/mpeg,mpeg mpg mpe m2v,video/quicktime,qt mov,video/mp4,mp4,video/x-m4v,m4v,\"",{"type":21,"tag":209,"props":56322,"children":56323},{"style":216},[56324],{"type":26,"value":15642},{"type":21,"tag":209,"props":56326,"children":56327},{"class":211,"line":2381},[56328,56333],{"type":21,"tag":209,"props":56329,"children":56330},{"style":233},[56331],{"type":26,"value":56332},"        \"video/x-flv,flv,video/x-ms-wmv,wmv,video/avi,avi,video/webm,webm,video/3gpp,3gp,video/3gpp2,3g2,\"",{"type":21,"tag":209,"props":56334,"children":56335},{"style":216},[56336],{"type":26,"value":15642},{"type":21,"tag":209,"props":56338,"children":56339},{"class":211,"line":2389},[56340],{"type":21,"tag":209,"props":56341,"children":56342},{"style":233},[56343],{"type":26,"value":56344},"        \"application/octet-stream,exe\"\n",{"type":21,"tag":209,"props":56346,"children":56347},{"class":211,"line":2397},[56348],{"type":21,"tag":209,"props":56349,"children":56350},{"style":222},[56351],{"type":26,"value":11739},{"type":21,"tag":22,"props":56353,"children":56354},{},[56355],{"type":26,"value":56356},"You're probably wincing a bit at the two var declarations at the top, but remember this is in a closure - those aren't global, they're local to the closure. The function that populates the array and object will run once, when the plugin closure itself first executes.",{"type":21,"tag":22,"props":56358,"children":56359},{},[56360],{"type":26,"value":56361},"So what's happening here? We have a mixed comma and space delimited list of known mime-types and extensions, with the extensions always next to their relevant mime-type. We first split the list on commas and push the first element (the mime-type), to our fileTypes array. Then, we split the i+1 element (the file extensions) on space, and create a key for each of the extensions with the value the mime-type.",{"type":21,"tag":22,"props":56363,"children":56364},{},[56365],{"type":26,"value":56366},"Why build our array and object from a string like this, instead of just specifying them statically? Well, besides the advantage of being able to build two objects for the price of one (that is, both the array and filter), this allows for easy editing and extension of our admittedly incomplete mime-type and file extension list. Need to add another file extension that should be considered application/octet-stream? Just add a space and the new extension next to exe there. Want to have .md files considered as text/plain? Just drop the extension in next to log.",{"type":21,"tag":22,"props":56368,"children":56369},{},[56370],{"type":26,"value":56371},"Next, when the plugin is called on an element with accept set in its options:",{"type":21,"tag":200,"props":56373,"children":56375},{"className":9044,"code":56374,"language":9046,"meta":8,"style":8},"/**\n* Translate the accept string or array into an array of mime types, based on the mime types in filters.\n* Input should look like the expected extensions:\n* \"swf, wmv, mp4\" or ['swf', 'wmv', 'mp4']\n* Or like mime type categories, or the mime types themselves:\n* \"application/*, application/pdf\" or ['image/\u003Cem>', 'plain/text']\n* @param {array|string} accept\n*/\nHup.prototype.acceptFilters = function(accept){\n    var mimes = [];\n    // Ensure accept is an array of extensions or mime types\n    if (typeof accept === 'string' || accept instanceof String)\n    {\n        accept = accept.split(/,/);\n    }\n    for (var i=0, len = accept.length; i \u003C len; i++)\n    {\n        var mime = accept[i].trim().split(///);\n        if (mime.length > 1)\n        {\n            if (mime[1] === '\u003C/em>')\n            {\n                // Every mime-type that begins with mime[0] now needs to be pushed into the mimes array\n                for (var j=0, jlen = fileTypes.length; j \u003C jlen; j++)\n                {\n                    var fileType = fileTypes[j].split(///);\n                    if (mime[0] === fileType[0]) mimes.push(fileTypes[j]);\n                }\n            } else {\n                // Pass the mime type through unmolested\n                mimes.push(mime.join('/'));\n            }\n        } else {\n            // Only an extension has been specified - map to the mime type\n            if (mime[0] in filters) mimes.push(filters[mime[0]]);\n        }\n    }\n    return mimes;\n};\n",[56376],{"type":21,"tag":63,"props":56377,"children":56378},{"__ignoreMap":8},[56379,56386,56394,56402,56410,56418,56426,56448,56455,56501,56520,56528,56578,56585,56626,56633,56697,56704,56746,56775,56782,56820,56827,56835,56900,56908,56942,56989,56996,57004,57012,57028,57035,57043,57051,57059,57066,57073,57081],{"type":21,"tag":209,"props":56380,"children":56381},{"class":211,"line":212},[56382],{"type":21,"tag":209,"props":56383,"children":56384},{"style":448},[56385],{"type":26,"value":731},{"type":21,"tag":209,"props":56387,"children":56388},{"class":211,"line":244},[56389],{"type":21,"tag":209,"props":56390,"children":56391},{"style":448},[56392],{"type":26,"value":56393},"* Translate the accept string or array into an array of mime types, based on the mime types in filters.\n",{"type":21,"tag":209,"props":56395,"children":56396},{"class":211,"line":254},[56397],{"type":21,"tag":209,"props":56398,"children":56399},{"style":448},[56400],{"type":26,"value":56401},"* Input should look like the expected extensions:\n",{"type":21,"tag":209,"props":56403,"children":56404},{"class":211,"line":279},[56405],{"type":21,"tag":209,"props":56406,"children":56407},{"style":448},[56408],{"type":26,"value":56409},"* \"swf, wmv, mp4\" or ['swf', 'wmv', 'mp4']\n",{"type":21,"tag":209,"props":56411,"children":56412},{"class":211,"line":288},[56413],{"type":21,"tag":209,"props":56414,"children":56415},{"style":448},[56416],{"type":26,"value":56417},"* Or like mime type categories, or the mime types themselves:\n",{"type":21,"tag":209,"props":56419,"children":56420},{"class":211,"line":307},[56421],{"type":21,"tag":209,"props":56422,"children":56423},{"style":448},[56424],{"type":26,"value":56425},"* \"application/*, application/pdf\" or ['image/\u003Cem>', 'plain/text']\n",{"type":21,"tag":209,"props":56427,"children":56428},{"class":211,"line":325},[56429,56434,56438,56443],{"type":21,"tag":209,"props":56430,"children":56431},{"style":448},[56432],{"type":26,"value":56433},"* ",{"type":21,"tag":209,"props":56435,"children":56436},{"style":216},[56437],{"type":26,"value":4718},{"type":21,"tag":209,"props":56439,"children":56440},{"style":360},[56441],{"type":26,"value":56442}," {array|string}",{"type":21,"tag":209,"props":56444,"children":56445},{"style":222},[56446],{"type":26,"value":56447}," accept\n",{"type":21,"tag":209,"props":56449,"children":56450},{"class":211,"line":334},[56451],{"type":21,"tag":209,"props":56452,"children":56453},{"style":448},[56454],{"type":26,"value":51174},{"type":21,"tag":209,"props":56456,"children":56457},{"class":211,"line":343},[56458,56463,56467,56471,56475,56480,56484,56488,56492,56497],{"type":21,"tag":209,"props":56459,"children":56460},{"style":263},[56461],{"type":26,"value":56462},"Hup",{"type":21,"tag":209,"props":56464,"children":56465},{"style":222},[56466],{"type":26,"value":378},{"type":21,"tag":209,"props":56468,"children":56469},{"style":263},[56470],{"type":26,"value":37016},{"type":21,"tag":209,"props":56472,"children":56473},{"style":222},[56474],{"type":26,"value":378},{"type":21,"tag":209,"props":56476,"children":56477},{"style":360},[56478],{"type":26,"value":56479},"acceptFilters",{"type":21,"tag":209,"props":56481,"children":56482},{"style":216},[56483],{"type":26,"value":271},{"type":21,"tag":209,"props":56485,"children":56486},{"style":216},[56487],{"type":26,"value":4766},{"type":21,"tag":209,"props":56489,"children":56490},{"style":222},[56491],{"type":26,"value":368},{"type":21,"tag":209,"props":56493,"children":56494},{"style":400},[56495],{"type":26,"value":56496},"accept",{"type":21,"tag":209,"props":56498,"children":56499},{"style":222},[56500],{"type":26,"value":2369},{"type":21,"tag":209,"props":56502,"children":56503},{"class":211,"line":351},[56504,56508,56512,56516],{"type":21,"tag":209,"props":56505,"children":56506},{"style":216},[56507],{"type":26,"value":10405},{"type":21,"tag":209,"props":56509,"children":56510},{"style":222},[56511],{"type":26,"value":55931},{"type":21,"tag":209,"props":56513,"children":56514},{"style":216},[56515],{"type":26,"value":1432},{"type":21,"tag":209,"props":56517,"children":56518},{"style":222},[56519],{"type":26,"value":55865},{"type":21,"tag":209,"props":56521,"children":56522},{"class":211,"line":444},[56523],{"type":21,"tag":209,"props":56524,"children":56525},{"style":448},[56526],{"type":26,"value":56527},"    // Ensure accept is an array of extensions or mime types\n",{"type":21,"tag":209,"props":56529,"children":56530},{"class":211,"line":454},[56531,56535,56539,56543,56548,56552,56557,56561,56565,56569,56574],{"type":21,"tag":209,"props":56532,"children":56533},{"style":216},[56534],{"type":26,"value":10853},{"type":21,"tag":209,"props":56536,"children":56537},{"style":222},[56538],{"type":26,"value":4776},{"type":21,"tag":209,"props":56540,"children":56541},{"style":216},[56542],{"type":26,"value":6092},{"type":21,"tag":209,"props":56544,"children":56545},{"style":222},[56546],{"type":26,"value":56547}," accept ",{"type":21,"tag":209,"props":56549,"children":56550},{"style":216},[56551],{"type":26,"value":6102},{"type":21,"tag":209,"props":56553,"children":56554},{"style":233},[56555],{"type":26,"value":56556}," 'string'",{"type":21,"tag":209,"props":56558,"children":56559},{"style":216},[56560],{"type":26,"value":18721},{"type":21,"tag":209,"props":56562,"children":56563},{"style":222},[56564],{"type":26,"value":56547},{"type":21,"tag":209,"props":56566,"children":56567},{"style":216},[56568],{"type":26,"value":49963},{"type":21,"tag":209,"props":56570,"children":56571},{"style":360},[56572],{"type":26,"value":56573}," String",{"type":21,"tag":209,"props":56575,"children":56576},{"style":222},[56577],{"type":26,"value":10112},{"type":21,"tag":209,"props":56579,"children":56580},{"class":211,"line":463},[56581],{"type":21,"tag":209,"props":56582,"children":56583},{"style":222},[56584],{"type":26,"value":37029},{"type":21,"tag":209,"props":56586,"children":56587},{"class":211,"line":472},[56588,56593,56597,56602,56606,56610,56614,56618,56622],{"type":21,"tag":209,"props":56589,"children":56590},{"style":222},[56591],{"type":26,"value":56592},"        accept ",{"type":21,"tag":209,"props":56594,"children":56595},{"style":216},[56596],{"type":26,"value":1432},{"type":21,"tag":209,"props":56598,"children":56599},{"style":222},[56600],{"type":26,"value":56601}," accept.",{"type":21,"tag":209,"props":56603,"children":56604},{"style":360},[56605],{"type":26,"value":36423},{"type":21,"tag":209,"props":56607,"children":56608},{"style":222},[56609],{"type":26,"value":368},{"type":21,"tag":209,"props":56611,"children":56612},{"style":233},[56613],{"type":26,"value":9749},{"type":21,"tag":209,"props":56615,"children":56616},{"style":10204},[56617],{"type":26,"value":55957},{"type":21,"tag":209,"props":56619,"children":56620},{"style":233},[56621],{"type":26,"value":9749},{"type":21,"tag":209,"props":56623,"children":56624},{"style":222},[56625],{"type":26,"value":2608},{"type":21,"tag":209,"props":56627,"children":56628},{"class":211,"line":480},[56629],{"type":21,"tag":209,"props":56630,"children":56631},{"style":222},[56632],{"type":26,"value":331},{"type":21,"tag":209,"props":56634,"children":56635},{"class":211,"line":489},[56636,56640,56644,56648,56652,56656,56660,56665,56669,56673,56677,56681,56685,56689,56693],{"type":21,"tag":209,"props":56637,"children":56638},{"style":216},[56639],{"type":26,"value":55989},{"type":21,"tag":209,"props":56641,"children":56642},{"style":222},[56643],{"type":26,"value":4776},{"type":21,"tag":209,"props":56645,"children":56646},{"style":216},[56647],{"type":26,"value":8996},{"type":21,"tag":209,"props":56649,"children":56650},{"style":222},[56651],{"type":26,"value":36621},{"type":21,"tag":209,"props":56653,"children":56654},{"style":216},[56655],{"type":26,"value":1432},{"type":21,"tag":209,"props":56657,"children":56658},{"style":263},[56659],{"type":26,"value":6048},{"type":21,"tag":209,"props":56661,"children":56662},{"style":222},[56663],{"type":26,"value":56664},", len ",{"type":21,"tag":209,"props":56666,"children":56667},{"style":216},[56668],{"type":26,"value":1432},{"type":21,"tag":209,"props":56670,"children":56671},{"style":222},[56672],{"type":26,"value":56601},{"type":21,"tag":209,"props":56674,"children":56675},{"style":263},[56676],{"type":26,"value":36467},{"type":21,"tag":209,"props":56678,"children":56679},{"style":222},[56680],{"type":26,"value":36647},{"type":21,"tag":209,"props":56682,"children":56683},{"style":216},[56684],{"type":26,"value":1985},{"type":21,"tag":209,"props":56686,"children":56687},{"style":222},[56688],{"type":26,"value":56040},{"type":21,"tag":209,"props":56690,"children":56691},{"style":216},[56692],{"type":26,"value":36661},{"type":21,"tag":209,"props":56694,"children":56695},{"style":222},[56696],{"type":26,"value":10112},{"type":21,"tag":209,"props":56698,"children":56699},{"class":211,"line":847},[56700],{"type":21,"tag":209,"props":56701,"children":56702},{"style":222},[56703],{"type":26,"value":37029},{"type":21,"tag":209,"props":56705,"children":56706},{"class":211,"line":860},[56707,56711,56716,56720,56725,56729,56733,56737,56741],{"type":21,"tag":209,"props":56708,"children":56709},{"style":216},[56710],{"type":26,"value":5925},{"type":21,"tag":209,"props":56712,"children":56713},{"style":222},[56714],{"type":26,"value":56715}," mime ",{"type":21,"tag":209,"props":56717,"children":56718},{"style":216},[56719],{"type":26,"value":1432},{"type":21,"tag":209,"props":56721,"children":56722},{"style":222},[56723],{"type":26,"value":56724}," accept[i].",{"type":21,"tag":209,"props":56726,"children":56727},{"style":360},[56728],{"type":26,"value":42335},{"type":21,"tag":209,"props":56730,"children":56731},{"style":222},[56732],{"type":26,"value":11910},{"type":21,"tag":209,"props":56734,"children":56735},{"style":360},[56736],{"type":26,"value":36423},{"type":21,"tag":209,"props":56738,"children":56739},{"style":222},[56740],{"type":26,"value":368},{"type":21,"tag":209,"props":56742,"children":56743},{"style":448},[56744],{"type":26,"value":56745},"///);\n",{"type":21,"tag":209,"props":56747,"children":56748},{"class":211,"line":877},[56749,56753,56758,56762,56767,56771],{"type":21,"tag":209,"props":56750,"children":56751},{"style":360},[56752],{"type":26,"value":5803},{"type":21,"tag":209,"props":56754,"children":56755},{"style":222},[56756],{"type":26,"value":56757}," (mime.",{"type":21,"tag":209,"props":56759,"children":56760},{"style":263},[56761],{"type":26,"value":36467},{"type":21,"tag":209,"props":56763,"children":56764},{"style":216},[56765],{"type":26,"value":56766}," >",{"type":21,"tag":209,"props":56768,"children":56769},{"style":263},[56770],{"type":26,"value":11271},{"type":21,"tag":209,"props":56772,"children":56773},{"style":222},[56774],{"type":26,"value":10112},{"type":21,"tag":209,"props":56776,"children":56777},{"class":211,"line":889},[56778],{"type":21,"tag":209,"props":56779,"children":56780},{"style":222},[56781],{"type":26,"value":7561},{"type":21,"tag":209,"props":56783,"children":56784},{"class":211,"line":902},[56785,56789,56793,56798,56802,56806,56811,56816],{"type":21,"tag":209,"props":56786,"children":56787},{"style":360},[56788],{"type":26,"value":6083},{"type":21,"tag":209,"props":56790,"children":56791},{"style":222},[56792],{"type":26,"value":4776},{"type":21,"tag":209,"props":56794,"children":56795},{"style":400},[56796],{"type":26,"value":56797},"mime",{"type":21,"tag":209,"props":56799,"children":56800},{"style":222},[56801],{"type":26,"value":29977},{"type":21,"tag":209,"props":56803,"children":56804},{"style":263},[56805],{"type":26,"value":3224},{"type":21,"tag":209,"props":56807,"children":56808},{"style":222},[56809],{"type":26,"value":56810},"] === ",{"type":21,"tag":209,"props":56812,"children":56813},{"style":233},[56814],{"type":26,"value":56815},"'\u003C/em>'",{"type":21,"tag":209,"props":56817,"children":56818},{"style":222},[56819],{"type":26,"value":10112},{"type":21,"tag":209,"props":56821,"children":56822},{"class":211,"line":914},[56823],{"type":21,"tag":209,"props":56824,"children":56825},{"style":222},[56826],{"type":26,"value":16576},{"type":21,"tag":209,"props":56828,"children":56829},{"class":211,"line":922},[56830],{"type":21,"tag":209,"props":56831,"children":56832},{"style":448},[56833],{"type":26,"value":56834},"                // Every mime-type that begins with mime[0] now needs to be pushed into the mimes array\n",{"type":21,"tag":209,"props":56836,"children":56837},{"class":211,"line":2312},[56838,56843,56847,56851,56855,56859,56863,56867,56871,56876,56880,56884,56888,56892,56896],{"type":21,"tag":209,"props":56839,"children":56840},{"style":216},[56841],{"type":26,"value":56842},"                for",{"type":21,"tag":209,"props":56844,"children":56845},{"style":222},[56846],{"type":26,"value":4776},{"type":21,"tag":209,"props":56848,"children":56849},{"style":216},[56850],{"type":26,"value":8996},{"type":21,"tag":209,"props":56852,"children":56853},{"style":222},[56854],{"type":26,"value":56146},{"type":21,"tag":209,"props":56856,"children":56857},{"style":216},[56858],{"type":26,"value":1432},{"type":21,"tag":209,"props":56860,"children":56861},{"style":263},[56862],{"type":26,"value":6048},{"type":21,"tag":209,"props":56864,"children":56865},{"style":222},[56866],{"type":26,"value":56159},{"type":21,"tag":209,"props":56868,"children":56869},{"style":216},[56870],{"type":26,"value":1432},{"type":21,"tag":209,"props":56872,"children":56873},{"style":222},[56874],{"type":26,"value":56875}," fileTypes.",{"type":21,"tag":209,"props":56877,"children":56878},{"style":263},[56879],{"type":26,"value":36467},{"type":21,"tag":209,"props":56881,"children":56882},{"style":222},[56883],{"type":26,"value":56177},{"type":21,"tag":209,"props":56885,"children":56886},{"style":216},[56887],{"type":26,"value":1985},{"type":21,"tag":209,"props":56889,"children":56890},{"style":222},[56891],{"type":26,"value":56186},{"type":21,"tag":209,"props":56893,"children":56894},{"style":216},[56895],{"type":26,"value":36661},{"type":21,"tag":209,"props":56897,"children":56898},{"style":222},[56899],{"type":26,"value":10112},{"type":21,"tag":209,"props":56901,"children":56902},{"class":211,"line":2321},[56903],{"type":21,"tag":209,"props":56904,"children":56905},{"style":222},[56906],{"type":26,"value":56907},"                {\n",{"type":21,"tag":209,"props":56909,"children":56910},{"class":211,"line":2372},[56911,56916,56921,56925,56930,56934,56938],{"type":21,"tag":209,"props":56912,"children":56913},{"style":216},[56914],{"type":26,"value":56915},"                    var",{"type":21,"tag":209,"props":56917,"children":56918},{"style":222},[56919],{"type":26,"value":56920}," fileType ",{"type":21,"tag":209,"props":56922,"children":56923},{"style":216},[56924],{"type":26,"value":1432},{"type":21,"tag":209,"props":56926,"children":56927},{"style":222},[56928],{"type":26,"value":56929}," fileTypes[j].",{"type":21,"tag":209,"props":56931,"children":56932},{"style":360},[56933],{"type":26,"value":36423},{"type":21,"tag":209,"props":56935,"children":56936},{"style":222},[56937],{"type":26,"value":368},{"type":21,"tag":209,"props":56939,"children":56940},{"style":448},[56941],{"type":26,"value":56745},{"type":21,"tag":209,"props":56943,"children":56944},{"class":211,"line":2381},[56945,56949,56954,56958,56962,56966,56971,56975,56980,56984],{"type":21,"tag":209,"props":56946,"children":56947},{"style":360},[56948],{"type":26,"value":12001},{"type":21,"tag":209,"props":56950,"children":56951},{"style":222},[56952],{"type":26,"value":56953}," (mime[",{"type":21,"tag":209,"props":56955,"children":56956},{"style":263},[56957],{"type":26,"value":6048},{"type":21,"tag":209,"props":56959,"children":56960},{"style":222},[56961],{"type":26,"value":1427},{"type":21,"tag":209,"props":56963,"children":56964},{"style":216},[56965],{"type":26,"value":6102},{"type":21,"tag":209,"props":56967,"children":56968},{"style":222},[56969],{"type":26,"value":56970}," fileType[",{"type":21,"tag":209,"props":56972,"children":56973},{"style":263},[56974],{"type":26,"value":6048},{"type":21,"tag":209,"props":56976,"children":56977},{"style":222},[56978],{"type":26,"value":56979},"]) mimes.",{"type":21,"tag":209,"props":56981,"children":56982},{"style":360},[56983],{"type":26,"value":56072},{"type":21,"tag":209,"props":56985,"children":56986},{"style":222},[56987],{"type":26,"value":56988},"(fileTypes[j]);\n",{"type":21,"tag":209,"props":56990,"children":56991},{"class":211,"line":2389},[56992],{"type":21,"tag":209,"props":56993,"children":56994},{"style":222},[56995],{"type":26,"value":16636},{"type":21,"tag":209,"props":56997,"children":56998},{"class":211,"line":2397},[56999],{"type":21,"tag":209,"props":57000,"children":57001},{"style":222},[57002],{"type":26,"value":57003},"            } else {\n",{"type":21,"tag":209,"props":57005,"children":57006},{"class":211,"line":2406},[57007],{"type":21,"tag":209,"props":57008,"children":57009},{"style":448},[57010],{"type":26,"value":57011},"                // Pass the mime type through unmolested\n",{"type":21,"tag":209,"props":57013,"children":57014},{"class":211,"line":2415},[57015,57020,57024],{"type":21,"tag":209,"props":57016,"children":57017},{"style":222},[57018],{"type":26,"value":57019},"                mimes.push(mime.join(",{"type":21,"tag":209,"props":57021,"children":57022},{"style":233},[57023],{"type":26,"value":42345},{"type":21,"tag":209,"props":57025,"children":57026},{"style":222},[57027],{"type":26,"value":46554},{"type":21,"tag":209,"props":57029,"children":57030},{"class":211,"line":2424},[57031],{"type":21,"tag":209,"props":57032,"children":57033},{"style":222},[57034],{"type":26,"value":6136},{"type":21,"tag":209,"props":57036,"children":57037},{"class":211,"line":2433},[57038],{"type":21,"tag":209,"props":57039,"children":57040},{"style":222},[57041],{"type":26,"value":57042},"        } else {\n",{"type":21,"tag":209,"props":57044,"children":57045},{"class":211,"line":2442},[57046],{"type":21,"tag":209,"props":57047,"children":57048},{"style":448},[57049],{"type":26,"value":57050},"            // Only an extension has been specified - map to the mime type\n",{"type":21,"tag":209,"props":57052,"children":57053},{"class":211,"line":2471},[57054],{"type":21,"tag":209,"props":57055,"children":57056},{"style":222},[57057],{"type":26,"value":57058},"            if (mime[0] in filters) mimes.push(filters[mime[0]]);\n",{"type":21,"tag":209,"props":57060,"children":57061},{"class":211,"line":2480},[57062],{"type":21,"tag":209,"props":57063,"children":57064},{"style":222},[57065],{"type":26,"value":2235},{"type":21,"tag":209,"props":57067,"children":57068},{"class":211,"line":2489},[57069],{"type":21,"tag":209,"props":57070,"children":57071},{"style":222},[57072],{"type":26,"value":331},{"type":21,"tag":209,"props":57074,"children":57075},{"class":211,"line":2516},[57076],{"type":21,"tag":209,"props":57077,"children":57078},{"style":222},[57079],{"type":26,"value":57080},"    return mimes;\n",{"type":21,"tag":209,"props":57082,"children":57083},{"class":211,"line":2525},[57084],{"type":21,"tag":209,"props":57085,"children":57086},{"style":222},[57087],{"type":26,"value":340},{"type":21,"tag":22,"props":57089,"children":57090},{},[57091,57093,57099,57101,57107],{"type":26,"value":57092},"Here, we allow the plugin user to set accept on the plugin as either a string or an array, and generate our mimes filter array from it. This allows us to be more permissive than the standard accept filter, with: ",{"type":21,"tag":63,"props":57094,"children":57096},{"className":57095},[],[57097],{"type":26,"value":57098},"\"wmv, audio/_, swf\" or ['wmv', 'audio/_', 'swf']",{"type":26,"value":57100}," both being valid. Notice the wildcard in the above example? In acceptFilters, we split on the forward slash and if the second part is a wildcard, we add every mime-type that matches the first part to the mimes filter array. If both parts are specified (ie. 'plain/text'), we pass it through unchanged (save for trimming any whitespace) - this allows the user to add mime-types that aren't in our list (ie. video/ogg, audio/flac, etc.). These can be combined - so if you want to allow any audio type, and include ones that aren't explicit in our list, you can specify ",{"type":21,"tag":63,"props":57102,"children":57104},{"className":57103},[],[57105],{"type":26,"value":57106},"['audio/*', 'audio/flac', 'audio/alac', 'audio/ogg']",{"type":26,"value":57108}," to do just that.",{"type":21,"tag":22,"props":57110,"children":57111},{},[57112],{"type":26,"value":57113},"Finally, when we're iterating through the fileList, we make our checks against the mimetype of the file in the fileList and, if its not in our accept filter, we fire a new event of type FILE_TYPE_ERROR and continue on to the next file in the list.",{"type":21,"tag":200,"props":57115,"children":57117},{"className":9044,"code":57116,"language":9046,"meta":8,"style":8}," /**\n* Process the files in the fileList, uploading them if a url is specified, otherwise reading them into\n* memory and passing them on to be used in the browser.\n* @param files\n* @param upload\n*/\nHup.prototype.processFiles = function(files, upload){\n    var that = this,\n        processed = 0,\n        accept = this.options.accept,\n        accepted = false,\n        maxSize = this.options.max_file_size,\n        fprocess;\n\nfor (var i=0, len = files.length; i < len; i++)\n{\n    // Check file against mime accept restrictions if any restrictions are set\n    if (accept.length)\n    {\n        accepted = false;\n        for (var j=0, jlen = accept.length; j < jlen; j++)\n        {\n            accepted = (files[i].type === accept[j]);\n            if (accepted) break;\n        }\n        if (!accepted)\n        {\n            this.input.trigger(Hup.state.FILE_TYPE_ERROR,\n                {state:Hup.state.FILE_TYPE_ERROR,\n                    error:'File type is '+files[i].type+', accepted types are '+\n                        accept.join(',')+'.'});\n            continue;\n        }\n    }\n    // Check file against size restrictions\n    if (maxSize && files[i].size > maxSize)\n    {\n        this.input.trigger(Hup.state.FILE_SIZE_ERROR,\n            {state:Hup.state.FILE_SIZE_ERROR,\n                error:'File size is '+files[i].size+', max file size is '+maxSize+'.'});\n        continue;\n    }\n    // Create new DeferXhr or DeferReader and listen on its progression and completion to fire the appropriate\n    // events for interested listeners on our input\n    fprocess = (upload) ? new DeferXhr(this.options, files[i]) :\n        new DeferReader(this.options.read_method, files[i]);\n\n    fprocess.progress(function(progress){\n        that.input.trigger(progress.state, progress);\n    }).done(function(res){\n        that.input.trigger(res.state, res);\n        processed++;\n        if (processed >= len){\n            that.input.trigger((upload) ? Hup.state.FILE_UPLOAD_ALL : Hup.state.FILE_READ_ALL ,\n                {state:(upload) ? Hup.state.FILE_UPLOAD_ALL : Hup.state.FILE_READ_ALL, files:len});\n        }\n    }).fail(function(res)\n    {\n        that.input.trigger(res.state, res);\n    });\n}\n\n};\n",[57118],{"type":21,"tag":63,"props":57119,"children":57120},{"__ignoreMap":8},[57121,57129,57137,57145,57161,57177,57184,57237,57261,57281,57301,57321,57342,57350,57357,57422,57429,57437,57457,57464,57483,57547,57554,57580,57601,57608,57628,57635,57665,57681,57716,57755,57767,57774,57781,57789,57828,57835,57863,57879,57931,57943,57950,57958,57966,58013,58039,58046,58079,58096,58128,58144,58160,58190,58240,58277,58284,58315,58322,58337,58344,58351,58358],{"type":21,"tag":209,"props":57122,"children":57123},{"class":211,"line":212},[57124],{"type":21,"tag":209,"props":57125,"children":57126},{"style":448},[57127],{"type":26,"value":57128}," /**\n",{"type":21,"tag":209,"props":57130,"children":57131},{"class":211,"line":244},[57132],{"type":21,"tag":209,"props":57133,"children":57134},{"style":448},[57135],{"type":26,"value":57136},"* Process the files in the fileList, uploading them if a url is specified, otherwise reading them into\n",{"type":21,"tag":209,"props":57138,"children":57139},{"class":211,"line":254},[57140],{"type":21,"tag":209,"props":57141,"children":57142},{"style":448},[57143],{"type":26,"value":57144},"* memory and passing them on to be used in the browser.\n",{"type":21,"tag":209,"props":57146,"children":57147},{"class":211,"line":279},[57148,57152,57156],{"type":21,"tag":209,"props":57149,"children":57150},{"style":448},[57151],{"type":26,"value":56433},{"type":21,"tag":209,"props":57153,"children":57154},{"style":216},[57155],{"type":26,"value":4718},{"type":21,"tag":209,"props":57157,"children":57158},{"style":222},[57159],{"type":26,"value":57160}," files\n",{"type":21,"tag":209,"props":57162,"children":57163},{"class":211,"line":288},[57164,57168,57172],{"type":21,"tag":209,"props":57165,"children":57166},{"style":448},[57167],{"type":26,"value":56433},{"type":21,"tag":209,"props":57169,"children":57170},{"style":216},[57171],{"type":26,"value":4718},{"type":21,"tag":209,"props":57173,"children":57174},{"style":222},[57175],{"type":26,"value":57176}," upload\n",{"type":21,"tag":209,"props":57178,"children":57179},{"class":211,"line":307},[57180],{"type":21,"tag":209,"props":57181,"children":57182},{"style":448},[57183],{"type":26,"value":51174},{"type":21,"tag":209,"props":57185,"children":57186},{"class":211,"line":325},[57187,57191,57195,57199,57203,57208,57212,57216,57220,57225,57229,57233],{"type":21,"tag":209,"props":57188,"children":57189},{"style":263},[57190],{"type":26,"value":56462},{"type":21,"tag":209,"props":57192,"children":57193},{"style":222},[57194],{"type":26,"value":378},{"type":21,"tag":209,"props":57196,"children":57197},{"style":263},[57198],{"type":26,"value":37016},{"type":21,"tag":209,"props":57200,"children":57201},{"style":222},[57202],{"type":26,"value":378},{"type":21,"tag":209,"props":57204,"children":57205},{"style":360},[57206],{"type":26,"value":57207},"processFiles",{"type":21,"tag":209,"props":57209,"children":57210},{"style":216},[57211],{"type":26,"value":271},{"type":21,"tag":209,"props":57213,"children":57214},{"style":216},[57215],{"type":26,"value":4766},{"type":21,"tag":209,"props":57217,"children":57218},{"style":222},[57219],{"type":26,"value":368},{"type":21,"tag":209,"props":57221,"children":57222},{"style":400},[57223],{"type":26,"value":57224},"files",{"type":21,"tag":209,"props":57226,"children":57227},{"style":222},[57228],{"type":26,"value":408},{"type":21,"tag":209,"props":57230,"children":57231},{"style":400},[57232],{"type":26,"value":32649},{"type":21,"tag":209,"props":57234,"children":57235},{"style":222},[57236],{"type":26,"value":2369},{"type":21,"tag":209,"props":57238,"children":57239},{"class":211,"line":334},[57240,57244,57249,57253,57257],{"type":21,"tag":209,"props":57241,"children":57242},{"style":216},[57243],{"type":26,"value":10405},{"type":21,"tag":209,"props":57245,"children":57246},{"style":222},[57247],{"type":26,"value":57248}," that ",{"type":21,"tag":209,"props":57250,"children":57251},{"style":216},[57252],{"type":26,"value":1432},{"type":21,"tag":209,"props":57254,"children":57255},{"style":263},[57256],{"type":26,"value":17698},{"type":21,"tag":209,"props":57258,"children":57259},{"style":222},[57260],{"type":26,"value":304},{"type":21,"tag":209,"props":57262,"children":57263},{"class":211,"line":343},[57264,57269,57273,57277],{"type":21,"tag":209,"props":57265,"children":57266},{"style":222},[57267],{"type":26,"value":57268},"        processed ",{"type":21,"tag":209,"props":57270,"children":57271},{"style":216},[57272],{"type":26,"value":1432},{"type":21,"tag":209,"props":57274,"children":57275},{"style":263},[57276],{"type":26,"value":17197},{"type":21,"tag":209,"props":57278,"children":57279},{"style":222},[57280],{"type":26,"value":304},{"type":21,"tag":209,"props":57282,"children":57283},{"class":211,"line":351},[57284,57288,57292,57296],{"type":21,"tag":209,"props":57285,"children":57286},{"style":222},[57287],{"type":26,"value":56592},{"type":21,"tag":209,"props":57289,"children":57290},{"style":216},[57291],{"type":26,"value":1432},{"type":21,"tag":209,"props":57293,"children":57294},{"style":263},[57295],{"type":26,"value":17698},{"type":21,"tag":209,"props":57297,"children":57298},{"style":222},[57299],{"type":26,"value":57300},".options.accept,\n",{"type":21,"tag":209,"props":57302,"children":57303},{"class":211,"line":444},[57304,57309,57313,57317],{"type":21,"tag":209,"props":57305,"children":57306},{"style":222},[57307],{"type":26,"value":57308},"        accepted ",{"type":21,"tag":209,"props":57310,"children":57311},{"style":216},[57312],{"type":26,"value":1432},{"type":21,"tag":209,"props":57314,"children":57315},{"style":263},[57316],{"type":26,"value":5455},{"type":21,"tag":209,"props":57318,"children":57319},{"style":222},[57320],{"type":26,"value":304},{"type":21,"tag":209,"props":57322,"children":57323},{"class":211,"line":454},[57324,57329,57333,57337],{"type":21,"tag":209,"props":57325,"children":57326},{"style":222},[57327],{"type":26,"value":57328},"        maxSize ",{"type":21,"tag":209,"props":57330,"children":57331},{"style":216},[57332],{"type":26,"value":1432},{"type":21,"tag":209,"props":57334,"children":57335},{"style":263},[57336],{"type":26,"value":17698},{"type":21,"tag":209,"props":57338,"children":57339},{"style":222},[57340],{"type":26,"value":57341},".options.max_file_size,\n",{"type":21,"tag":209,"props":57343,"children":57344},{"class":211,"line":463},[57345],{"type":21,"tag":209,"props":57346,"children":57347},{"style":222},[57348],{"type":26,"value":57349},"        fprocess;\n",{"type":21,"tag":209,"props":57351,"children":57352},{"class":211,"line":472},[57353],{"type":21,"tag":209,"props":57354,"children":57355},{"emptyLinePlaceholder":248},[57356],{"type":26,"value":251},{"type":21,"tag":209,"props":57358,"children":57359},{"class":211,"line":480},[57360,57364,57368,57372,57376,57380,57384,57388,57392,57397,57401,57405,57409,57414,57418],{"type":21,"tag":209,"props":57361,"children":57362},{"style":216},[57363],{"type":26,"value":20713},{"type":21,"tag":209,"props":57365,"children":57366},{"style":222},[57367],{"type":26,"value":4776},{"type":21,"tag":209,"props":57369,"children":57370},{"style":216},[57371],{"type":26,"value":8996},{"type":21,"tag":209,"props":57373,"children":57374},{"style":222},[57375],{"type":26,"value":36621},{"type":21,"tag":209,"props":57377,"children":57378},{"style":216},[57379],{"type":26,"value":1432},{"type":21,"tag":209,"props":57381,"children":57382},{"style":263},[57383],{"type":26,"value":6048},{"type":21,"tag":209,"props":57385,"children":57386},{"style":222},[57387],{"type":26,"value":56664},{"type":21,"tag":209,"props":57389,"children":57390},{"style":216},[57391],{"type":26,"value":1432},{"type":21,"tag":209,"props":57393,"children":57394},{"style":222},[57395],{"type":26,"value":57396}," files.",{"type":21,"tag":209,"props":57398,"children":57399},{"style":263},[57400],{"type":26,"value":36467},{"type":21,"tag":209,"props":57402,"children":57403},{"style":222},[57404],{"type":26,"value":36647},{"type":21,"tag":209,"props":57406,"children":57407},{"style":216},[57408],{"type":26,"value":36584},{"type":21,"tag":209,"props":57410,"children":57411},{"style":222},[57412],{"type":26,"value":57413},"lt; len; i",{"type":21,"tag":209,"props":57415,"children":57416},{"style":216},[57417],{"type":26,"value":36661},{"type":21,"tag":209,"props":57419,"children":57420},{"style":222},[57421],{"type":26,"value":10112},{"type":21,"tag":209,"props":57423,"children":57424},{"class":211,"line":489},[57425],{"type":21,"tag":209,"props":57426,"children":57427},{"style":222},[57428],{"type":26,"value":7414},{"type":21,"tag":209,"props":57430,"children":57431},{"class":211,"line":847},[57432],{"type":21,"tag":209,"props":57433,"children":57434},{"style":448},[57435],{"type":26,"value":57436},"    // Check file against mime accept restrictions if any restrictions are set\n",{"type":21,"tag":209,"props":57438,"children":57439},{"class":211,"line":860},[57440,57444,57449,57453],{"type":21,"tag":209,"props":57441,"children":57442},{"style":216},[57443],{"type":26,"value":10853},{"type":21,"tag":209,"props":57445,"children":57446},{"style":222},[57447],{"type":26,"value":57448}," (accept.",{"type":21,"tag":209,"props":57450,"children":57451},{"style":263},[57452],{"type":26,"value":36467},{"type":21,"tag":209,"props":57454,"children":57455},{"style":222},[57456],{"type":26,"value":10112},{"type":21,"tag":209,"props":57458,"children":57459},{"class":211,"line":877},[57460],{"type":21,"tag":209,"props":57461,"children":57462},{"style":222},[57463],{"type":26,"value":37029},{"type":21,"tag":209,"props":57465,"children":57466},{"class":211,"line":889},[57467,57471,57475,57479],{"type":21,"tag":209,"props":57468,"children":57469},{"style":222},[57470],{"type":26,"value":57308},{"type":21,"tag":209,"props":57472,"children":57473},{"style":216},[57474],{"type":26,"value":1432},{"type":21,"tag":209,"props":57476,"children":57477},{"style":263},[57478],{"type":26,"value":5455},{"type":21,"tag":209,"props":57480,"children":57481},{"style":222},[57482],{"type":26,"value":241},{"type":21,"tag":209,"props":57484,"children":57485},{"class":211,"line":902},[57486,57490,57494,57498,57502,57506,57510,57514,57518,57522,57526,57530,57534,57539,57543],{"type":21,"tag":209,"props":57487,"children":57488},{"style":216},[57489],{"type":26,"value":36608},{"type":21,"tag":209,"props":57491,"children":57492},{"style":222},[57493],{"type":26,"value":4776},{"type":21,"tag":209,"props":57495,"children":57496},{"style":216},[57497],{"type":26,"value":8996},{"type":21,"tag":209,"props":57499,"children":57500},{"style":222},[57501],{"type":26,"value":56146},{"type":21,"tag":209,"props":57503,"children":57504},{"style":216},[57505],{"type":26,"value":1432},{"type":21,"tag":209,"props":57507,"children":57508},{"style":263},[57509],{"type":26,"value":6048},{"type":21,"tag":209,"props":57511,"children":57512},{"style":222},[57513],{"type":26,"value":56159},{"type":21,"tag":209,"props":57515,"children":57516},{"style":216},[57517],{"type":26,"value":1432},{"type":21,"tag":209,"props":57519,"children":57520},{"style":222},[57521],{"type":26,"value":56601},{"type":21,"tag":209,"props":57523,"children":57524},{"style":263},[57525],{"type":26,"value":36467},{"type":21,"tag":209,"props":57527,"children":57528},{"style":222},[57529],{"type":26,"value":56177},{"type":21,"tag":209,"props":57531,"children":57532},{"style":216},[57533],{"type":26,"value":36584},{"type":21,"tag":209,"props":57535,"children":57536},{"style":222},[57537],{"type":26,"value":57538},"lt; jlen; j",{"type":21,"tag":209,"props":57540,"children":57541},{"style":216},[57542],{"type":26,"value":36661},{"type":21,"tag":209,"props":57544,"children":57545},{"style":222},[57546],{"type":26,"value":10112},{"type":21,"tag":209,"props":57548,"children":57549},{"class":211,"line":914},[57550],{"type":21,"tag":209,"props":57551,"children":57552},{"style":222},[57553],{"type":26,"value":7561},{"type":21,"tag":209,"props":57555,"children":57556},{"class":211,"line":922},[57557,57562,57566,57571,57575],{"type":21,"tag":209,"props":57558,"children":57559},{"style":222},[57560],{"type":26,"value":57561},"            accepted ",{"type":21,"tag":209,"props":57563,"children":57564},{"style":216},[57565],{"type":26,"value":1432},{"type":21,"tag":209,"props":57567,"children":57568},{"style":222},[57569],{"type":26,"value":57570}," (files[i].type ",{"type":21,"tag":209,"props":57572,"children":57573},{"style":216},[57574],{"type":26,"value":6102},{"type":21,"tag":209,"props":57576,"children":57577},{"style":222},[57578],{"type":26,"value":57579}," accept[j]);\n",{"type":21,"tag":209,"props":57581,"children":57582},{"class":211,"line":2312},[57583,57587,57592,57597],{"type":21,"tag":209,"props":57584,"children":57585},{"style":216},[57586],{"type":26,"value":6083},{"type":21,"tag":209,"props":57588,"children":57589},{"style":222},[57590],{"type":26,"value":57591}," (accepted) ",{"type":21,"tag":209,"props":57593,"children":57594},{"style":216},[57595],{"type":26,"value":57596},"break",{"type":21,"tag":209,"props":57598,"children":57599},{"style":222},[57600],{"type":26,"value":241},{"type":21,"tag":209,"props":57602,"children":57603},{"class":211,"line":2321},[57604],{"type":21,"tag":209,"props":57605,"children":57606},{"style":222},[57607],{"type":26,"value":2235},{"type":21,"tag":209,"props":57609,"children":57610},{"class":211,"line":2372},[57611,57615,57619,57623],{"type":21,"tag":209,"props":57612,"children":57613},{"style":216},[57614],{"type":26,"value":5803},{"type":21,"tag":209,"props":57616,"children":57617},{"style":222},[57618],{"type":26,"value":4776},{"type":21,"tag":209,"props":57620,"children":57621},{"style":216},[57622],{"type":26,"value":15052},{"type":21,"tag":209,"props":57624,"children":57625},{"style":222},[57626],{"type":26,"value":57627},"accepted)\n",{"type":21,"tag":209,"props":57629,"children":57630},{"class":211,"line":2381},[57631],{"type":21,"tag":209,"props":57632,"children":57633},{"style":222},[57634],{"type":26,"value":7561},{"type":21,"tag":209,"props":57636,"children":57637},{"class":211,"line":2389},[57638,57642,57647,57651,57656,57661],{"type":21,"tag":209,"props":57639,"children":57640},{"style":263},[57641],{"type":26,"value":2570},{"type":21,"tag":209,"props":57643,"children":57644},{"style":222},[57645],{"type":26,"value":57646},".input.",{"type":21,"tag":209,"props":57648,"children":57649},{"style":360},[57650],{"type":26,"value":499},{"type":21,"tag":209,"props":57652,"children":57653},{"style":222},[57654],{"type":26,"value":57655},"(Hup.state.",{"type":21,"tag":209,"props":57657,"children":57658},{"style":263},[57659],{"type":26,"value":57660},"FILE_TYPE_ERROR",{"type":21,"tag":209,"props":57662,"children":57663},{"style":222},[57664],{"type":26,"value":304},{"type":21,"tag":209,"props":57666,"children":57667},{"class":211,"line":2397},[57668,57673,57677],{"type":21,"tag":209,"props":57669,"children":57670},{"style":222},[57671],{"type":26,"value":57672},"                {state:Hup.state.",{"type":21,"tag":209,"props":57674,"children":57675},{"style":263},[57676],{"type":26,"value":57660},{"type":21,"tag":209,"props":57678,"children":57679},{"style":222},[57680],{"type":26,"value":304},{"type":21,"tag":209,"props":57682,"children":57683},{"class":211,"line":2406},[57684,57689,57694,57698,57703,57707,57712],{"type":21,"tag":209,"props":57685,"children":57686},{"style":222},[57687],{"type":26,"value":57688},"                    error:",{"type":21,"tag":209,"props":57690,"children":57691},{"style":233},[57692],{"type":26,"value":57693},"'File type is '",{"type":21,"tag":209,"props":57695,"children":57696},{"style":216},[57697],{"type":26,"value":10237},{"type":21,"tag":209,"props":57699,"children":57700},{"style":222},[57701],{"type":26,"value":57702},"files[i].type",{"type":21,"tag":209,"props":57704,"children":57705},{"style":216},[57706],{"type":26,"value":10237},{"type":21,"tag":209,"props":57708,"children":57709},{"style":233},[57710],{"type":26,"value":57711},"', accepted types are '",{"type":21,"tag":209,"props":57713,"children":57714},{"style":216},[57715],{"type":26,"value":47796},{"type":21,"tag":209,"props":57717,"children":57718},{"class":211,"line":2415},[57719,57724,57729,57733,57737,57742,57746,57751],{"type":21,"tag":209,"props":57720,"children":57721},{"style":222},[57722],{"type":26,"value":57723},"                        accept.",{"type":21,"tag":209,"props":57725,"children":57726},{"style":360},[57727],{"type":26,"value":57728},"join",{"type":21,"tag":209,"props":57730,"children":57731},{"style":222},[57732],{"type":26,"value":368},{"type":21,"tag":209,"props":57734,"children":57735},{"style":233},[57736],{"type":26,"value":36432},{"type":21,"tag":209,"props":57738,"children":57739},{"style":222},[57740],{"type":26,"value":57741},")",{"type":21,"tag":209,"props":57743,"children":57744},{"style":216},[57745],{"type":26,"value":10237},{"type":21,"tag":209,"props":57747,"children":57748},{"style":233},[57749],{"type":26,"value":57750},"'.'",{"type":21,"tag":209,"props":57752,"children":57753},{"style":222},[57754],{"type":26,"value":469},{"type":21,"tag":209,"props":57756,"children":57757},{"class":211,"line":2424},[57758,57763],{"type":21,"tag":209,"props":57759,"children":57760},{"style":216},[57761],{"type":26,"value":57762},"            continue",{"type":21,"tag":209,"props":57764,"children":57765},{"style":222},[57766],{"type":26,"value":241},{"type":21,"tag":209,"props":57768,"children":57769},{"class":211,"line":2433},[57770],{"type":21,"tag":209,"props":57771,"children":57772},{"style":222},[57773],{"type":26,"value":2235},{"type":21,"tag":209,"props":57775,"children":57776},{"class":211,"line":2442},[57777],{"type":21,"tag":209,"props":57778,"children":57779},{"style":222},[57780],{"type":26,"value":331},{"type":21,"tag":209,"props":57782,"children":57783},{"class":211,"line":2471},[57784],{"type":21,"tag":209,"props":57785,"children":57786},{"style":448},[57787],{"type":26,"value":57788},"    // Check file against size restrictions\n",{"type":21,"tag":209,"props":57790,"children":57791},{"class":211,"line":2480},[57792,57796,57801,57805,57810,57814,57819,57823],{"type":21,"tag":209,"props":57793,"children":57794},{"style":216},[57795],{"type":26,"value":10853},{"type":21,"tag":209,"props":57797,"children":57798},{"style":222},[57799],{"type":26,"value":57800}," (maxSize ",{"type":21,"tag":209,"props":57802,"children":57803},{"style":216},[57804],{"type":26,"value":36584},{"type":21,"tag":209,"props":57806,"children":57807},{"style":222},[57808],{"type":26,"value":57809},"amp;",{"type":21,"tag":209,"props":57811,"children":57812},{"style":216},[57813],{"type":26,"value":36584},{"type":21,"tag":209,"props":57815,"children":57816},{"style":222},[57817],{"type":26,"value":57818},"amp; files[i].size ",{"type":21,"tag":209,"props":57820,"children":57821},{"style":216},[57822],{"type":26,"value":36584},{"type":21,"tag":209,"props":57824,"children":57825},{"style":222},[57826],{"type":26,"value":57827},"gt; maxSize)\n",{"type":21,"tag":209,"props":57829,"children":57830},{"class":211,"line":2489},[57831],{"type":21,"tag":209,"props":57832,"children":57833},{"style":222},[57834],{"type":26,"value":37029},{"type":21,"tag":209,"props":57836,"children":57837},{"class":211,"line":2516},[57838,57842,57846,57850,57854,57859],{"type":21,"tag":209,"props":57839,"children":57840},{"style":263},[57841],{"type":26,"value":51473},{"type":21,"tag":209,"props":57843,"children":57844},{"style":222},[57845],{"type":26,"value":57646},{"type":21,"tag":209,"props":57847,"children":57848},{"style":360},[57849],{"type":26,"value":499},{"type":21,"tag":209,"props":57851,"children":57852},{"style":222},[57853],{"type":26,"value":57655},{"type":21,"tag":209,"props":57855,"children":57856},{"style":263},[57857],{"type":26,"value":57858},"FILE_SIZE_ERROR",{"type":21,"tag":209,"props":57860,"children":57861},{"style":222},[57862],{"type":26,"value":304},{"type":21,"tag":209,"props":57864,"children":57865},{"class":211,"line":2525},[57866,57871,57875],{"type":21,"tag":209,"props":57867,"children":57868},{"style":222},[57869],{"type":26,"value":57870},"            {state:Hup.state.",{"type":21,"tag":209,"props":57872,"children":57873},{"style":263},[57874],{"type":26,"value":57858},{"type":21,"tag":209,"props":57876,"children":57877},{"style":222},[57878],{"type":26,"value":304},{"type":21,"tag":209,"props":57880,"children":57881},{"class":211,"line":2533},[57882,57887,57892,57896,57901,57905,57910,57914,57919,57923,57927],{"type":21,"tag":209,"props":57883,"children":57884},{"style":222},[57885],{"type":26,"value":57886},"                error:",{"type":21,"tag":209,"props":57888,"children":57889},{"style":233},[57890],{"type":26,"value":57891},"'File size is '",{"type":21,"tag":209,"props":57893,"children":57894},{"style":216},[57895],{"type":26,"value":10237},{"type":21,"tag":209,"props":57897,"children":57898},{"style":222},[57899],{"type":26,"value":57900},"files[i].size",{"type":21,"tag":209,"props":57902,"children":57903},{"style":216},[57904],{"type":26,"value":10237},{"type":21,"tag":209,"props":57906,"children":57907},{"style":233},[57908],{"type":26,"value":57909},"', max file size is '",{"type":21,"tag":209,"props":57911,"children":57912},{"style":216},[57913],{"type":26,"value":10237},{"type":21,"tag":209,"props":57915,"children":57916},{"style":222},[57917],{"type":26,"value":57918},"maxSize",{"type":21,"tag":209,"props":57920,"children":57921},{"style":216},[57922],{"type":26,"value":10237},{"type":21,"tag":209,"props":57924,"children":57925},{"style":233},[57926],{"type":26,"value":57750},{"type":21,"tag":209,"props":57928,"children":57929},{"style":222},[57930],{"type":26,"value":469},{"type":21,"tag":209,"props":57932,"children":57933},{"class":211,"line":2542},[57934,57939],{"type":21,"tag":209,"props":57935,"children":57936},{"style":216},[57937],{"type":26,"value":57938},"        continue",{"type":21,"tag":209,"props":57940,"children":57941},{"style":222},[57942],{"type":26,"value":241},{"type":21,"tag":209,"props":57944,"children":57945},{"class":211,"line":2550},[57946],{"type":21,"tag":209,"props":57947,"children":57948},{"style":222},[57949],{"type":26,"value":331},{"type":21,"tag":209,"props":57951,"children":57952},{"class":211,"line":2564},[57953],{"type":21,"tag":209,"props":57954,"children":57955},{"style":448},[57956],{"type":26,"value":57957},"    // Create new DeferXhr or DeferReader and listen on its progression and completion to fire the appropriate\n",{"type":21,"tag":209,"props":57959,"children":57960},{"class":211,"line":2611},[57961],{"type":21,"tag":209,"props":57962,"children":57963},{"style":448},[57964],{"type":26,"value":57965},"    // events for interested listeners on our input\n",{"type":21,"tag":209,"props":57967,"children":57968},{"class":211,"line":2619},[57969,57974,57978,57983,57987,57991,57996,58000,58004,58009],{"type":21,"tag":209,"props":57970,"children":57971},{"style":222},[57972],{"type":26,"value":57973},"    fprocess ",{"type":21,"tag":209,"props":57975,"children":57976},{"style":216},[57977],{"type":26,"value":1432},{"type":21,"tag":209,"props":57979,"children":57980},{"style":222},[57981],{"type":26,"value":57982}," (upload) ",{"type":21,"tag":209,"props":57984,"children":57985},{"style":216},[57986],{"type":26,"value":15218},{"type":21,"tag":209,"props":57988,"children":57989},{"style":216},[57990],{"type":26,"value":4667},{"type":21,"tag":209,"props":57992,"children":57993},{"style":360},[57994],{"type":26,"value":57995}," DeferXhr",{"type":21,"tag":209,"props":57997,"children":57998},{"style":222},[57999],{"type":26,"value":368},{"type":21,"tag":209,"props":58001,"children":58002},{"style":263},[58003],{"type":26,"value":2508},{"type":21,"tag":209,"props":58005,"children":58006},{"style":222},[58007],{"type":26,"value":58008},".options, files[i]) ",{"type":21,"tag":209,"props":58010,"children":58011},{"style":216},[58012],{"type":26,"value":844},{"type":21,"tag":209,"props":58014,"children":58015},{"class":211,"line":2627},[58016,58021,58026,58030,58034],{"type":21,"tag":209,"props":58017,"children":58018},{"style":216},[58019],{"type":26,"value":58020},"        new",{"type":21,"tag":209,"props":58022,"children":58023},{"style":360},[58024],{"type":26,"value":58025}," DeferReader",{"type":21,"tag":209,"props":58027,"children":58028},{"style":222},[58029],{"type":26,"value":368},{"type":21,"tag":209,"props":58031,"children":58032},{"style":263},[58033],{"type":26,"value":2508},{"type":21,"tag":209,"props":58035,"children":58036},{"style":222},[58037],{"type":26,"value":58038},".options.read_method, files[i]);\n",{"type":21,"tag":209,"props":58040,"children":58041},{"class":211,"line":2636},[58042],{"type":21,"tag":209,"props":58043,"children":58044},{"emptyLinePlaceholder":248},[58045],{"type":26,"value":251},{"type":21,"tag":209,"props":58047,"children":58048},{"class":211,"line":2644},[58049,58054,58059,58063,58067,58071,58075],{"type":21,"tag":209,"props":58050,"children":58051},{"style":222},[58052],{"type":26,"value":58053},"    fprocess.",{"type":21,"tag":209,"props":58055,"children":58056},{"style":360},[58057],{"type":26,"value":58058},"progress",{"type":21,"tag":209,"props":58060,"children":58061},{"style":222},[58062],{"type":26,"value":368},{"type":21,"tag":209,"props":58064,"children":58065},{"style":216},[58066],{"type":26,"value":5370},{"type":21,"tag":209,"props":58068,"children":58069},{"style":222},[58070],{"type":26,"value":368},{"type":21,"tag":209,"props":58072,"children":58073},{"style":400},[58074],{"type":26,"value":58058},{"type":21,"tag":209,"props":58076,"children":58077},{"style":222},[58078],{"type":26,"value":2369},{"type":21,"tag":209,"props":58080,"children":58081},{"class":211,"line":2657},[58082,58087,58091],{"type":21,"tag":209,"props":58083,"children":58084},{"style":222},[58085],{"type":26,"value":58086},"        that.input.",{"type":21,"tag":209,"props":58088,"children":58089},{"style":360},[58090],{"type":26,"value":499},{"type":21,"tag":209,"props":58092,"children":58093},{"style":222},[58094],{"type":26,"value":58095},"(progress.state, progress);\n",{"type":21,"tag":209,"props":58097,"children":58098},{"class":211,"line":2728},[58099,58104,58108,58112,58116,58120,58124],{"type":21,"tag":209,"props":58100,"children":58101},{"style":222},[58102],{"type":26,"value":58103},"    }).",{"type":21,"tag":209,"props":58105,"children":58106},{"style":360},[58107],{"type":26,"value":18042},{"type":21,"tag":209,"props":58109,"children":58110},{"style":222},[58111],{"type":26,"value":368},{"type":21,"tag":209,"props":58113,"children":58114},{"style":216},[58115],{"type":26,"value":5370},{"type":21,"tag":209,"props":58117,"children":58118},{"style":222},[58119],{"type":26,"value":368},{"type":21,"tag":209,"props":58121,"children":58122},{"style":400},[58123],{"type":26,"value":1385},{"type":21,"tag":209,"props":58125,"children":58126},{"style":222},[58127],{"type":26,"value":2369},{"type":21,"tag":209,"props":58129,"children":58130},{"class":211,"line":2758},[58131,58135,58139],{"type":21,"tag":209,"props":58132,"children":58133},{"style":222},[58134],{"type":26,"value":58086},{"type":21,"tag":209,"props":58136,"children":58137},{"style":360},[58138],{"type":26,"value":499},{"type":21,"tag":209,"props":58140,"children":58141},{"style":222},[58142],{"type":26,"value":58143},"(res.state, res);\n",{"type":21,"tag":209,"props":58145,"children":58146},{"class":211,"line":2776},[58147,58152,58156],{"type":21,"tag":209,"props":58148,"children":58149},{"style":222},[58150],{"type":26,"value":58151},"        processed",{"type":21,"tag":209,"props":58153,"children":58154},{"style":216},[58155],{"type":26,"value":36661},{"type":21,"tag":209,"props":58157,"children":58158},{"style":222},[58159],{"type":26,"value":241},{"type":21,"tag":209,"props":58161,"children":58162},{"class":211,"line":2785},[58163,58167,58172,58176,58181,58185],{"type":21,"tag":209,"props":58164,"children":58165},{"style":216},[58166],{"type":26,"value":5803},{"type":21,"tag":209,"props":58168,"children":58169},{"style":222},[58170],{"type":26,"value":58171}," (processed ",{"type":21,"tag":209,"props":58173,"children":58174},{"style":216},[58175],{"type":26,"value":36584},{"type":21,"tag":209,"props":58177,"children":58178},{"style":222},[58179],{"type":26,"value":58180},"gt;",{"type":21,"tag":209,"props":58182,"children":58183},{"style":216},[58184],{"type":26,"value":1432},{"type":21,"tag":209,"props":58186,"children":58187},{"style":222},[58188],{"type":26,"value":58189}," len){\n",{"type":21,"tag":209,"props":58191,"children":58192},{"class":211,"line":2793},[58193,58198,58202,58207,58211,58216,58221,58226,58230,58235],{"type":21,"tag":209,"props":58194,"children":58195},{"style":222},[58196],{"type":26,"value":58197},"            that.input.",{"type":21,"tag":209,"props":58199,"children":58200},{"style":360},[58201],{"type":26,"value":499},{"type":21,"tag":209,"props":58203,"children":58204},{"style":222},[58205],{"type":26,"value":58206},"((upload) ",{"type":21,"tag":209,"props":58208,"children":58209},{"style":216},[58210],{"type":26,"value":15218},{"type":21,"tag":209,"props":58212,"children":58213},{"style":222},[58214],{"type":26,"value":58215}," Hup.state.",{"type":21,"tag":209,"props":58217,"children":58218},{"style":263},[58219],{"type":26,"value":58220},"FILE_UPLOAD_ALL",{"type":21,"tag":209,"props":58222,"children":58223},{"style":216},[58224],{"type":26,"value":58225}," :",{"type":21,"tag":209,"props":58227,"children":58228},{"style":222},[58229],{"type":26,"value":58215},{"type":21,"tag":209,"props":58231,"children":58232},{"style":263},[58233],{"type":26,"value":58234},"FILE_READ_ALL",{"type":21,"tag":209,"props":58236,"children":58237},{"style":222},[58238],{"type":26,"value":58239}," ,\n",{"type":21,"tag":209,"props":58241,"children":58242},{"class":211,"line":2801},[58243,58248,58252,58256,58260,58264,58268,58272],{"type":21,"tag":209,"props":58244,"children":58245},{"style":222},[58246],{"type":26,"value":58247},"                {state:(upload) ",{"type":21,"tag":209,"props":58249,"children":58250},{"style":216},[58251],{"type":26,"value":15218},{"type":21,"tag":209,"props":58253,"children":58254},{"style":222},[58255],{"type":26,"value":58215},{"type":21,"tag":209,"props":58257,"children":58258},{"style":263},[58259],{"type":26,"value":58220},{"type":21,"tag":209,"props":58261,"children":58262},{"style":216},[58263],{"type":26,"value":58225},{"type":21,"tag":209,"props":58265,"children":58266},{"style":222},[58267],{"type":26,"value":58215},{"type":21,"tag":209,"props":58269,"children":58270},{"style":263},[58271],{"type":26,"value":58234},{"type":21,"tag":209,"props":58273,"children":58274},{"style":222},[58275],{"type":26,"value":58276},", files:len});\n",{"type":21,"tag":209,"props":58278,"children":58279},{"class":211,"line":2809},[58280],{"type":21,"tag":209,"props":58281,"children":58282},{"style":222},[58283],{"type":26,"value":2235},{"type":21,"tag":209,"props":58285,"children":58286},{"class":211,"line":6219},[58287,58291,58295,58299,58303,58307,58311],{"type":21,"tag":209,"props":58288,"children":58289},{"style":222},[58290],{"type":26,"value":58103},{"type":21,"tag":209,"props":58292,"children":58293},{"style":360},[58294],{"type":26,"value":18091},{"type":21,"tag":209,"props":58296,"children":58297},{"style":222},[58298],{"type":26,"value":368},{"type":21,"tag":209,"props":58300,"children":58301},{"style":216},[58302],{"type":26,"value":5370},{"type":21,"tag":209,"props":58304,"children":58305},{"style":222},[58306],{"type":26,"value":368},{"type":21,"tag":209,"props":58308,"children":58309},{"style":400},[58310],{"type":26,"value":1385},{"type":21,"tag":209,"props":58312,"children":58313},{"style":222},[58314],{"type":26,"value":10112},{"type":21,"tag":209,"props":58316,"children":58317},{"class":211,"line":6228},[58318],{"type":21,"tag":209,"props":58319,"children":58320},{"style":222},[58321],{"type":26,"value":37029},{"type":21,"tag":209,"props":58323,"children":58324},{"class":211,"line":6250},[58325,58329,58333],{"type":21,"tag":209,"props":58326,"children":58327},{"style":222},[58328],{"type":26,"value":58086},{"type":21,"tag":209,"props":58330,"children":58331},{"style":360},[58332],{"type":26,"value":499},{"type":21,"tag":209,"props":58334,"children":58335},{"style":222},[58336],{"type":26,"value":58143},{"type":21,"tag":209,"props":58338,"children":58339},{"class":211,"line":6258},[58340],{"type":21,"tag":209,"props":58341,"children":58342},{"style":222},[58343],{"type":26,"value":3391},{"type":21,"tag":209,"props":58345,"children":58346},{"class":211,"line":6267},[58347],{"type":21,"tag":209,"props":58348,"children":58349},{"style":222},[58350],{"type":26,"value":7798},{"type":21,"tag":209,"props":58352,"children":58353},{"class":211,"line":6303},[58354],{"type":21,"tag":209,"props":58355,"children":58356},{"emptyLinePlaceholder":248},[58357],{"type":26,"value":251},{"type":21,"tag":209,"props":58359,"children":58360},{"class":211,"line":6336},[58361],{"type":21,"tag":209,"props":58362,"children":58363},{"style":222},[58364],{"type":26,"value":340},{"type":21,"tag":3549,"props":58366,"children":58368},{"id":58367},"filtering-by-size",[58369],{"type":26,"value":58370},"Filtering By Size",{"type":21,"tag":22,"props":58372,"children":58373},{},[58374],{"type":26,"value":58375},"This is absurdly simple by comparison - the code above makes it clear we simply test the file size against the max size that the plugin user has set, and if we're above that, fire an event of type FILE_SIZE_ERROR with a meaningful error message.",{"type":21,"tag":22,"props":58377,"children":58378},{},[58379],{"type":26,"value":58380},"The test against maxSize before testing the fileSize is to allow the default value (0) to mean no maximum file size has been set - relying on js to understand 0 as a 'falsey' value. If max size is 0, then we skip the file size test entirely. Similarly, if no mime-types are in the accept array, we skip filtering the files by their type.",{"type":21,"tag":3549,"props":58382,"children":58384},{"id":58383},"better-docs",[58385],{"type":26,"value":58386},"Better Docs",{"type":21,"tag":22,"props":58388,"children":58389},{},[58390,58392,58399,58401,58407],{"type":26,"value":58391},"The documentation for HUp was a bit rushed. I followed the lead of my (still very alpha) ",{"type":21,"tag":29,"props":58393,"children":58396},{"href":58394,"rel":58395},"https://github.com/SaneMethod/KisKit",[93],[58397],{"type":26,"value":58398},"PHP Framework KisKit",{"type":26,"value":58400}," End Shameless Plug and tidied it up a bit. ",{"type":21,"tag":29,"props":58402,"children":58404},{"href":32587,"rel":58403},[93],[58405],{"type":26,"value":58406},"Take a look for yourself",{"type":26,"value":58408},", and feel free to open up an issue if you find bugs / want enhancements - your request might well make for a good future post. ;)",{"type":21,"tag":3490,"props":58410,"children":58411},{},[58412],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":58414},[58415,58416,58417],{"id":55791,"depth":244,"text":55794},{"id":58367,"depth":244,"text":58370},{"id":58383,"depth":244,"text":58386},"content:ckeefer:2013-5:ajax-uploader.md","ckeefer/2013-5/ajax-uploader.md","ckeefer/2013-5/ajax-uploader",{"user":3518,"name":3519},{"_path":58423,"_dir":58424,"_draft":7,"_partial":7,"_locale":8,"title":58425,"description":58426,"publishDate":58427,"tags":58428,"image":58430,"excerpt":58426,"body":58431,"_type":3511,"_id":58658,"_source":3513,"_file":58659,"_stem":58660,"_extension":3516,"author":58661},"/ckeefer/2014-1/still-using-php","2014-1","Still Using PHP?","Poor PHP. It's so lonely and unloved these days.","2014-01-29",[58429],"php","/ckeefer/2014-1/img/php.jpg",{"type":18,"children":58432,"toc":58656},[58433,58437,58460,58481,58486,58491,58496,58501,58506,58513,58526,58531,58536,58541,58546,58551,58556,58562,58590,58604,58609,58615,58628,58640,58651],{"type":21,"tag":22,"props":58434,"children":58435},{},[58436],{"type":26,"value":58426},{"type":21,"tag":22,"props":58438,"children":58439},{},[58440,58442,58449,58451,58458],{"type":26,"value":58441},"Well, maybe not lonely - it still undergirds Facebook, Wikipedia and Wordpress, amongst a ",{"type":21,"tag":29,"props":58443,"children":58446},{"href":58444,"rel":58445},"http://w3techs.com/technologies/overview/programming_language/all",[93],[58447],{"type":26,"value":58448},"fair number of others",{"type":26,"value":58450},". But, certainly, ",{"type":21,"tag":29,"props":58452,"children":58455},{"href":58453,"rel":58454},"http://me.veekun.com/blog/2012/04/09/php-a-fractal-of-bad-design/",[93],[58456],{"type":26,"value":58457},"unloved",{"type":26,"value":58459}," - and not without some justification.",{"type":21,"tag":22,"props":58461,"children":58462},{},[58463,58465,58470,58472,58479],{"type":26,"value":58464},"Despite working primarily with Python and Node on the server-side in recent years, I've always had a soft spot in my heart for PHP - I don't actually ",{"type":21,"tag":1084,"props":58466,"children":58467},{},[58468],{"type":26,"value":58469},"like",{"type":26,"value":58471}," it, but I tolerate it for its ",{"type":21,"tag":29,"props":58473,"children":58476},{"href":58474,"rel":58475},"http://www.infoq.com/presentations/php-history?utm_source=infoq&utm_medium=QCon_EarlyAccessVideos&utm_campaign=StrangeLoop2013",[93],[58477],{"type":26,"value":58478},"good points",{"type":26,"value":58480},", the way you would an eccentric uncle. PHP was the first web-oriented language I learned, and the thrill of the quick iteration it allowed, when coming from a C and Java background, was not to be denied.",{"type":21,"tag":22,"props":58482,"children":58483},{},[58484],{"type":26,"value":58485},"That said, I must still admit that PHP is, to put it nicely, something of a mess.",{"type":21,"tag":22,"props":58487,"children":58488},{},[58489],{"type":26,"value":58490},"The problem has always seemd to me to be that its being designed by committee - and one that has a difficult time agreeing on standard conventions, or what other programming language they're trying to ape. Most of my aggravation, petty thought it may be, still stems from its inconsistent function naming (does any given function use_underscores, camelCase or justsquishwordstogether? You won't know until you take yet another trip to the documentation). It also suffers from not being sure whether it wants to be functional or, post PHP 5, object-oriented, and ends up with a sometimes awkward mishmash of the two.",{"type":21,"tag":22,"props":58492,"children":58493},{},[58494],{"type":26,"value":58495},"Now, there are any number of programmer posts lamenting the state of PHP (usually written in the aftermath of a painful struggle with some complex legacy project); and most would attribute (or blame) PHP's continued dominance of a large percentage of projects to momentum and availability, rather than being in any way ideal.",{"type":21,"tag":22,"props":58497,"children":58498},{},[58499],{"type":26,"value":58500},"I would tend to agree.",{"type":21,"tag":22,"props":58502,"children":58503},{},[58504],{"type":26,"value":58505},"The winds of change are blowing though, slow but steady. Instead of yet another condemnation, let's look at some of those recent changes that might mean - whether weighing a rewrite versus continuing to use PHP for a legacy project, or even choosing a server-side language for a brand-new project - PHP might once again take a place amongst the options.",{"type":21,"tag":58507,"props":58508,"children":58510},"h1",{"id":58509},"php-fig",[58511],{"type":26,"value":58512},"PHP-FIG",{"type":21,"tag":22,"props":58514,"children":58515},{},[58516,58518,58525],{"type":26,"value":58517},"There's a lot of talented programmers working in the PHP ecosystem (whether they like it or not), and some big projects filling needed roles. Getting them all to work together would be a huge job - ideally, one that all of the projects involved would cooperate to bring about. For once, the ideal is actualized in the ",{"type":21,"tag":29,"props":58519,"children":58522},{"href":58520,"rel":58521},"http://www.php-fig.org/",[93],[58523],{"type":26,"value":58524},"PHP Framework Interop Group",{"type":26,"value":378},{"type":21,"tag":22,"props":58527,"children":58528},{},[58529],{"type":26,"value":58530},"Their page starts with a disclaimer that the standards they propose are not necessarily intended for the PHP community at large; but language-wide standards (for coding style, logging and autoloading right now with, I expect, more to come) are exactly what PHP needs.",{"type":21,"tag":22,"props":58532,"children":58533},{},[58534],{"type":26,"value":58535},"The autoloading in particular. Importing a library is blessedly easy in Python:",{"type":21,"tag":22,"props":58537,"children":58538},{},[58539],{"type":26,"value":58540},"[code lang=\"python\"] from wherever import whatever [/code]",{"type":21,"tag":22,"props":58542,"children":58543},{},[58544],{"type":26,"value":58545},"Accomplishing the same in PHP requires some effort to ensure the appropriate source file is included/required before you attempt to reference it in any way. But, if you conform to the autoloading standard, you can just plop at the top of your controller:",{"type":21,"tag":22,"props":58547,"children":58548},{},[58549],{"type":26,"value":58550},"[code lang=\"PHP\"] use wherever/whatever; [/code]",{"type":21,"tag":22,"props":58552,"children":58553},{},[58554],{"type":26,"value":58555},"For love of all that's good, if you're writing a PHP framework or library, conform to these standards! It will make your target developers lives easier, and make your library easy to discover and adopt.",{"type":21,"tag":58507,"props":58557,"children":58559},{"id":58558},"composer-and-packagist",[58560],{"type":26,"value":58561},"Composer and Packagist",{"type":21,"tag":22,"props":58563,"children":58564},{},[58565,58567,58574,58575,58582,58584,58589],{"type":26,"value":58566},"Ah, but how do they discover your library? In keeping with PHP's strong tradition of cribbing from other language's notes, ",{"type":21,"tag":29,"props":58568,"children":58571},{"href":58569,"rel":58570},"https://getcomposer.org/",[93],[58572],{"type":26,"value":58573},"Composer",{"type":26,"value":7274},{"type":21,"tag":29,"props":58576,"children":58579},{"href":58577,"rel":58578},"https://packagist.org/",[93],[58580],{"type":26,"value":58581},"Packagist",{"type":26,"value":58583}," would be familiar to anyone who has worked with Node and ",{"type":21,"tag":29,"props":58585,"children":58587},{"href":58586},"npmjs.org",[58588],{"type":26,"value":19351},{"type":26,"value":378},{"type":21,"tag":22,"props":58591,"children":58592},{},[58593,58595,58602],{"type":26,"value":58594},"Allowing you to specify the name and versions of the packages you need in the familiar JSON format, composer will automatically download the appropriate packages to a psr-0 or psr-4 compliant structure and generate the autoloader for you to use, making adding other libraries to your project almost painless. Its not sparsely supported, either - Symfony, Doctrine and other big names are available, along with ",{"type":21,"tag":29,"props":58596,"children":58599},{"href":58597,"rel":58598},"https://packagist.org/statistics",[93],[58600],{"type":26,"value":58601},"20,000+",{"type":26,"value":58603}," others.",{"type":21,"tag":22,"props":58605,"children":58606},{},[58607],{"type":26,"value":58608},"Composer can offer autloading of libraries and frameworks that aren't psr-0/4 compatible as well, along with a number of other capabilities and options. It plays nice with phing for your build process, if you so desire. Give it a look.",{"type":21,"tag":58507,"props":58610,"children":58612},{"id":58611},"hhvm",[58613],{"type":26,"value":58614},"HHVM",{"type":21,"tag":22,"props":58616,"children":58617},{},[58618,58619,58626],{"type":26,"value":108},{"type":21,"tag":29,"props":58620,"children":58623},{"href":58621,"rel":58622},"http://www.hhvm.com/blog/",[93],[58624],{"type":26,"value":58625},"Hip Hop Virtual Machine",{"type":26,"value":58627}," has created some buzz even in the corners of the net most hostile to PHP (ie. anywhere you find a large number of programmers). Improving the performance of PHP is a worthy goal in and of itself, of course - although it's not yet ready for prime-time, from the figures the hhvm team has posted, it looks like we're well on our way to having a powerful replacement for the Zend engine.",{"type":21,"tag":22,"props":58629,"children":58630},{},[58631,58633,58638],{"type":26,"value":58632},"That said, the real reason I'm excited about having a JITing virtual machine that's 100% compatible with PHP is that ",{"type":21,"tag":5270,"props":58634,"children":58635},{},[58636],{"type":26,"value":58637},"we may never need to write PHP again",{"type":26,"value":58639}," (and we may live to see the end of posts griping about it, as well).",{"type":21,"tag":22,"props":58641,"children":58642},{},[58643,58645,58649],{"type":26,"value":58644},"What's that you say? - after all this argument as to why PHP might deserve a place at the table, here I am arguing against it? But remember - I don't actually ",{"type":21,"tag":1084,"props":58646,"children":58647},{},[58648],{"type":26,"value":58469},{"type":26,"value":58650}," PHP; the previously mentioned standards and easy access to libraries can make programming in PHP much more tolerable, but can't fix elementary failings of the language. But being able to target the HHVM the way Scala, Clojure, Groovy et al. target the JVM would allow each programmer to pick the language that suits them best - and still get the benefits of easy deployment and compatibility with existing code and libraries.",{"type":21,"tag":22,"props":58652,"children":58653},{},[58654],{"type":26,"value":58655},"That would be the best of all worlds - all of PHP's strengths without any, well, PHP.",{"title":8,"searchDepth":254,"depth":254,"links":58657},[],"content:ckeefer:2014-1:still-using-php.md","ckeefer/2014-1/still-using-php.md","ckeefer/2014-1/still-using-php",{"user":3518,"name":3519},{"_path":58663,"_dir":58664,"_draft":7,"_partial":7,"_locale":8,"title":58665,"description":58666,"publishDate":58667,"tags":58668,"excerpt":58666,"body":58669,"_type":3511,"_id":59682,"_source":3513,"_file":59683,"_stem":59684,"_extension":3516,"author":59685},"/ckeefer/2013-12/deploying-with-git","2013-12","Deploying Websites with Git","Deploying your webapp is an important part of the web development equation - your client's site isn't going to attract a lot of attention sitting in your local dev directory. Deployment concerns tend to fall to the bottom of the priority list, though, and the end result tends to be kludgy, hastily thrown-together deployment scripts; and because they are so kludgy and, often, time consuming, when time crunches threaten, a developer may resort to making changes directly on the remote server that need to be (but sometimes never are) backported to the code living in your version control.","2013-12-23",[22630],{"type":18,"children":58670,"toc":59669},[58671,58675,58688,58693,58699,58713,58718,58768,58774,58784,58804,58865,58871,58884,58889,58895,58925,59082,59101,59106,59112,59123,59129,59142,59148,59160,59194,59207,59245,59266,59298,59310,59316,59345,59481,59487,59492,59497,59541,59560,59565,59603,59617,59623,59628,59655,59660,59665],{"type":21,"tag":22,"props":58672,"children":58673},{},[58674],{"type":26,"value":58666},{"type":21,"tag":22,"props":58676,"children":58677},{},[58678,58680,58686],{"type":26,"value":58679},"Wouldn't it be better if you could deploy your newest code with a single command, using the same tool you use for version control? One ",{"type":21,"tag":63,"props":58681,"children":58683},{"className":58682},[],[58684],{"type":26,"value":58685},"git push",{"type":26,"value":58687},", and your site is serving your newest commits. No more kludgy, multi-part scripts, no more threat of overwriting critical fixes with the next deploy.",{"type":21,"tag":22,"props":58689,"children":58690},{},[58691],{"type":26,"value":58692},"Let's make that happen.",{"type":21,"tag":3549,"props":58694,"children":58696},{"id":58695},"process-summary",[58697],{"type":26,"value":58698},"Process Summary",{"type":21,"tag":22,"props":58700,"children":58701},{},[58702,58704,58711],{"type":26,"value":58703},"The key lies in ",{"type":21,"tag":29,"props":58705,"children":58708},{"href":58706,"rel":58707},"https://www.kernel.org/pub/software/scm/git/docs/githooks.html",[93],[58709],{"type":26,"value":58710},"git hooks",{"type":26,"value":58712},", scripts that are triggered by certain git events (indicated by the name of the script itself), living in the $GIT_DIR/hooks directory.",{"type":21,"tag":22,"props":58714,"children":58715},{},[58716],{"type":26,"value":58717},"The process, then, is:",{"type":21,"tag":3739,"props":58719,"children":58720},{},[58721,58726,58731,58750,58763],{"type":21,"tag":3681,"props":58722,"children":58723},{},[58724],{"type":26,"value":58725},"Create a bare remote repository on our server;",{"type":21,"tag":3681,"props":58727,"children":58728},{},[58729],{"type":26,"value":58730},"Add this repo as a remote target for git;",{"type":21,"tag":3681,"props":58732,"children":58733},{},[58734,58736,58741,58743,58748],{"type":26,"value":58735},"Create a ",{"type":21,"tag":63,"props":58737,"children":58739},{"className":58738},[],[58740],{"type":26,"value":23115},{"type":26,"value":58742}," script to be run in the remote repo on receiving a ",{"type":21,"tag":63,"props":58744,"children":58746},{"className":58745},[],[58747],{"type":26,"value":58685},{"type":26,"value":58749},";",{"type":21,"tag":3681,"props":58751,"children":58752},{},[58753,58755,58761],{"type":26,"value":58754},"This script will ",{"type":21,"tag":63,"props":58756,"children":58758},{"className":58757},[],[58759],{"type":26,"value":58760},"git checkout -f",{"type":26,"value":58762}," the newest code to a work tree;",{"type":21,"tag":3681,"props":58764,"children":58765},{},[58766],{"type":26,"value":58767},"Miscellany, depending on your specific needs (discussed in more detail below).",{"type":21,"tag":3549,"props":58769,"children":58771},{"id":58770},"remote-setup",[58772],{"type":26,"value":58773},"Remote Setup",{"type":21,"tag":22,"props":58775,"children":58776},{},[58777,58782],{"type":21,"tag":5270,"props":58778,"children":58779},{},[58780],{"type":26,"value":58781},"Starting assumption:",{"type":26,"value":58783}," You have ssh access to your server.",{"type":21,"tag":3739,"props":58785,"children":58786},{},[58787,58799],{"type":21,"tag":3681,"props":58788,"children":58789},{},[58790,58792,58798],{"type":26,"value":58791},"In any directory you have write-access to (say /home/yourname) create a new directory. You can call it whatever you want, but for our purposes we'll assume you named it ",{"type":21,"tag":63,"props":58793,"children":58795},{"className":58794},[],[58796],{"type":26,"value":58797},">deploy.git",{"type":26,"value":378},{"type":21,"tag":3681,"props":58800,"children":58801},{},[58802],{"type":26,"value":58803},"cd to this directory, and initialize a new bare repository.",{"type":21,"tag":200,"props":58805,"children":58807},{"className":18972,"code":58806,"language":18974,"meta":8,"style":8},"$ mkdir deploy.git\n$ cd deploy.git\n$ git init --bare\n",[58808],{"type":21,"tag":63,"props":58809,"children":58810},{"__ignoreMap":8},[58811,58828,58844],{"type":21,"tag":209,"props":58812,"children":58813},{"class":211,"line":212},[58814,58818,58823],{"type":21,"tag":209,"props":58815,"children":58816},{"style":360},[58817],{"type":26,"value":10250},{"type":21,"tag":209,"props":58819,"children":58820},{"style":233},[58821],{"type":26,"value":58822}," mkdir",{"type":21,"tag":209,"props":58824,"children":58825},{"style":233},[58826],{"type":26,"value":58827}," deploy.git\n",{"type":21,"tag":209,"props":58829,"children":58830},{"class":211,"line":244},[58831,58835,58840],{"type":21,"tag":209,"props":58832,"children":58833},{"style":360},[58834],{"type":26,"value":10250},{"type":21,"tag":209,"props":58836,"children":58837},{"style":233},[58838],{"type":26,"value":58839}," cd",{"type":21,"tag":209,"props":58841,"children":58842},{"style":233},[58843],{"type":26,"value":58827},{"type":21,"tag":209,"props":58845,"children":58846},{"class":211,"line":254},[58847,58851,58855,58860],{"type":21,"tag":209,"props":58848,"children":58849},{"style":360},[58850],{"type":26,"value":10250},{"type":21,"tag":209,"props":58852,"children":58853},{"style":233},[58854],{"type":26,"value":19015},{"type":21,"tag":209,"props":58856,"children":58857},{"style":233},[58858],{"type":26,"value":58859}," init",{"type":21,"tag":209,"props":58861,"children":58862},{"style":263},[58863],{"type":26,"value":58864}," --bare\n",{"type":21,"tag":193,"props":58866,"children":58868},{"id":58867},"why-a-bare-repository",[58869],{"type":26,"value":58870},"Why a bare repository?",{"type":21,"tag":22,"props":58872,"children":58873},{},[58874,58876,58882],{"type":26,"value":58875},"A bare repository in git acts like a centralized server. Instead of the main directory being the working tree, with the git files stores in a ",{"type":21,"tag":63,"props":58877,"children":58879},{"className":58878},[],[58880],{"type":26,"value":58881},".git",{"type":26,"value":58883}," dir under said main directory, the main directory directly hosts the git files, and no working tree is present. Instead, it simply records commits, branches etc. when pushed to, and will return the latest versions when cloned or pulled from.",{"type":21,"tag":22,"props":58885,"children":58886},{},[58887],{"type":26,"value":58888},"In git version 1.7+, a repo must be bare in order to accept a push.",{"type":21,"tag":193,"props":58890,"children":58892},{"id":58891},"next-step",[58893],{"type":26,"value":58894},"Next step...",{"type":21,"tag":22,"props":58896,"children":58897},{},[58898,58900,58906,58908,58914,58916,58923],{"type":26,"value":58899},"Our next step will be to create the post-receive hook to checkout a branch to your server's document root (ie. ",{"type":21,"tag":63,"props":58901,"children":58903},{"className":58902},[],[58904],{"type":26,"value":58905},"/var/www",{"type":26,"value":58907},"). You'll likely want to set up a directory under this for your site if you expect to be serving multiple sites (ie.",{"type":21,"tag":63,"props":58909,"children":58911},{"className":58910},[],[58912],{"type":26,"value":58913},"/var/www/mysite",{"type":26,"value":58915},"), and set up the virtual host accordingly. ",{"type":21,"tag":29,"props":58917,"children":58920},{"href":58918,"rel":58919},"http://httpd.apache.org/docs/2.2/vhosts/name-based.html",[93],[58921],{"type":26,"value":58922},"Virtual hosts",{"type":26,"value":58924}," are beyond this article's scope.",{"type":21,"tag":200,"props":58926,"children":58928},{"className":18972,"code":58927,"language":18974,"meta":8,"style":8},"$ cd hooks\n$ vi post-receive\n|i|\n#!/bin/sh\nset -x\nGIT_WORK_TREE=/var/www git checkout -f\n|esc|\n|:wq|\n$ chmod +x post-receive\n",[58929],{"type":21,"tag":63,"props":58930,"children":58931},{"__ignoreMap":8},[58932,58948,58965,58982,58990,59002,59029,59045,59061],{"type":21,"tag":209,"props":58933,"children":58934},{"class":211,"line":212},[58935,58939,58943],{"type":21,"tag":209,"props":58936,"children":58937},{"style":360},[58938],{"type":26,"value":10250},{"type":21,"tag":209,"props":58940,"children":58941},{"style":233},[58942],{"type":26,"value":58839},{"type":21,"tag":209,"props":58944,"children":58945},{"style":233},[58946],{"type":26,"value":58947}," hooks\n",{"type":21,"tag":209,"props":58949,"children":58950},{"class":211,"line":244},[58951,58955,58960],{"type":21,"tag":209,"props":58952,"children":58953},{"style":360},[58954],{"type":26,"value":10250},{"type":21,"tag":209,"props":58956,"children":58957},{"style":233},[58958],{"type":26,"value":58959}," vi",{"type":21,"tag":209,"props":58961,"children":58962},{"style":233},[58963],{"type":26,"value":58964}," post-receive\n",{"type":21,"tag":209,"props":58966,"children":58967},{"class":211,"line":254},[58968,58973,58978],{"type":21,"tag":209,"props":58969,"children":58970},{"style":216},[58971],{"type":26,"value":58972},"|",{"type":21,"tag":209,"props":58974,"children":58975},{"style":360},[58976],{"type":26,"value":58977},"i",{"type":21,"tag":209,"props":58979,"children":58980},{"style":216},[58981],{"type":26,"value":36711},{"type":21,"tag":209,"props":58983,"children":58984},{"class":211,"line":279},[58985],{"type":21,"tag":209,"props":58986,"children":58987},{"style":448},[58988],{"type":26,"value":58989},"#!/bin/sh\n",{"type":21,"tag":209,"props":58991,"children":58992},{"class":211,"line":288},[58993,58997],{"type":21,"tag":209,"props":58994,"children":58995},{"style":263},[58996],{"type":26,"value":6891},{"type":21,"tag":209,"props":58998,"children":58999},{"style":263},[59000],{"type":26,"value":59001}," -x\n",{"type":21,"tag":209,"props":59003,"children":59004},{"class":211,"line":307},[59005,59009,59013,59017,59021,59025],{"type":21,"tag":209,"props":59006,"children":59007},{"style":222},[59008],{"type":26,"value":19001},{"type":21,"tag":209,"props":59010,"children":59011},{"style":216},[59012],{"type":26,"value":1432},{"type":21,"tag":209,"props":59014,"children":59015},{"style":233},[59016],{"type":26,"value":58905},{"type":21,"tag":209,"props":59018,"children":59019},{"style":360},[59020],{"type":26,"value":19015},{"type":21,"tag":209,"props":59022,"children":59023},{"style":233},[59024],{"type":26,"value":19020},{"type":21,"tag":209,"props":59026,"children":59027},{"style":263},[59028],{"type":26,"value":19025},{"type":21,"tag":209,"props":59030,"children":59031},{"class":211,"line":325},[59032,59036,59041],{"type":21,"tag":209,"props":59033,"children":59034},{"style":216},[59035],{"type":26,"value":58972},{"type":21,"tag":209,"props":59037,"children":59038},{"style":360},[59039],{"type":26,"value":59040},"esc",{"type":21,"tag":209,"props":59042,"children":59043},{"style":216},[59044],{"type":26,"value":36711},{"type":21,"tag":209,"props":59046,"children":59047},{"class":211,"line":334},[59048,59052,59057],{"type":21,"tag":209,"props":59049,"children":59050},{"style":216},[59051],{"type":26,"value":58972},{"type":21,"tag":209,"props":59053,"children":59054},{"style":360},[59055],{"type":26,"value":59056},":wq",{"type":21,"tag":209,"props":59058,"children":59059},{"style":216},[59060],{"type":26,"value":36711},{"type":21,"tag":209,"props":59062,"children":59063},{"class":211,"line":343},[59064,59068,59073,59078],{"type":21,"tag":209,"props":59065,"children":59066},{"style":360},[59067],{"type":26,"value":10250},{"type":21,"tag":209,"props":59069,"children":59070},{"style":233},[59071],{"type":26,"value":59072}," chmod",{"type":21,"tag":209,"props":59074,"children":59075},{"style":233},[59076],{"type":26,"value":59077}," +x",{"type":21,"tag":209,"props":59079,"children":59080},{"style":233},[59081],{"type":26,"value":58964},{"type":21,"tag":22,"props":59083,"children":59084},{},[59085,59087,59093,59095],{"type":26,"value":59086},"If you want to force a particular branch to be checked out (say, ",{"type":21,"tag":63,"props":59088,"children":59090},{"className":59089},[],[59091],{"type":26,"value":59092},"develop",{"type":26,"value":59094},"), just specify it at the end of the command as: ",{"type":21,"tag":63,"props":59096,"children":59098},{"className":59097},[],[59099],{"type":26,"value":59100},"GIT_WORK_TREE=/var/www git checkout -f develop",{"type":21,"tag":22,"props":59102,"children":59103},{},[59104],{"type":26,"value":59105},"Otherwise, you can expect that the branch we specify as master (below) will be the one getting checkout out.",{"type":21,"tag":193,"props":59107,"children":59109},{"id":59108},"im-getting-permission-errors",[59110],{"type":26,"value":59111},"I'm getting permission errors.",{"type":21,"tag":22,"props":59113,"children":59114},{},[59115,59117,59122],{"type":26,"value":59116},"You need to ensure the user that the post-receive hook is running as has write permissions on the working tree directory (in this case, ",{"type":21,"tag":63,"props":59118,"children":59120},{"className":59119},[],[59121],{"type":26,"value":58905},{"type":26,"value":2699},{"type":21,"tag":193,"props":59124,"children":59126},{"id":59125},"why-am-i-getting-bad-default-revision-head-errors",[59127],{"type":26,"value":59128},"Why am I getting 'bad default revision HEAD' errors?",{"type":21,"tag":22,"props":59130,"children":59131},{},[59132,59134,59140],{"type":26,"value":59133},"Potentially you haven't commited anything to this repo yet. Otherwise, you need to tell git which branch you want it to check out - either perform an initial ",{"type":21,"tag":63,"props":59135,"children":59137},{"className":59136},[],[59138],{"type":26,"value":59139},"git checkout |branchname|",{"type":26,"value":59141}," or add the branch name to the end of the checkout command in the post-receive script.",{"type":21,"tag":193,"props":59143,"children":59145},{"id":59144},"local-setup",[59146],{"type":26,"value":59147},"Local Setup",{"type":21,"tag":22,"props":59149,"children":59150},{},[59151,59153,59158],{"type":26,"value":59152},"Starting assumption: You have an already initialized git repo locally. If not, run ",{"type":21,"tag":63,"props":59154,"children":59156},{"className":59155},[],[59157],{"type":26,"value":23135},{"type":26,"value":59159}," in the top-level directory you want to track, and make an initial commit:",{"type":21,"tag":200,"props":59161,"children":59163},{"className":18972,"code":59162,"language":18974,"meta":8,"style":8},"git commit -a -m \"Initial Commit.\"\n",[59164],{"type":21,"tag":63,"props":59165,"children":59166},{"__ignoreMap":8},[59167],{"type":21,"tag":209,"props":59168,"children":59169},{"class":211,"line":212},[59170,59174,59179,59184,59189],{"type":21,"tag":209,"props":59171,"children":59172},{"style":360},[59173],{"type":26,"value":22630},{"type":21,"tag":209,"props":59175,"children":59176},{"style":233},[59177],{"type":26,"value":59178}," commit",{"type":21,"tag":209,"props":59180,"children":59181},{"style":263},[59182],{"type":26,"value":59183}," -a",{"type":21,"tag":209,"props":59185,"children":59186},{"style":263},[59187],{"type":26,"value":59188}," -m",{"type":21,"tag":209,"props":59190,"children":59191},{"style":233},[59192],{"type":26,"value":59193}," \"Initial Commit.\"\n",{"type":21,"tag":22,"props":59195,"children":59196},{},[59197,59199,59205],{"type":26,"value":59198},"In your git repo directory, add your new remote repo to git, and give it a meaningful name (in this case, we'll use ",{"type":21,"tag":63,"props":59200,"children":59202},{"className":59201},[],[59203],{"type":26,"value":59204},"staging",{"type":26,"value":59206}," ).",{"type":21,"tag":200,"props":59208,"children":59210},{"className":18972,"code":59209,"language":18974,"meta":8,"style":8},"$ git remote add staging ssh://yourname@example.server.com/home/yourname/deploy.git\n",[59211],{"type":21,"tag":63,"props":59212,"children":59213},{"__ignoreMap":8},[59214],{"type":21,"tag":209,"props":59215,"children":59216},{"class":211,"line":212},[59217,59221,59225,59230,59235,59240],{"type":21,"tag":209,"props":59218,"children":59219},{"style":360},[59220],{"type":26,"value":10250},{"type":21,"tag":209,"props":59222,"children":59223},{"style":233},[59224],{"type":26,"value":19015},{"type":21,"tag":209,"props":59226,"children":59227},{"style":233},[59228],{"type":26,"value":59229}," remote",{"type":21,"tag":209,"props":59231,"children":59232},{"style":233},[59233],{"type":26,"value":59234}," add",{"type":21,"tag":209,"props":59236,"children":59237},{"style":233},[59238],{"type":26,"value":59239}," staging",{"type":21,"tag":209,"props":59241,"children":59242},{"style":233},[59243],{"type":26,"value":59244}," ssh://yourname@example.server.com/home/yourname/deploy.git\n",{"type":21,"tag":22,"props":59246,"children":59247},{},[59248,59250,59256,59258,59264],{"type":26,"value":59249},"Force push to the remote repo, using the HEAD of your current branch as the master. If you want to push a different branch, you can specify it with ",{"type":21,"tag":63,"props":59251,"children":59253},{"className":59252},[],[59254],{"type":26,"value":59255},"refs/heads/branchname",{"type":26,"value":59257}," where 'branchname' is the name of the branch, or you can just ",{"type":21,"tag":63,"props":59259,"children":59261},{"className":59260},[],[59262],{"type":26,"value":59263},"git checkout",{"type":26,"value":59265}," the appropriate branch.",{"type":21,"tag":200,"props":59267,"children":59269},{"className":18972,"code":59268,"language":18974,"meta":8,"style":8},"$ git push staging +master:HEAD\n",[59270],{"type":21,"tag":63,"props":59271,"children":59272},{"__ignoreMap":8},[59273],{"type":21,"tag":209,"props":59274,"children":59275},{"class":211,"line":212},[59276,59280,59284,59289,59293],{"type":21,"tag":209,"props":59277,"children":59278},{"style":360},[59279],{"type":26,"value":10250},{"type":21,"tag":209,"props":59281,"children":59282},{"style":233},[59283],{"type":26,"value":19015},{"type":21,"tag":209,"props":59285,"children":59286},{"style":233},[59287],{"type":26,"value":59288}," push",{"type":21,"tag":209,"props":59290,"children":59291},{"style":233},[59292],{"type":26,"value":59239},{"type":21,"tag":209,"props":59294,"children":59295},{"style":233},[59296],{"type":26,"value":59297}," +master:HEAD\n",{"type":21,"tag":22,"props":59299,"children":59300},{},[59301,59303,59308],{"type":26,"value":59302},"You should receive output from the server detailing the successful execution of your script. If all went well, your files should now be checked out into the ",{"type":21,"tag":63,"props":59304,"children":59306},{"className":59305},[],[59307],{"type":26,"value":58905},{"type":26,"value":59309}," directory, with the git metadata remaining in your /home/yourname/deploy.git directory.",{"type":21,"tag":193,"props":59311,"children":59313},{"id":59312},"what-if-i-have-an-existing-directory-structure-i-need-to-maintain-or-i-dont-want-all-of-the-files-in-my-repo-sent-to-varwww",[59314],{"type":26,"value":59315},"What if I have an existing directory structure I need to maintain? Or I don't want all of the files in my repo sent to /var/www?",{"type":21,"tag":22,"props":59317,"children":59318},{},[59319,59321,59328,59330,59336,59338,59343],{"type":26,"value":59320},"In this case, you'll need to set a different git work tree and copy the directories/files you need independantly from said work tree directory to /var/",{"type":21,"tag":29,"props":59322,"children":59325},{"href":59323,"rel":59324},"http://www",[93],[59326],{"type":26,"value":59327},"www",{"type":26,"value":59329},". You'll want to create an additional directory (say, ",{"type":21,"tag":63,"props":59331,"children":59333},{"className":59332},[],[59334],{"type":26,"value":59335},"$mkdir /home/yourname/workdeploy",{"type":26,"value":59337}," that the files will be checkout out into, and then copy what you want across - this can all go into the ",{"type":21,"tag":63,"props":59339,"children":59341},{"className":59340},[],[59342],{"type":26,"value":23115},{"type":26,"value":59344}," hook. This could look like:",{"type":21,"tag":200,"props":59346,"children":59348},{"className":18972,"code":59347,"language":18974,"meta":8,"style":8},"#!/bin/bash\nset -x\nGIT_WORK_DIR=/home/yourname/workdeploy\nDOC_ROOT=/var/www\n\nGIT_WORK_TREE=$GIT_WORK_DIR git checkout -f\nrsync -rlD --delete --omoit-dir-times \"$GIT_WORK_DIR/desired_subdirectory\" $DOC_ROOT\n",[59349],{"type":21,"tag":63,"props":59350,"children":59351},{"__ignoreMap":8},[59352,59359,59370,59387,59404,59411,59439],{"type":21,"tag":209,"props":59353,"children":59354},{"class":211,"line":212},[59355],{"type":21,"tag":209,"props":59356,"children":59357},{"style":448},[59358],{"type":26,"value":18986},{"type":21,"tag":209,"props":59360,"children":59361},{"class":211,"line":244},[59362,59366],{"type":21,"tag":209,"props":59363,"children":59364},{"style":263},[59365],{"type":26,"value":6891},{"type":21,"tag":209,"props":59367,"children":59368},{"style":263},[59369],{"type":26,"value":59001},{"type":21,"tag":209,"props":59371,"children":59372},{"class":211,"line":254},[59373,59378,59382],{"type":21,"tag":209,"props":59374,"children":59375},{"style":222},[59376],{"type":26,"value":59377},"GIT_WORK_DIR",{"type":21,"tag":209,"props":59379,"children":59380},{"style":216},[59381],{"type":26,"value":1432},{"type":21,"tag":209,"props":59383,"children":59384},{"style":233},[59385],{"type":26,"value":59386},"/home/yourname/workdeploy\n",{"type":21,"tag":209,"props":59388,"children":59389},{"class":211,"line":279},[59390,59395,59399],{"type":21,"tag":209,"props":59391,"children":59392},{"style":222},[59393],{"type":26,"value":59394},"DOC_ROOT",{"type":21,"tag":209,"props":59396,"children":59397},{"style":216},[59398],{"type":26,"value":1432},{"type":21,"tag":209,"props":59400,"children":59401},{"style":233},[59402],{"type":26,"value":59403},"/var/www\n",{"type":21,"tag":209,"props":59405,"children":59406},{"class":211,"line":288},[59407],{"type":21,"tag":209,"props":59408,"children":59409},{"emptyLinePlaceholder":248},[59410],{"type":26,"value":251},{"type":21,"tag":209,"props":59412,"children":59413},{"class":211,"line":307},[59414,59418,59422,59427,59431,59435],{"type":21,"tag":209,"props":59415,"children":59416},{"style":222},[59417],{"type":26,"value":19001},{"type":21,"tag":209,"props":59419,"children":59420},{"style":216},[59421],{"type":26,"value":1432},{"type":21,"tag":209,"props":59423,"children":59424},{"style":222},[59425],{"type":26,"value":59426},"$GIT_WORK_DIR ",{"type":21,"tag":209,"props":59428,"children":59429},{"style":360},[59430],{"type":26,"value":22630},{"type":21,"tag":209,"props":59432,"children":59433},{"style":233},[59434],{"type":26,"value":19020},{"type":21,"tag":209,"props":59436,"children":59437},{"style":263},[59438],{"type":26,"value":19025},{"type":21,"tag":209,"props":59440,"children":59441},{"class":211,"line":325},[59442,59447,59452,59457,59462,59466,59471,59476],{"type":21,"tag":209,"props":59443,"children":59444},{"style":360},[59445],{"type":26,"value":59446},"rsync",{"type":21,"tag":209,"props":59448,"children":59449},{"style":263},[59450],{"type":26,"value":59451}," -rlD",{"type":21,"tag":209,"props":59453,"children":59454},{"style":263},[59455],{"type":26,"value":59456}," --delete",{"type":21,"tag":209,"props":59458,"children":59459},{"style":263},[59460],{"type":26,"value":59461}," --omoit-dir-times",{"type":21,"tag":209,"props":59463,"children":59464},{"style":233},[59465],{"type":26,"value":34450},{"type":21,"tag":209,"props":59467,"children":59468},{"style":222},[59469],{"type":26,"value":59470},"$GIT_WORK_DIR",{"type":21,"tag":209,"props":59472,"children":59473},{"style":233},[59474],{"type":26,"value":59475},"/desired_subdirectory\"",{"type":21,"tag":209,"props":59477,"children":59478},{"style":222},[59479],{"type":26,"value":59480}," $DOC_ROOT\n",{"type":21,"tag":193,"props":59482,"children":59484},{"id":59483},"i-need-to-run-sudo-commands-inside-of-post-receive-or-im-receiving-errors-about-askpass-or-im-receiving-errors-about-requiretty",[59485],{"type":26,"value":59486},"I need to run sudo commands inside of post-receive; or, I'm receiving errors about 'askpass'; or, I'm receiving errors about 'requiretty'.",{"type":21,"tag":22,"props":59488,"children":59489},{},[59490],{"type":26,"value":59491},"You'll need to change some settings in your /etc/sudoers file in order to run commands on the server remotely if requiretty is set, and you'll need to make further changes if you want to be able to run sudo commands remotely without needing to enter your password each time (potentially, you could also have a password agent running).",{"type":21,"tag":22,"props":59493,"children":59494},{},[59495],{"type":26,"value":59496},"Note that the following reduces your system's security by a certain degree (passwords are still needed for initial remote login).",{"type":21,"tag":200,"props":59498,"children":59500},{"className":18972,"code":59499,"language":18974,"meta":8,"style":8},"$ sudo su - #to become root and inherit root path\n$ visudo\n",[59501],{"type":21,"tag":63,"props":59502,"children":59503},{"__ignoreMap":8},[59504,59529],{"type":21,"tag":209,"props":59505,"children":59506},{"class":211,"line":212},[59507,59511,59516,59520,59524],{"type":21,"tag":209,"props":59508,"children":59509},{"style":360},[59510],{"type":26,"value":10250},{"type":21,"tag":209,"props":59512,"children":59513},{"style":233},[59514],{"type":26,"value":59515}," sudo",{"type":21,"tag":209,"props":59517,"children":59518},{"style":233},[59519],{"type":26,"value":19396},{"type":21,"tag":209,"props":59521,"children":59522},{"style":233},[59523],{"type":26,"value":12414},{"type":21,"tag":209,"props":59525,"children":59526},{"style":448},[59527],{"type":26,"value":59528}," #to become root and inherit root path\n",{"type":21,"tag":209,"props":59530,"children":59531},{"class":211,"line":244},[59532,59536],{"type":21,"tag":209,"props":59533,"children":59534},{"style":360},[59535],{"type":26,"value":10250},{"type":21,"tag":209,"props":59537,"children":59538},{"style":233},[59539],{"type":26,"value":59540}," visudo\n",{"type":21,"tag":22,"props":59542,"children":59543},{},[59544,59546,59552,59554],{"type":26,"value":59545},"Within visudo, you'll need to add the following after the ",{"type":21,"tag":63,"props":59547,"children":59549},{"className":59548},[],[59550],{"type":26,"value":59551},"Default",{"type":26,"value":59553}," directive: ",{"type":21,"tag":63,"props":59555,"children":59557},{"className":59556},[],[59558],{"type":26,"value":59559},"Defaults:yourusername !requiretty",{"type":21,"tag":22,"props":59561,"children":59562},{},[59563],{"type":26,"value":59564},"Within visudo, you'll also need to enter the following at the very end of the file to allow for passwordless execution of sudo:",{"type":21,"tag":200,"props":59566,"children":59568},{"className":18972,"code":59567,"language":18974,"meta":8,"style":8},"yourusername ALL=(ALL) NOPASSWD:ALL\n",[59569],{"type":21,"tag":63,"props":59570,"children":59571},{"__ignoreMap":8},[59572],{"type":21,"tag":209,"props":59573,"children":59574},{"class":211,"line":212},[59575,59580,59585,59589,59594,59598],{"type":21,"tag":209,"props":59576,"children":59577},{"style":360},[59578],{"type":26,"value":59579},"yourusername",{"type":21,"tag":209,"props":59581,"children":59582},{"style":233},[59583],{"type":26,"value":59584}," ALL=",{"type":21,"tag":209,"props":59586,"children":59587},{"style":222},[59588],{"type":26,"value":368},{"type":21,"tag":209,"props":59590,"children":59591},{"style":360},[59592],{"type":26,"value":59593},"ALL",{"type":21,"tag":209,"props":59595,"children":59596},{"style":222},[59597],{"type":26,"value":432},{"type":21,"tag":209,"props":59599,"children":59600},{"style":233},[59601],{"type":26,"value":59602},"NOPASSWD:ALL\n",{"type":21,"tag":22,"props":59604,"children":59605},{},[59606,59608,59615],{"type":26,"value":59607},"I assume that if you have sudo priviledges, you know better than to alter sudoers rashly. You can ",{"type":21,"tag":29,"props":59609,"children":59612},{"href":59610,"rel":59611},"http://askubuntu.com/a/155827",[93],[59613],{"type":26,"value":59614},"limit what can be executed passwordless with sudo",{"type":26,"value":59616}," if you know what specific commands or scripts you'll need to run.",{"type":21,"tag":51,"props":59618,"children":59620},{"id":59619},"updating",[59621],{"type":26,"value":59622},"Updating",{"type":21,"tag":22,"props":59624,"children":59625},{},[59626],{"type":26,"value":59627},"Alright, now that all the nasty bits are out of the way, how do we use this? From your local repo directory:",{"type":21,"tag":200,"props":59629,"children":59631},{"className":18972,"code":59630,"language":18974,"meta":8,"style":8},"$ git push staging\n",[59632],{"type":21,"tag":63,"props":59633,"children":59634},{"__ignoreMap":8},[59635],{"type":21,"tag":209,"props":59636,"children":59637},{"class":211,"line":212},[59638,59642,59646,59650],{"type":21,"tag":209,"props":59639,"children":59640},{"style":360},[59641],{"type":26,"value":10250},{"type":21,"tag":209,"props":59643,"children":59644},{"style":233},[59645],{"type":26,"value":19015},{"type":21,"tag":209,"props":59647,"children":59648},{"style":233},[59649],{"type":26,"value":59288},{"type":21,"tag":209,"props":59651,"children":59652},{"style":233},[59653],{"type":26,"value":59654}," staging\n",{"type":21,"tag":22,"props":59656,"children":59657},{},[59658],{"type":26,"value":59659},"Optionally, you can add the branchname to push to the end of that line. And that's it. That's the whole thing. Typing that updates your server with the newest commits.",{"type":21,"tag":22,"props":59661,"children":59662},{},[59663],{"type":26,"value":59664},"It's beautiful, ain't it? :)",{"type":21,"tag":3490,"props":59666,"children":59667},{},[59668],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":59670},[59671,59672],{"id":58695,"depth":244,"text":58698},{"id":58770,"depth":244,"text":58773,"children":59673},[59674,59675,59676,59677,59678,59679,59680,59681],{"id":58867,"depth":279,"text":58870},{"id":58891,"depth":279,"text":58894},{"id":59108,"depth":279,"text":59111},{"id":59125,"depth":279,"text":59128},{"id":59144,"depth":279,"text":59147},{"id":59312,"depth":279,"text":59315},{"id":59483,"depth":279,"text":59486},{"id":59619,"depth":254,"text":59622},"content:ckeefer:2013-12:deploying-with-git.md","ckeefer/2013-12/deploying-with-git.md","ckeefer/2013-12/deploying-with-git",{"user":3518,"name":3519},{"_path":59687,"_dir":59688,"_draft":7,"_partial":7,"_locale":8,"title":59689,"description":59690,"publishDate":59691,"tags":59692,"excerpt":59690,"body":59694,"_type":3511,"_id":59984,"_source":3513,"_file":59985,"_stem":59986,"_extension":3516,"author":59987},"/ckeefer/2013-4/teaching-programming","2013-4","Can (and Should) Everyone Learn to Program?","Fair warning: The following article is long, rambly, and contains no code. It does, however, contain some rumination on the idea that everyone can and should learn to program.","2013-12-03",[59693],"programming",{"type":18,"children":59695,"toc":59982},[59696,59700,59708,59713,59718,59726,59731,59774,59787,59792,59797,59805,59824,59829,59834,59850,59855,59860,59865,59870,59881,59886,59894,59899,59904,59912,59917,59922,59930,59944,59949,59957,59962,59967,59972,59977],{"type":21,"tag":22,"props":59697,"children":59698},{},[59699],{"type":26,"value":59690},{"type":21,"tag":4462,"props":59701,"children":59702},{},[59703],{"type":21,"tag":22,"props":59704,"children":59705},{},[59706],{"type":26,"value":59707},"So, I was just thinking, it would be really great if you could come present to my CS class - talk about programming in general, as a job, that kind of thing.",{"type":21,"tag":22,"props":59709,"children":59710},{},[59711],{"type":26,"value":59712},"Recently an old university friend of mine, now a Math and Physics teacher, was tasked by his administration with teaching computer science to his highschool students.",{"type":21,"tag":22,"props":59714,"children":59715},{},[59716],{"type":26,"value":59717},"His experience with CS being limited to the half a dozen or so courses he took years ago to fill out the minor requirements of his degree, and the prescribed curriculum being heavy on the history and ethics of computing and light on actual programming content, he's been struggling with how best to present the essential concepts in a way that would appeal to typically lethargic teenagers.",{"type":21,"tag":4462,"props":59719,"children":59720},{},[59721],{"type":21,"tag":22,"props":59722,"children":59723},{},[59724],{"type":26,"value":59725},"They really need to be taking the work home, exploring the concepts on their own - there's only so much we can do in an hour a day. There's all sorts of resources out there - I just need a way to spark some excitement about programming in them. Maybe having a 'real' programmer come in would be helpful?",{"type":21,"tag":22,"props":59727,"children":59728},{},[59729],{"type":26,"value":59730},"I agreed, and began to prepare my presentation. While the Way of the Programmer had been known to me since the childhood discovery of the QBasic interpreter in DOS, it wasn't until highschool that I truly took the first steps on this Path to Enlightenment - thanks in large part to a wise teacher/mentor, as per the trope. Doing my part to introduce some young minds to this sometimes frustrating, but often rewarding discipline would be a Good Deed®.",{"type":21,"tag":22,"props":59732,"children":59733},{},[59734,59736,59743,59744,59751,59752,59759,59761,59765,59767,59772],{"type":26,"value":59735},"I had an additional ulterior motive, however. I had often seen espoused - mostly in various communities populated primarily by programmers (such as Hacker News) - the opinion that programming was/is the new literacy; that is, a basic element of education that everyone can and should learn. Both they and my teacher friend had noted the ever-expanding collection of sites dedicated to teaching programming: ",{"type":21,"tag":29,"props":59737,"children":59740},{"href":59738,"rel":59739},"http://codeacademy.com",[93],[59741],{"type":26,"value":59742},"Code Academy",{"type":26,"value":408},{"type":21,"tag":29,"props":59745,"children":59748},{"href":59746,"rel":59747},"http://starterleague.com",[93],[59749],{"type":26,"value":59750},"Starter League",{"type":26,"value":408},{"type":21,"tag":29,"props":59753,"children":59756},{"href":59754,"rel":59755},"http://code.org",[93],[59757],{"type":26,"value":59758},"Code.org",{"type":26,"value":59760},", amongst many others. They seemed certain that not only ",{"type":21,"tag":1084,"props":59762,"children":59763},{},[59764],{"type":26,"value":9149},{"type":26,"value":59766}," anyone learn programming, but everyone ",{"type":21,"tag":1084,"props":59768,"children":59769},{},[59770],{"type":26,"value":59771},"should",{"type":26,"value":59773}," learn programming.",{"type":21,"tag":22,"props":59775,"children":59776},{},[59777,59779,59785],{"type":26,"value":59778},"I wondered if anyone not already committed to our discipline felt the same way - particularly the students who should apparently be learning their ",{"type":21,"tag":63,"props":59780,"children":59782},{"className":59781},[],[59783],{"type":26,"value":59784},"if, while, foreach",{"type":26,"value":59786}," alongside their ABCs.",{"type":21,"tag":22,"props":59788,"children":59789},{},[59790],{"type":26,"value":59791},"Here was a chance to find out.",{"type":21,"tag":22,"props":59793,"children":59794},{},[59795],{"type":26,"value":59796},"While I mostly wanted to present on programming as a career, my friend had asked that I cover some programming topics and be receptive to any questions the students might have. Also, I wanted to present them with a little programming challenge to cap off the presentation - something simple they could achieve that might spark interest in some of the more complex challenges or learning resources on the web. So, before preparing my presentation, my friend and I had a chat about where his students currently were, programming-wise, three months into the course.",{"type":21,"tag":4462,"props":59798,"children":59799},{},[59800],{"type":21,"tag":22,"props":59801,"children":59802},{},[59803],{"type":26,"value":59804},"Well, I started off trying to take them through some basic control structures - if/else, loops, etc. - but they just couldn't follow the logic. They had a tough time grasping why functions or classes were better than just writing everything in main(), so I had to back off there too. I'm hoping to work them back up to it, but we've really only gotten as far as some basic string manipulation. They... really like video games, though.",{"type":21,"tag":22,"props":59806,"children":59807},{},[59808,59810,59815,59817,59822],{"type":26,"value":59809},"I thanked my friend for his time, feeling reflective. These were students who had ",{"type":21,"tag":1084,"props":59811,"children":59812},{},[59813],{"type":26,"value":59814},"chosen",{"type":26,"value":59816}," to take a programming course, in place of another science-related elective - assumably amongst their student population, they would be the ones most interested in (and, by extension, most capable of) learning to program. The unworthy thought that perhaps my teacher friend was just ",{"type":21,"tag":1084,"props":59818,"children":59819},{},[59820],{"type":26,"value":59821},"teaching it wrong",{"type":26,"value":59823}," flitted across my mind - while he is a far better mathematician than I will ever be, his CS experience is, as previously mentioned, fairly limited.",{"type":21,"tag":22,"props":59825,"children":59826},{},[59827],{"type":26,"value":59828},"But even if this were true (and I'm quite certain it is not), by the arguments of many of the programming literacy advocates, that shouldn't really matter - these students could always supplement a lackluster in-school education with any of the numerous self-teaching resources.",{"type":21,"tag":22,"props":59830,"children":59831},{},[59832],{"type":26,"value":59833},"The presentation itself went well, I feel - the class was attentive and responsive (as much so as any group of teenagers early in the morning ever are). It was, however, easy to pick out those in the class with minds inclined towards programming. There were moments of dawning comprehension that could be seen in them - not just a matter of possessing more knowledge than their fellows, but the ability to grasp abstractions and make logical connections that the others in the class could not.",{"type":21,"tag":22,"props":59835,"children":59836},{},[59837,59839,59843,59845,59849],{"type":26,"value":59838},"Before expanding upon the previous comment, let's note again the assertions we are considering: that everyone ",{"type":21,"tag":1084,"props":59840,"children":59841},{},[59842],{"type":26,"value":49481},{"type":26,"value":59844}," learn programming, and that everyone ",{"type":21,"tag":1084,"props":59846,"children":59847},{},[59848],{"type":26,"value":59771},{"type":26,"value":59773},{"type":21,"tag":22,"props":59851,"children":59852},{},[59853],{"type":26,"value":59854},"I've been an athlete for much of my life, and in that arena of life, it's no secret that some people have significant advantages over others. Training is required to reach the pinnacle of personal ability - but it is one's personal ability that is in question. Some people are, and with all else equal will continue to be, taller, stronger, or faster than others; genetics does not adhere to egalitarian principles.",{"type":21,"tag":22,"props":59856,"children":59857},{},[59858],{"type":26,"value":59859},"I strongly suspect that this is true of the mind as well. That's not to say that some people have strong minds, and others weak, anymore than one would categorize all bodies as either strong or weak. Rather, in much the way that an individual might be predisposed towards excellent performance in basketball by being exceptionally tall and possessing good hand-eye coordination, or succeed as a contest-winning bodybuilder by possessing the genetic predisposition towards lean muscle gain; in this way, so too are some minds better equipped 'out of the box' for various types of mental tasks and, all else being equal, will always excel at them relative to their peers. Training can benefit any body, and so too any mind - but there are natural limits imposed by the individual's physical 'hardware' (or wetware, in this instance).",{"type":21,"tag":22,"props":59861,"children":59862},{},[59863],{"type":26,"value":59864},"So, can anyone learn to program? Probably - but maybe not to the same degree.",{"type":21,"tag":22,"props":59866,"children":59867},{},[59868],{"type":26,"value":59869},"Aside: I know this is a major claim to make on the basis of a single presentation to a single class and some years worth of anecdotal evidence. Luckily, scientific rigour is not a requirement for blog posts. :) I look forward to seeing some real studies done on this topic, someday... perhaps if/when programming truly becomes considered as essential as primary human language literacy.",{"type":21,"tag":22,"props":59871,"children":59872},{},[59873,59875,59879],{"type":26,"value":59874},"Let's turn our attention on the second part of the premise, now: that everyone ",{"type":21,"tag":1084,"props":59876,"children":59877},{},[59878],{"type":26,"value":59771},{"type":26,"value":59880}," learn to program. It seems obvious to a programmer, of course - computers are everywhere, and programming is how one interacts most directly and powerfully with these devices. The more computer-centric our society becomes, the more imperative it is that everyone know how to program.",{"type":21,"tag":22,"props":59882,"children":59883},{},[59884],{"type":26,"value":59885},"In the classroom, the scenario plays out differently. Near the middle of the presentation, I broke out the whiteboard marker and began an exploration of binary and hexadecimal with them. After breaking down the place value of each bit, we talked about the total value of a single byte - 128+64+32+16+8+4+2+1 = decimal 255. Then, we broke apart a two-digit hexadecimal number.",{"type":21,"tag":4462,"props":59887,"children":59888},{},[59889],{"type":21,"tag":22,"props":59890,"children":59891},{},[59892],{"type":26,"value":59893},"So, if the ones column can contain values from 0-15, represented by 0-9, A-F, and what would be the 'tens' column for decimal is here the 'sixteens' column, and we have the hexadecimal number FF, what does that represent?",{"type":21,"tag":22,"props":59895,"children":59896},{},[59897],{"type":26,"value":59898},"The light came on almost immediately for one student - I ignored his hand, though, waving at me from the back row, as he'd had been the one who always 'got it' first. After a few more moments, another student tentatively offered: 255? Yes, I said, which is the same as... and after a few more moments, his face brightened as he made the connection between hexadecimal as a sort of shorthand representation for binary.",{"type":21,"tag":22,"props":59900,"children":59901},{},[59902],{"type":26,"value":59903},"The other students, however, complained that I had told them math wasn't important for programming (which was true - I'd only just finished explaining how programming was really an extension of language skills, while specific algorithms were where math found its expression in programming).",{"type":21,"tag":4462,"props":59905,"children":59906},{},[59907],{"type":21,"tag":22,"props":59908,"children":59909},{},[59910],{"type":26,"value":59911},"That's true, I did say math wasn't important. But we aren't talking math - this is still language. Can anyone tell me why?",{"type":21,"tag":22,"props":59913,"children":59914},{},[59915],{"type":26,"value":59916},"Only the one eager grade 12 in the back row was able to make the connection that binary was the 'language' of the computer (which I'd already mentioned earlier), and everything else - hexadecimal, assembly, C and the other programming languages we'd spoken about - were 'translation layers' between the computer and the programmer.",{"type":21,"tag":22,"props":59918,"children":59919},{},[59920],{"type":26,"value":59921},"Continuing, I told them that, although they should never have to program in binary, or even hexadecimal, a computer programmer should have some idea of how a computer actually works, and the language it understands. One of the students who hadn't got it sort of shrugged and volunteered on the class' behalf that:",{"type":21,"tag":4462,"props":59923,"children":59924},{},[59925],{"type":21,"tag":22,"props":59926,"children":59927},{},[59928],{"type":26,"value":59929},"I don't think any of us actually wants to be a programmer.",{"type":21,"tag":22,"props":59931,"children":59932},{},[59933,59935,59942],{"type":26,"value":59934},"This didn't strike me as too surprising - not too many teenagers have a strong sense of what they want their eventual career to be. The more telling point was that, on further conversation, most of the students admitted that while they appreciated the end results of programming (such as video games), and enjoyed a superficial understanding of how they worked, the actual details of classes and objects and models and servers and so on, left them feeling much the way many do ",{"type":21,"tag":29,"props":59936,"children":59939},{"href":59937,"rel":59938},"http://www.plosone.org/article/info:doi/10.1371/journal.pone.0048076",[93],[59940],{"type":26,"value":59941},"when faced with the prospect of math",{"type":26,"value":59943}," - uncomfortable, and decidedly disinterested in pursuing it.",{"type":21,"tag":22,"props":59945,"children":59946},{},[59947],{"type":26,"value":59948},"After the class, my teacher friend and I were able to head for coffee over his lunch break, and we talked about his efforts in teaching computer science, alongside his math and science classes.",{"type":21,"tag":4462,"props":59950,"children":59951},{},[59952],{"type":21,"tag":22,"props":59953,"children":59954},{},[59955],{"type":26,"value":59956},"It's pretty much the same for all of them,\" he admitted. \"A few students are really enthusiastic and pick up concepts quickly. Others - they may never get it, and many don't even really want to. They're not necessarily stupid or inattentive - their marks in other courses can be anywhere from terrible to great - they just don't have any interest in the sciences.",{"type":21,"tag":22,"props":59958,"children":59959},{},[59960],{"type":26,"value":59961},"A key part of higher education is picking a specialization - even the most capable human needs to shy away from attempting be a polymath given the sheer breadth of human knowledge in the modern era. During our conversation, we made the comparison to understanding an internal combustion engine (I know, car metaphors - bear with me). Most people have an extremely superficial understanding of how an internal combustion engine (and their car in general) works - and as long as that doesn't impede them in the tasks they want to pursue with that device, they have no desire to learn more. Indeed, learning more would be an undesirable burden that would get in the way of performing other tasks, including those involving the vehicle in question.",{"type":21,"tag":22,"props":59963,"children":59964},{},[59965],{"type":26,"value":59966},"Someone with in-depth knowledge of how a car works might argue that they could get so much more out of the vehicle if they understood how it actually worked, and could tweak it as they desired - or at least maintain it properly. They'd be right, of course - but the time cost involved in becoming intimately acquainted with the operation of the vehicle is prohibitive to anyone who isn't making their living as a mechanic.",{"type":21,"tag":22,"props":59968,"children":59969},{},[59970],{"type":26,"value":59971},"It took us two coffees and a bagel each to reach the conclusion that probably, most people weren't going to want to be programmers if they weren't going to make money at it. In the foreseeable future, most people will continue to have a superficial understanding of how their various computing devices work 'under the hood', and will be entirely content with that. Even if programming did become a new 'literacy' requirement in the future, it would likely be at the same level that writing is for most of the populace - that is, while any literate individual can write, only a small percentage of the population write well enough to make a living at it.",{"type":21,"tag":22,"props":59973,"children":59974},{},[59975],{"type":26,"value":59976},"And one other nightmare scenario that occurs to me just now... who will be tasked with repairing/maintaining the code generated by these citizen programmers in the future, I wonder? I hope I'm retired by then...",{"type":21,"tag":22,"props":59978,"children":59979},{},[59980],{"type":26,"value":59981},"What do you think? Is programming going to become a primary concern of education in the coming years? If it does, will people really embrace it, or remember it about as well as they do their highschool trig lessons? And what happens to programming as a discipline if 'anyone' could write a program, the same way that 'anyone' could write a story?",{"title":8,"searchDepth":254,"depth":254,"links":59983},[],"content:ckeefer:2013-4:teaching-programming.md","ckeefer/2013-4/teaching-programming.md","ckeefer/2013-4/teaching-programming",{"user":3518,"name":3519},{"_path":59989,"_dir":59990,"_draft":7,"_partial":7,"_locale":8,"title":59991,"description":59992,"publishDate":59993,"tags":59994,"excerpt":59992,"body":59995,"_type":3511,"_id":62819,"_source":3513,"_file":62820,"_stem":62821,"_extension":3516,"author":62822},"/ckeefer/2013-11/jquery-ajax-blobs","2013-11","jQuery Ajax Blobs and Array Buffers","A big part of what makes jQuery a regular part of so many web projects is the clean interface it offers us for a number of sometimes messy built-in aspects of javascript. The most obvious is the DOM interface; and in second place, jquery ajax and its various shorthand methods. Abstracting away the difference between ActiveXObject and XMLHttpRequest is one of the most obvious benefits - but even if you don't need to worry about supporting old versions of IE, you might well enjoy the clean, object-based, promise-returning interface that jquery ajax offers.","2013-11-21",[12,13804],{"type":18,"children":59996,"toc":62817},[59997,60001,60022,60027,60032,60232,60260,60371,60394,60399,60463,60475,60480,60639,60644,60667,60672,60677,61124,61142,61156,61161,61166,61601,61629,61634,61639,61644,62802,62813],{"type":21,"tag":22,"props":59998,"children":59999},{},[60000],{"type":26,"value":59992},{"type":21,"tag":22,"props":60002,"children":60003},{},[60004,60006,60012,60013,60020],{"type":26,"value":60005},"It's a shame then, that if you want to take advantage of XMLHttpRequest Level 2 features like ",{"type":21,"tag":29,"props":60007,"children":60010},{"href":60008,"rel":60009},"https://developer.mozilla.org/en-US/docs/Web/API/Blob",[93],[60011],{"type":26,"value":8904},{"type":26,"value":7274},{"type":21,"tag":29,"props":60014,"children":60017},{"href":60015,"rel":60016},"https://developer.mozilla.org/en-US/docs/Web/API/ArrayBuffer",[93],[60018],{"type":26,"value":60019},"ArrayBuffer",{"type":26,"value":60021}," uploading/downloading, you have to fall back to the standard javascript api.",{"type":21,"tag":22,"props":60023,"children":60024},{},[60025],{"type":26,"value":60026},"Let's fix that, shall we?",{"type":21,"tag":22,"props":60028,"children":60029},{},[60030],{"type":26,"value":60031},"First, let's have an example of what recieving a Blob might look like with the standard api:",{"type":21,"tag":200,"props":60033,"children":60035},{"className":9044,"code":60034,"language":9046,"meta":8,"style":8},"var xhr = new XMLHttpRequest();\n\nxhr.addEventListener('load', function(){\n    if (xhr.status == 200){\n        //Do something with xhr.response (not responseText), which should be a Blob\n    }\n});\n\nxhr.open('GET', 'http://target.url');\nxhr.responseType = 'blob';\nxhr.send(null);\n",[60036],{"type":21,"tag":63,"props":60037,"children":60038},{"__ignoreMap":8},[60039,60066,60073,60104,60128,60136,60143,60150,60157,60189,60209],{"type":21,"tag":209,"props":60040,"children":60041},{"class":211,"line":212},[60042,60046,60050,60054,60058,60062],{"type":21,"tag":209,"props":60043,"children":60044},{"style":216},[60045],{"type":26,"value":8996},{"type":21,"tag":209,"props":60047,"children":60048},{"style":222},[60049],{"type":26,"value":17621},{"type":21,"tag":209,"props":60051,"children":60052},{"style":216},[60053],{"type":26,"value":1432},{"type":21,"tag":209,"props":60055,"children":60056},{"style":216},[60057],{"type":26,"value":4667},{"type":21,"tag":209,"props":60059,"children":60060},{"style":360},[60061],{"type":26,"value":17634},{"type":21,"tag":209,"props":60063,"children":60064},{"style":222},[60065],{"type":26,"value":4842},{"type":21,"tag":209,"props":60067,"children":60068},{"class":211,"line":244},[60069],{"type":21,"tag":209,"props":60070,"children":60071},{"emptyLinePlaceholder":248},[60072],{"type":26,"value":251},{"type":21,"tag":209,"props":60074,"children":60075},{"class":211,"line":254},[60076,60080,60084,60088,60092,60096,60100],{"type":21,"tag":209,"props":60077,"children":60078},{"style":222},[60079],{"type":26,"value":17653},{"type":21,"tag":209,"props":60081,"children":60082},{"style":360},[60083],{"type":26,"value":6424},{"type":21,"tag":209,"props":60085,"children":60086},{"style":222},[60087],{"type":26,"value":368},{"type":21,"tag":209,"props":60089,"children":60090},{"style":233},[60091],{"type":26,"value":11055},{"type":21,"tag":209,"props":60093,"children":60094},{"style":222},[60095],{"type":26,"value":408},{"type":21,"tag":209,"props":60097,"children":60098},{"style":216},[60099],{"type":26,"value":5370},{"type":21,"tag":209,"props":60101,"children":60102},{"style":222},[60103],{"type":26,"value":2561},{"type":21,"tag":209,"props":60105,"children":60106},{"class":211,"line":279},[60107,60111,60116,60120,60124],{"type":21,"tag":209,"props":60108,"children":60109},{"style":216},[60110],{"type":26,"value":10853},{"type":21,"tag":209,"props":60112,"children":60113},{"style":222},[60114],{"type":26,"value":60115}," (xhr.status ",{"type":21,"tag":209,"props":60117,"children":60118},{"style":216},[60119],{"type":26,"value":12908},{"type":21,"tag":209,"props":60121,"children":60122},{"style":263},[60123],{"type":26,"value":18716},{"type":21,"tag":209,"props":60125,"children":60126},{"style":222},[60127],{"type":26,"value":2369},{"type":21,"tag":209,"props":60129,"children":60130},{"class":211,"line":288},[60131],{"type":21,"tag":209,"props":60132,"children":60133},{"style":448},[60134],{"type":26,"value":60135},"        //Do something with xhr.response (not responseText), which should be a Blob\n",{"type":21,"tag":209,"props":60137,"children":60138},{"class":211,"line":307},[60139],{"type":21,"tag":209,"props":60140,"children":60141},{"style":222},[60142],{"type":26,"value":331},{"type":21,"tag":209,"props":60144,"children":60145},{"class":211,"line":325},[60146],{"type":21,"tag":209,"props":60147,"children":60148},{"style":222},[60149],{"type":26,"value":469},{"type":21,"tag":209,"props":60151,"children":60152},{"class":211,"line":334},[60153],{"type":21,"tag":209,"props":60154,"children":60155},{"emptyLinePlaceholder":248},[60156],{"type":26,"value":251},{"type":21,"tag":209,"props":60158,"children":60159},{"class":211,"line":343},[60160,60164,60168,60172,60176,60180,60185],{"type":21,"tag":209,"props":60161,"children":60162},{"style":222},[60163],{"type":26,"value":17653},{"type":21,"tag":209,"props":60165,"children":60166},{"style":360},[60167],{"type":26,"value":11610},{"type":21,"tag":209,"props":60169,"children":60170},{"style":222},[60171],{"type":26,"value":368},{"type":21,"tag":209,"props":60173,"children":60174},{"style":233},[60175],{"type":26,"value":17996},{"type":21,"tag":209,"props":60177,"children":60178},{"style":222},[60179],{"type":26,"value":408},{"type":21,"tag":209,"props":60181,"children":60182},{"style":233},[60183],{"type":26,"value":60184},"'http://target.url'",{"type":21,"tag":209,"props":60186,"children":60187},{"style":222},[60188],{"type":26,"value":2608},{"type":21,"tag":209,"props":60190,"children":60191},{"class":211,"line":351},[60192,60196,60200,60205],{"type":21,"tag":209,"props":60193,"children":60194},{"style":222},[60195],{"type":26,"value":17851},{"type":21,"tag":209,"props":60197,"children":60198},{"style":216},[60199],{"type":26,"value":1432},{"type":21,"tag":209,"props":60201,"children":60202},{"style":233},[60203],{"type":26,"value":60204}," 'blob'",{"type":21,"tag":209,"props":60206,"children":60207},{"style":222},[60208],{"type":26,"value":241},{"type":21,"tag":209,"props":60210,"children":60211},{"class":211,"line":444},[60212,60216,60220,60224,60228],{"type":21,"tag":209,"props":60213,"children":60214},{"style":222},[60215],{"type":26,"value":17653},{"type":21,"tag":209,"props":60217,"children":60218},{"style":360},[60219],{"type":26,"value":17917},{"type":21,"tag":209,"props":60221,"children":60222},{"style":222},[60223],{"type":26,"value":368},{"type":21,"tag":209,"props":60225,"children":60226},{"style":263},[60227],{"type":26,"value":17396},{"type":21,"tag":209,"props":60229,"children":60230},{"style":222},[60231],{"type":26,"value":2608},{"type":21,"tag":22,"props":60233,"children":60234},{},[60235,60237,60243,60244,60250,60252,60258],{"type":26,"value":60236},"It's not terrible, but we're sure to miss being able to dangle our ",{"type":21,"tag":63,"props":60238,"children":60240},{"className":60239},[],[60241],{"type":26,"value":60242},".done",{"type":26,"value":7274},{"type":21,"tag":63,"props":60245,"children":60247},{"className":60246},[],[60248],{"type":26,"value":60249},".fail",{"type":26,"value":60251}," blocks off of our nice, compact ",{"type":21,"tag":63,"props":60253,"children":60255},{"className":60254},[],[60256],{"type":26,"value":60257},"$.ajax",{"type":26,"value":60259}," request. What we want is to be able to do something like this:",{"type":21,"tag":200,"props":60261,"children":60263},{"className":9044,"code":60262,"language":9046,"meta":8,"style":8},"$.ajax({\n    dataType:'blob',\n    type:'GET',\n    url:'http://target.url'\n}).done(function(blob){\n    // Do something with the Blob returned to us from the ajax request\n});\n",[60264],{"type":21,"tag":63,"props":60265,"children":60266},{"__ignoreMap":8},[60267,60282,60298,60313,60325,60356,60364],{"type":21,"tag":209,"props":60268,"children":60269},{"class":211,"line":212},[60270,60274,60278],{"type":21,"tag":209,"props":60271,"children":60272},{"style":222},[60273],{"type":26,"value":17973},{"type":21,"tag":209,"props":60275,"children":60276},{"style":360},[60277],{"type":26,"value":17978},{"type":21,"tag":209,"props":60279,"children":60280},{"style":222},[60281],{"type":26,"value":17983},{"type":21,"tag":209,"props":60283,"children":60284},{"class":211,"line":244},[60285,60289,60294],{"type":21,"tag":209,"props":60286,"children":60287},{"style":222},[60288],{"type":26,"value":18024},{"type":21,"tag":209,"props":60290,"children":60291},{"style":233},[60292],{"type":26,"value":60293},"'blob'",{"type":21,"tag":209,"props":60295,"children":60296},{"style":222},[60297],{"type":26,"value":304},{"type":21,"tag":209,"props":60299,"children":60300},{"class":211,"line":254},[60301,60305,60309],{"type":21,"tag":209,"props":60302,"children":60303},{"style":222},[60304],{"type":26,"value":17991},{"type":21,"tag":209,"props":60306,"children":60307},{"style":233},[60308],{"type":26,"value":17996},{"type":21,"tag":209,"props":60310,"children":60311},{"style":222},[60312],{"type":26,"value":304},{"type":21,"tag":209,"props":60314,"children":60315},{"class":211,"line":279},[60316,60320],{"type":21,"tag":209,"props":60317,"children":60318},{"style":222},[60319],{"type":26,"value":18008},{"type":21,"tag":209,"props":60321,"children":60322},{"style":233},[60323],{"type":26,"value":60324},"'http://target.url'\n",{"type":21,"tag":209,"props":60326,"children":60327},{"class":211,"line":288},[60328,60332,60336,60340,60344,60348,60352],{"type":21,"tag":209,"props":60329,"children":60330},{"style":222},[60331],{"type":26,"value":18037},{"type":21,"tag":209,"props":60333,"children":60334},{"style":360},[60335],{"type":26,"value":18042},{"type":21,"tag":209,"props":60337,"children":60338},{"style":222},[60339],{"type":26,"value":368},{"type":21,"tag":209,"props":60341,"children":60342},{"style":216},[60343],{"type":26,"value":5370},{"type":21,"tag":209,"props":60345,"children":60346},{"style":222},[60347],{"type":26,"value":368},{"type":21,"tag":209,"props":60349,"children":60350},{"style":400},[60351],{"type":26,"value":18435},{"type":21,"tag":209,"props":60353,"children":60354},{"style":222},[60355],{"type":26,"value":2369},{"type":21,"tag":209,"props":60357,"children":60358},{"class":211,"line":307},[60359],{"type":21,"tag":209,"props":60360,"children":60361},{"style":448},[60362],{"type":26,"value":60363},"    // Do something with the Blob returned to us from the ajax request\n",{"type":21,"tag":209,"props":60365,"children":60366},{"class":211,"line":325},[60367],{"type":21,"tag":209,"props":60368,"children":60369},{"style":222},[60370],{"type":26,"value":469},{"type":21,"tag":22,"props":60372,"children":60373},{},[60374,60376,60383,60385,60392],{"type":26,"value":60375},"So, we're going to borrow a trick we discussed back in our ",{"type":21,"tag":29,"props":60377,"children":60380},{"href":60378,"rel":60379},"http://www.alproduction.local/blog/2013/06/ajax-caching-transports-compatible-with-jquery-deferred/",[93],[60381],{"type":26,"value":60382},"Ajax Caching",{"type":26,"value":60384}," article, and create an ",{"type":21,"tag":29,"props":60386,"children":60389},{"href":60387,"rel":60388},"http://api.jquery.com/jQuery.ajaxTransport/",[93],[60390],{"type":26,"value":60391},"Ajax Transport",{"type":26,"value":60393}," to handle sending and receiving Blobs and ArrayBuffers.",{"type":21,"tag":22,"props":60395,"children":60396},{},[60397],{"type":26,"value":60398},"Final code is included at the end of the article (for those who want to get straight to the good stuff), but let's walk through it and discuss what's happening.",{"type":21,"tag":200,"props":60400,"children":60402},{"className":9044,"code":60401,"language":9046,"meta":8,"style":8},"$.ajaxTransport('+*', function(options, originalOptions, jqXHR){\n",[60403],{"type":21,"tag":63,"props":60404,"children":60405},{"__ignoreMap":8},[60406],{"type":21,"tag":209,"props":60407,"children":60408},{"class":211,"line":212},[60409,60413,60417,60421,60426,60430,60434,60438,60442,60446,60451,60455,60459],{"type":21,"tag":209,"props":60410,"children":60411},{"style":222},[60412],{"type":26,"value":17973},{"type":21,"tag":209,"props":60414,"children":60415},{"style":360},[60416],{"type":26,"value":31966},{"type":21,"tag":209,"props":60418,"children":60419},{"style":222},[60420],{"type":26,"value":368},{"type":21,"tag":209,"props":60422,"children":60423},{"style":233},[60424],{"type":26,"value":60425},"'+*'",{"type":21,"tag":209,"props":60427,"children":60428},{"style":222},[60429],{"type":26,"value":408},{"type":21,"tag":209,"props":60431,"children":60432},{"style":216},[60433],{"type":26,"value":5370},{"type":21,"tag":209,"props":60435,"children":60436},{"style":222},[60437],{"type":26,"value":368},{"type":21,"tag":209,"props":60439,"children":60440},{"style":400},[60441],{"type":26,"value":29825},{"type":21,"tag":209,"props":60443,"children":60444},{"style":222},[60445],{"type":26,"value":408},{"type":21,"tag":209,"props":60447,"children":60448},{"style":400},[60449],{"type":26,"value":60450},"originalOptions",{"type":21,"tag":209,"props":60452,"children":60453},{"style":222},[60454],{"type":26,"value":408},{"type":21,"tag":209,"props":60456,"children":60457},{"style":400},[60458],{"type":26,"value":18108},{"type":21,"tag":209,"props":60460,"children":60461},{"style":222},[60462],{"type":26,"value":2369},{"type":21,"tag":22,"props":60464,"children":60465},{},[60466,60468,60473],{"type":26,"value":60467},"Notice the \"+",{"type":21,"tag":1084,"props":60469,"children":60470},{},[60471],{"type":26,"value":60472},"\" string? If you recall from our Ajax Caching article, this string indicates what dataType we want to match against when considering whether to use the transports defined in the following function. There we set type 'json', since we only wanted to cache json replies. Here though, we set '",{"type":26,"value":60474},"' to match all types (we'll narrow our definition down inside the function proper - we just want to make sure that our function gets a crack at providing the transport whenever appropriate, and the expected return dataType could be anything if we're sending a blob or arraybuffer).",{"type":21,"tag":22,"props":60476,"children":60477},{},[60478],{"type":26,"value":60479},"But what's with the '+' preceeding the '*'? That's a little (undocumented) trick found from perusing the jquery source - it indicates we want our transport to be prepended to the list of available transports, as opposed to appended. When matching against all types, we need to include this to prevent the standard transport factory from hogging the request.",{"type":21,"tag":200,"props":60481,"children":60483},{"className":9044,"code":60482,"language":9046,"meta":8,"style":8},"if (window.FormData && ((options.dataType && (options.dataType == 'blob' || options.dataType == 'arraybuffer'))\n        || (options.data && ((window.Blob && options.data instanceof Blob)\n            || (window.ArrayBuffer && options.data instanceof ArrayBuffer)))\n        ))\n    {\n",[60484],{"type":21,"tag":63,"props":60485,"children":60486},{"__ignoreMap":8},[60487,60547,60589,60624,60632],{"type":21,"tag":209,"props":60488,"children":60489},{"class":211,"line":212},[60490,60494,60499,60503,60508,60512,60517,60521,60525,60529,60534,60538,60543],{"type":21,"tag":209,"props":60491,"children":60492},{"style":216},[60493],{"type":26,"value":43437},{"type":21,"tag":209,"props":60495,"children":60496},{"style":222},[60497],{"type":26,"value":60498}," (window.FormData ",{"type":21,"tag":209,"props":60500,"children":60501},{"style":216},[60502],{"type":26,"value":15578},{"type":21,"tag":209,"props":60504,"children":60505},{"style":222},[60506],{"type":26,"value":60507}," ((options.dataType ",{"type":21,"tag":209,"props":60509,"children":60510},{"style":216},[60511],{"type":26,"value":15578},{"type":21,"tag":209,"props":60513,"children":60514},{"style":222},[60515],{"type":26,"value":60516}," (options.dataType ",{"type":21,"tag":209,"props":60518,"children":60519},{"style":216},[60520],{"type":26,"value":12908},{"type":21,"tag":209,"props":60522,"children":60523},{"style":233},[60524],{"type":26,"value":60204},{"type":21,"tag":209,"props":60526,"children":60527},{"style":216},[60528],{"type":26,"value":18721},{"type":21,"tag":209,"props":60530,"children":60531},{"style":222},[60532],{"type":26,"value":60533}," options.dataType ",{"type":21,"tag":209,"props":60535,"children":60536},{"style":216},[60537],{"type":26,"value":12908},{"type":21,"tag":209,"props":60539,"children":60540},{"style":233},[60541],{"type":26,"value":60542}," 'arraybuffer'",{"type":21,"tag":209,"props":60544,"children":60545},{"style":222},[60546],{"type":26,"value":35445},{"type":21,"tag":209,"props":60548,"children":60549},{"class":211,"line":244},[60550,60555,60559,60563,60568,60572,60577,60581,60585],{"type":21,"tag":209,"props":60551,"children":60552},{"style":216},[60553],{"type":26,"value":60554},"        ||",{"type":21,"tag":209,"props":60556,"children":60557},{"style":222},[60558],{"type":26,"value":30058},{"type":21,"tag":209,"props":60560,"children":60561},{"style":216},[60562],{"type":26,"value":15578},{"type":21,"tag":209,"props":60564,"children":60565},{"style":222},[60566],{"type":26,"value":60567}," ((window.Blob ",{"type":21,"tag":209,"props":60569,"children":60570},{"style":216},[60571],{"type":26,"value":15578},{"type":21,"tag":209,"props":60573,"children":60574},{"style":222},[60575],{"type":26,"value":60576}," options.data ",{"type":21,"tag":209,"props":60578,"children":60579},{"style":216},[60580],{"type":26,"value":49963},{"type":21,"tag":209,"props":60582,"children":60583},{"style":360},[60584],{"type":26,"value":9014},{"type":21,"tag":209,"props":60586,"children":60587},{"style":222},[60588],{"type":26,"value":10112},{"type":21,"tag":209,"props":60590,"children":60591},{"class":211,"line":254},[60592,60597,60602,60606,60610,60614,60619],{"type":21,"tag":209,"props":60593,"children":60594},{"style":216},[60595],{"type":26,"value":60596},"            ||",{"type":21,"tag":209,"props":60598,"children":60599},{"style":222},[60600],{"type":26,"value":60601}," (window.ArrayBuffer ",{"type":21,"tag":209,"props":60603,"children":60604},{"style":216},[60605],{"type":26,"value":15578},{"type":21,"tag":209,"props":60607,"children":60608},{"style":222},[60609],{"type":26,"value":60576},{"type":21,"tag":209,"props":60611,"children":60612},{"style":216},[60613],{"type":26,"value":49963},{"type":21,"tag":209,"props":60615,"children":60616},{"style":360},[60617],{"type":26,"value":60618}," ArrayBuffer",{"type":21,"tag":209,"props":60620,"children":60621},{"style":222},[60622],{"type":26,"value":60623},")))\n",{"type":21,"tag":209,"props":60625,"children":60626},{"class":211,"line":279},[60627],{"type":21,"tag":209,"props":60628,"children":60629},{"style":222},[60630],{"type":26,"value":60631},"        ))\n",{"type":21,"tag":209,"props":60633,"children":60634},{"class":211,"line":288},[60635],{"type":21,"tag":209,"props":60636,"children":60637},{"style":222},[60638],{"type":26,"value":37029},{"type":21,"tag":22,"props":60640,"children":60641},{},[60642],{"type":26,"value":60643},"I told you we'd narrow down our definition. :)",{"type":21,"tag":22,"props":60645,"children":60646},{},[60647,60649,60656,60658,60665],{"type":26,"value":60648},"So what's this monster if statement checking against? First, we check against ",{"type":21,"tag":29,"props":60650,"children":60653},{"href":60651,"rel":60652},"https://developer.mozilla.org/en-US/docs/Web/API/FormData",[93],[60654],{"type":26,"value":60655},"window.FormData",{"type":26,"value":60657},"; as a feature of ",{"type":21,"tag":29,"props":60659,"children":60662},{"href":60660,"rel":60661},"http://www.w3.org/TR/XMLHttpRequest2/#interface-formdata",[93],[60663],{"type":26,"value":60664},"XMLHttpRequest Level 2",{"type":26,"value":60666},", its a reasonable way to feature detect whether the browser is ready to provide us the necessary features for blob/arraybuffer sending/receiving.",{"type":21,"tag":22,"props":60668,"children":60669},{},[60670],{"type":26,"value":60671},"Next, we check to see whether a dataType has been defined, and if so, whether the dataType is blob or arraybuffer, indicating we're expecting our request to return us one of these data types.",{"type":21,"tag":22,"props":60673,"children":60674},{},[60675],{"type":26,"value":60676},"Otherwise, we check to see whether data has been defined, and if so, whether the browser supports Blobs and our data is an instance of Blob, or the same for array buffers. If the browser supports XMLHttpRequest 2 and we're either sending or receiving a blob/arraybuffer (or sending AND receiving), then we provide the transport. Remember, for $.ajaxTransport, we indicate we're providing the transport by returning something. Returning nothing indicates that the next transport factory should try to handle this request.",{"type":21,"tag":200,"props":60678,"children":60680},{"className":9044,"code":60679,"language":9046,"meta":8,"style":8},"        return {\n            send: function(headers, completeCallback){\n                var xhr = new XMLHttpRequest(),\n                    url = options.url || window.location.href,\n                    type = options.type || 'GET',\n                    dataType = options.dataType || 'text',\n                    data = options.data || null,\n                    async = options.async || true;\n\n                xhr.addEventListener('load', function(){\n                    var res = {};\n\n                    res[dataType] = xhr.response;\n                    completeCallback(xhr.status, xhr.statusText, res, xhr.getAllResponseHeaders());\n                });\n\n                xhr.open(type, url, async);\n                xhr.responseType = dataType;\n                xhr.send(data);\n            },\n            abort: function(){\n                jqXHR.abort();\n            }\n        };\n",[60681],{"type":21,"tag":63,"props":60682,"children":60683},{"__ignoreMap":8},[60684,60695,60731,60758,60784,60813,60842,60870,60899,60906,60938,60957,60964,60981,61003,61010,61017,61033,61050,61066,61073,61093,61110,61117],{"type":21,"tag":209,"props":60685,"children":60686},{"class":211,"line":212},[60687,60691],{"type":21,"tag":209,"props":60688,"children":60689},{"style":216},[60690],{"type":26,"value":3069},{"type":21,"tag":209,"props":60692,"children":60693},{"style":222},[60694],{"type":26,"value":276},{"type":21,"tag":209,"props":60696,"children":60697},{"class":211,"line":244},[60698,60703,60707,60711,60715,60719,60723,60727],{"type":21,"tag":209,"props":60699,"children":60700},{"style":360},[60701],{"type":26,"value":60702},"            send",{"type":21,"tag":209,"props":60704,"children":60705},{"style":222},[60706],{"type":26,"value":7427},{"type":21,"tag":209,"props":60708,"children":60709},{"style":216},[60710],{"type":26,"value":5370},{"type":21,"tag":209,"props":60712,"children":60713},{"style":222},[60714],{"type":26,"value":368},{"type":21,"tag":209,"props":60716,"children":60717},{"style":400},[60718],{"type":26,"value":15176},{"type":21,"tag":209,"props":60720,"children":60721},{"style":222},[60722],{"type":26,"value":408},{"type":21,"tag":209,"props":60724,"children":60725},{"style":400},[60726],{"type":26,"value":32207},{"type":21,"tag":209,"props":60728,"children":60729},{"style":222},[60730],{"type":26,"value":2369},{"type":21,"tag":209,"props":60732,"children":60733},{"class":211,"line":254},[60734,60738,60742,60746,60750,60754],{"type":21,"tag":209,"props":60735,"children":60736},{"style":216},[60737],{"type":26,"value":31683},{"type":21,"tag":209,"props":60739,"children":60740},{"style":222},[60741],{"type":26,"value":17621},{"type":21,"tag":209,"props":60743,"children":60744},{"style":216},[60745],{"type":26,"value":1432},{"type":21,"tag":209,"props":60747,"children":60748},{"style":216},[60749],{"type":26,"value":4667},{"type":21,"tag":209,"props":60751,"children":60752},{"style":360},[60753],{"type":26,"value":17634},{"type":21,"tag":209,"props":60755,"children":60756},{"style":222},[60757],{"type":26,"value":5405},{"type":21,"tag":209,"props":60759,"children":60760},{"class":211,"line":279},[60761,60766,60770,60775,60779],{"type":21,"tag":209,"props":60762,"children":60763},{"style":222},[60764],{"type":26,"value":60765},"                    url ",{"type":21,"tag":209,"props":60767,"children":60768},{"style":216},[60769],{"type":26,"value":1432},{"type":21,"tag":209,"props":60771,"children":60772},{"style":222},[60773],{"type":26,"value":60774}," options.url ",{"type":21,"tag":209,"props":60776,"children":60777},{"style":216},[60778],{"type":26,"value":4677},{"type":21,"tag":209,"props":60780,"children":60781},{"style":222},[60782],{"type":26,"value":60783}," window.location.href,\n",{"type":21,"tag":209,"props":60785,"children":60786},{"class":211,"line":288},[60787,60792,60796,60800,60804,60809],{"type":21,"tag":209,"props":60788,"children":60789},{"style":222},[60790],{"type":26,"value":60791},"                    type ",{"type":21,"tag":209,"props":60793,"children":60794},{"style":216},[60795],{"type":26,"value":1432},{"type":21,"tag":209,"props":60797,"children":60798},{"style":222},[60799],{"type":26,"value":30049},{"type":21,"tag":209,"props":60801,"children":60802},{"style":216},[60803],{"type":26,"value":4677},{"type":21,"tag":209,"props":60805,"children":60806},{"style":233},[60807],{"type":26,"value":60808}," 'GET'",{"type":21,"tag":209,"props":60810,"children":60811},{"style":222},[60812],{"type":26,"value":304},{"type":21,"tag":209,"props":60814,"children":60815},{"class":211,"line":307},[60816,60821,60825,60829,60833,60838],{"type":21,"tag":209,"props":60817,"children":60818},{"style":222},[60819],{"type":26,"value":60820},"                    dataType ",{"type":21,"tag":209,"props":60822,"children":60823},{"style":216},[60824],{"type":26,"value":1432},{"type":21,"tag":209,"props":60826,"children":60827},{"style":222},[60828],{"type":26,"value":60533},{"type":21,"tag":209,"props":60830,"children":60831},{"style":216},[60832],{"type":26,"value":4677},{"type":21,"tag":209,"props":60834,"children":60835},{"style":233},[60836],{"type":26,"value":60837}," 'text'",{"type":21,"tag":209,"props":60839,"children":60840},{"style":222},[60841],{"type":26,"value":304},{"type":21,"tag":209,"props":60843,"children":60844},{"class":211,"line":325},[60845,60850,60854,60858,60862,60866],{"type":21,"tag":209,"props":60846,"children":60847},{"style":222},[60848],{"type":26,"value":60849},"                    data ",{"type":21,"tag":209,"props":60851,"children":60852},{"style":216},[60853],{"type":26,"value":1432},{"type":21,"tag":209,"props":60855,"children":60856},{"style":222},[60857],{"type":26,"value":60576},{"type":21,"tag":209,"props":60859,"children":60860},{"style":216},[60861],{"type":26,"value":4677},{"type":21,"tag":209,"props":60863,"children":60864},{"style":263},[60865],{"type":26,"value":41733},{"type":21,"tag":209,"props":60867,"children":60868},{"style":222},[60869],{"type":26,"value":304},{"type":21,"tag":209,"props":60871,"children":60872},{"class":211,"line":334},[60873,60878,60882,60887,60891,60895],{"type":21,"tag":209,"props":60874,"children":60875},{"style":222},[60876],{"type":26,"value":60877},"                    async ",{"type":21,"tag":209,"props":60879,"children":60880},{"style":216},[60881],{"type":26,"value":1432},{"type":21,"tag":209,"props":60883,"children":60884},{"style":222},[60885],{"type":26,"value":60886}," options.async ",{"type":21,"tag":209,"props":60888,"children":60889},{"style":216},[60890],{"type":26,"value":4677},{"type":21,"tag":209,"props":60892,"children":60893},{"style":263},[60894],{"type":26,"value":6243},{"type":21,"tag":209,"props":60896,"children":60897},{"style":222},[60898],{"type":26,"value":241},{"type":21,"tag":209,"props":60900,"children":60901},{"class":211,"line":343},[60902],{"type":21,"tag":209,"props":60903,"children":60904},{"emptyLinePlaceholder":248},[60905],{"type":26,"value":251},{"type":21,"tag":209,"props":60907,"children":60908},{"class":211,"line":351},[60909,60914,60918,60922,60926,60930,60934],{"type":21,"tag":209,"props":60910,"children":60911},{"style":222},[60912],{"type":26,"value":60913},"                xhr.",{"type":21,"tag":209,"props":60915,"children":60916},{"style":360},[60917],{"type":26,"value":6424},{"type":21,"tag":209,"props":60919,"children":60920},{"style":222},[60921],{"type":26,"value":368},{"type":21,"tag":209,"props":60923,"children":60924},{"style":233},[60925],{"type":26,"value":11055},{"type":21,"tag":209,"props":60927,"children":60928},{"style":222},[60929],{"type":26,"value":408},{"type":21,"tag":209,"props":60931,"children":60932},{"style":216},[60933],{"type":26,"value":5370},{"type":21,"tag":209,"props":60935,"children":60936},{"style":222},[60937],{"type":26,"value":2561},{"type":21,"tag":209,"props":60939,"children":60940},{"class":211,"line":444},[60941,60945,60949,60953],{"type":21,"tag":209,"props":60942,"children":60943},{"style":216},[60944],{"type":26,"value":56915},{"type":21,"tag":209,"props":60946,"children":60947},{"style":222},[60948],{"type":26,"value":25161},{"type":21,"tag":209,"props":60950,"children":60951},{"style":216},[60952],{"type":26,"value":1432},{"type":21,"tag":209,"props":60954,"children":60955},{"style":222},[60956],{"type":26,"value":32274},{"type":21,"tag":209,"props":60958,"children":60959},{"class":211,"line":454},[60960],{"type":21,"tag":209,"props":60961,"children":60962},{"emptyLinePlaceholder":248},[60963],{"type":26,"value":251},{"type":21,"tag":209,"props":60965,"children":60966},{"class":211,"line":463},[60967,60972,60976],{"type":21,"tag":209,"props":60968,"children":60969},{"style":222},[60970],{"type":26,"value":60971},"                    res[dataType] ",{"type":21,"tag":209,"props":60973,"children":60974},{"style":216},[60975],{"type":26,"value":1432},{"type":21,"tag":209,"props":60977,"children":60978},{"style":222},[60979],{"type":26,"value":60980}," xhr.response;\n",{"type":21,"tag":209,"props":60982,"children":60983},{"class":211,"line":472},[60984,60989,60994,60999],{"type":21,"tag":209,"props":60985,"children":60986},{"style":360},[60987],{"type":26,"value":60988},"                    completeCallback",{"type":21,"tag":209,"props":60990,"children":60991},{"style":222},[60992],{"type":26,"value":60993},"(xhr.status, xhr.statusText, res, xhr.",{"type":21,"tag":209,"props":60995,"children":60996},{"style":360},[60997],{"type":26,"value":60998},"getAllResponseHeaders",{"type":21,"tag":209,"props":61000,"children":61001},{"style":222},[61002],{"type":26,"value":52185},{"type":21,"tag":209,"props":61004,"children":61005},{"class":211,"line":480},[61006],{"type":21,"tag":209,"props":61007,"children":61008},{"style":222},[61009],{"type":26,"value":29597},{"type":21,"tag":209,"props":61011,"children":61012},{"class":211,"line":489},[61013],{"type":21,"tag":209,"props":61014,"children":61015},{"emptyLinePlaceholder":248},[61016],{"type":26,"value":251},{"type":21,"tag":209,"props":61018,"children":61019},{"class":211,"line":847},[61020,61024,61028],{"type":21,"tag":209,"props":61021,"children":61022},{"style":222},[61023],{"type":26,"value":60913},{"type":21,"tag":209,"props":61025,"children":61026},{"style":360},[61027],{"type":26,"value":11610},{"type":21,"tag":209,"props":61029,"children":61030},{"style":222},[61031],{"type":26,"value":61032},"(type, url, async);\n",{"type":21,"tag":209,"props":61034,"children":61035},{"class":211,"line":860},[61036,61041,61045],{"type":21,"tag":209,"props":61037,"children":61038},{"style":222},[61039],{"type":26,"value":61040},"                xhr.responseType ",{"type":21,"tag":209,"props":61042,"children":61043},{"style":216},[61044],{"type":26,"value":1432},{"type":21,"tag":209,"props":61046,"children":61047},{"style":222},[61048],{"type":26,"value":61049}," dataType;\n",{"type":21,"tag":209,"props":61051,"children":61052},{"class":211,"line":877},[61053,61057,61061],{"type":21,"tag":209,"props":61054,"children":61055},{"style":222},[61056],{"type":26,"value":60913},{"type":21,"tag":209,"props":61058,"children":61059},{"style":360},[61060],{"type":26,"value":17917},{"type":21,"tag":209,"props":61062,"children":61063},{"style":222},[61064],{"type":26,"value":61065},"(data);\n",{"type":21,"tag":209,"props":61067,"children":61068},{"class":211,"line":889},[61069],{"type":21,"tag":209,"props":61070,"children":61071},{"style":222},[61072],{"type":26,"value":38791},{"type":21,"tag":209,"props":61074,"children":61075},{"class":211,"line":902},[61076,61081,61085,61089],{"type":21,"tag":209,"props":61077,"children":61078},{"style":360},[61079],{"type":26,"value":61080},"            abort",{"type":21,"tag":209,"props":61082,"children":61083},{"style":222},[61084],{"type":26,"value":7427},{"type":21,"tag":209,"props":61086,"children":61087},{"style":216},[61088],{"type":26,"value":5370},{"type":21,"tag":209,"props":61090,"children":61091},{"style":222},[61092],{"type":26,"value":2561},{"type":21,"tag":209,"props":61094,"children":61095},{"class":211,"line":914},[61096,61101,61106],{"type":21,"tag":209,"props":61097,"children":61098},{"style":222},[61099],{"type":26,"value":61100},"                jqXHR.",{"type":21,"tag":209,"props":61102,"children":61103},{"style":360},[61104],{"type":26,"value":61105},"abort",{"type":21,"tag":209,"props":61107,"children":61108},{"style":222},[61109],{"type":26,"value":4842},{"type":21,"tag":209,"props":61111,"children":61112},{"class":211,"line":922},[61113],{"type":21,"tag":209,"props":61114,"children":61115},{"style":222},[61116],{"type":26,"value":6136},{"type":21,"tag":209,"props":61118,"children":61119},{"class":211,"line":2312},[61120],{"type":21,"tag":209,"props":61121,"children":61122},{"style":222},[61123],{"type":26,"value":6384},{"type":21,"tag":22,"props":61125,"children":61126},{},[61127,61129,61134,61135,61140],{"type":26,"value":61128},"As you'll recall from our Ajax Caching article, we need to provide two functions for a transport - ",{"type":21,"tag":63,"props":61130,"children":61132},{"className":61131},[],[61133],{"type":26,"value":17917},{"type":26,"value":4256},{"type":21,"tag":63,"props":61136,"children":61138},{"className":61137},[],[61139],{"type":26,"value":61105},{"type":26,"value":61141},". The body of send should look familiar here - we consider the options set in the ajax options block, and set reasonable defaults if the needed options aren't set, instantiate a new XMLHttpRequest object, open the request, set the appropriate response type, and send data as appropriate. In abort, we simply call abort on the jqXHR object passed to the transport factory function.",{"type":21,"tag":22,"props":61143,"children":61144},{},[61145,61147,61154],{"type":26,"value":61146},"So where is this useful? You remember our ",{"type":21,"tag":29,"props":61148,"children":61151},{"href":61149,"rel":61150},"http://www.alproduction.local/blog/2013/04/ajax-upload-part-ii-xhr2-and-filereader/",[93],[61152],{"type":26,"value":61153},"FileReader/XHR2",{"type":26,"value":61155}," plugin, right? This is a complement (and partial replacement, if desired) to that - now we can receive blobs/arraybuffers from the server, as well as send them up, all within the comfortably familiar jQuery interface. Neat, huh?",{"type":21,"tag":22,"props":61157,"children":61158},{},[61159],{"type":26,"value":61160},"But wait! The plugin gives us feedback on upload progress! Can we do that with this ajax transport?",{"type":21,"tag":22,"props":61162,"children":61163},{},[61164],{"type":26,"value":61165},"Of course! Take a look at our xhr2 plugin post again, and you'll see where we're listening in on the 'progress' event on our XMLHttpRequest object. The relevant handler function looks like:",{"type":21,"tag":200,"props":61167,"children":61169},{"className":9044,"code":61168,"language":9046,"meta":8,"style":8},"DeferXhr.prototype.uploadProgress = function(event){\n        if (event.lengthComputable)\n        {\n            this.progress = (event.loaded/event.total);\n            if (this.options.chunked)\n            {\n                this.progress *= (this.end/this.file.size);\n            }\n            this.time.end = +new Date();\n            this.time.speed = (this.file.size*this.progress)/(this.time.end-this.time.start)*1000;\n            console.log('time:', this.time.end-this.time.start, 'speed:', this.time.speed);\n            this.defer.notify({state:Hup.state.FILE_UPLOAD_PROGRESS, file_name:this.file.name, speed:this.time.speed,\n                progress:this.progress});\n        }\n    };\n",[61170],{"type":21,"tag":63,"props":61171,"children":61172},{"__ignoreMap":8},[61173,61218,61230,61237,61267,61287,61294,61337,61344,61372,61457,61520,61570,61587,61594],{"type":21,"tag":209,"props":61174,"children":61175},{"class":211,"line":212},[61176,61181,61185,61189,61193,61198,61202,61206,61210,61214],{"type":21,"tag":209,"props":61177,"children":61178},{"style":263},[61179],{"type":26,"value":61180},"DeferXhr",{"type":21,"tag":209,"props":61182,"children":61183},{"style":222},[61184],{"type":26,"value":378},{"type":21,"tag":209,"props":61186,"children":61187},{"style":263},[61188],{"type":26,"value":37016},{"type":21,"tag":209,"props":61190,"children":61191},{"style":222},[61192],{"type":26,"value":378},{"type":21,"tag":209,"props":61194,"children":61195},{"style":360},[61196],{"type":26,"value":61197},"uploadProgress",{"type":21,"tag":209,"props":61199,"children":61200},{"style":216},[61201],{"type":26,"value":271},{"type":21,"tag":209,"props":61203,"children":61204},{"style":216},[61205],{"type":26,"value":4766},{"type":21,"tag":209,"props":61207,"children":61208},{"style":222},[61209],{"type":26,"value":368},{"type":21,"tag":209,"props":61211,"children":61212},{"style":400},[61213],{"type":26,"value":10794},{"type":21,"tag":209,"props":61215,"children":61216},{"style":222},[61217],{"type":26,"value":2369},{"type":21,"tag":209,"props":61219,"children":61220},{"class":211,"line":244},[61221,61225],{"type":21,"tag":209,"props":61222,"children":61223},{"style":216},[61224],{"type":26,"value":5803},{"type":21,"tag":209,"props":61226,"children":61227},{"style":222},[61228],{"type":26,"value":61229}," (event.lengthComputable)\n",{"type":21,"tag":209,"props":61231,"children":61232},{"class":211,"line":254},[61233],{"type":21,"tag":209,"props":61234,"children":61235},{"style":222},[61236],{"type":26,"value":7561},{"type":21,"tag":209,"props":61238,"children":61239},{"class":211,"line":279},[61240,61244,61249,61253,61258,61262],{"type":21,"tag":209,"props":61241,"children":61242},{"style":263},[61243],{"type":26,"value":2570},{"type":21,"tag":209,"props":61245,"children":61246},{"style":222},[61247],{"type":26,"value":61248},".progress ",{"type":21,"tag":209,"props":61250,"children":61251},{"style":216},[61252],{"type":26,"value":1432},{"type":21,"tag":209,"props":61254,"children":61255},{"style":222},[61256],{"type":26,"value":61257}," (event.loaded",{"type":21,"tag":209,"props":61259,"children":61260},{"style":216},[61261],{"type":26,"value":9749},{"type":21,"tag":209,"props":61263,"children":61264},{"style":222},[61265],{"type":26,"value":61266},"event.total);\n",{"type":21,"tag":209,"props":61268,"children":61269},{"class":211,"line":288},[61270,61274,61278,61282],{"type":21,"tag":209,"props":61271,"children":61272},{"style":216},[61273],{"type":26,"value":6083},{"type":21,"tag":209,"props":61275,"children":61276},{"style":222},[61277],{"type":26,"value":4776},{"type":21,"tag":209,"props":61279,"children":61280},{"style":263},[61281],{"type":26,"value":2508},{"type":21,"tag":209,"props":61283,"children":61284},{"style":222},[61285],{"type":26,"value":61286},".options.chunked)\n",{"type":21,"tag":209,"props":61288,"children":61289},{"class":211,"line":307},[61290],{"type":21,"tag":209,"props":61291,"children":61292},{"style":222},[61293],{"type":26,"value":16576},{"type":21,"tag":209,"props":61295,"children":61296},{"class":211,"line":325},[61297,61302,61306,61311,61315,61319,61324,61328,61332],{"type":21,"tag":209,"props":61298,"children":61299},{"style":263},[61300],{"type":26,"value":61301},"                this",{"type":21,"tag":209,"props":61303,"children":61304},{"style":222},[61305],{"type":26,"value":61248},{"type":21,"tag":209,"props":61307,"children":61308},{"style":216},[61309],{"type":26,"value":61310},"*=",{"type":21,"tag":209,"props":61312,"children":61313},{"style":222},[61314],{"type":26,"value":4776},{"type":21,"tag":209,"props":61316,"children":61317},{"style":263},[61318],{"type":26,"value":2508},{"type":21,"tag":209,"props":61320,"children":61321},{"style":222},[61322],{"type":26,"value":61323},".end",{"type":21,"tag":209,"props":61325,"children":61326},{"style":216},[61327],{"type":26,"value":9749},{"type":21,"tag":209,"props":61329,"children":61330},{"style":263},[61331],{"type":26,"value":2508},{"type":21,"tag":209,"props":61333,"children":61334},{"style":222},[61335],{"type":26,"value":61336},".file.size);\n",{"type":21,"tag":209,"props":61338,"children":61339},{"class":211,"line":334},[61340],{"type":21,"tag":209,"props":61341,"children":61342},{"style":222},[61343],{"type":26,"value":6136},{"type":21,"tag":209,"props":61345,"children":61346},{"class":211,"line":343},[61347,61351,61356,61360,61364,61368],{"type":21,"tag":209,"props":61348,"children":61349},{"style":263},[61350],{"type":26,"value":2570},{"type":21,"tag":209,"props":61352,"children":61353},{"style":222},[61354],{"type":26,"value":61355},".time.end ",{"type":21,"tag":209,"props":61357,"children":61358},{"style":216},[61359],{"type":26,"value":1432},{"type":21,"tag":209,"props":61361,"children":61362},{"style":216},[61363],{"type":26,"value":17248},{"type":21,"tag":209,"props":61365,"children":61366},{"style":360},[61367],{"type":26,"value":14388},{"type":21,"tag":209,"props":61369,"children":61370},{"style":222},[61371],{"type":26,"value":4842},{"type":21,"tag":209,"props":61373,"children":61374},{"class":211,"line":351},[61375,61379,61384,61388,61392,61396,61401,61405,61409,61414,61418,61422,61426,61431,61435,61439,61444,61448,61453],{"type":21,"tag":209,"props":61376,"children":61377},{"style":263},[61378],{"type":26,"value":2570},{"type":21,"tag":209,"props":61380,"children":61381},{"style":222},[61382],{"type":26,"value":61383},".time.speed ",{"type":21,"tag":209,"props":61385,"children":61386},{"style":216},[61387],{"type":26,"value":1432},{"type":21,"tag":209,"props":61389,"children":61390},{"style":222},[61391],{"type":26,"value":4776},{"type":21,"tag":209,"props":61393,"children":61394},{"style":263},[61395],{"type":26,"value":2508},{"type":21,"tag":209,"props":61397,"children":61398},{"style":222},[61399],{"type":26,"value":61400},".file.size",{"type":21,"tag":209,"props":61402,"children":61403},{"style":216},[61404],{"type":26,"value":944},{"type":21,"tag":209,"props":61406,"children":61407},{"style":263},[61408],{"type":26,"value":2508},{"type":21,"tag":209,"props":61410,"children":61411},{"style":222},[61412],{"type":26,"value":61413},".progress)",{"type":21,"tag":209,"props":61415,"children":61416},{"style":216},[61417],{"type":26,"value":9749},{"type":21,"tag":209,"props":61419,"children":61420},{"style":222},[61421],{"type":26,"value":368},{"type":21,"tag":209,"props":61423,"children":61424},{"style":263},[61425],{"type":26,"value":2508},{"type":21,"tag":209,"props":61427,"children":61428},{"style":222},[61429],{"type":26,"value":61430},".time.end",{"type":21,"tag":209,"props":61432,"children":61433},{"style":216},[61434],{"type":26,"value":13012},{"type":21,"tag":209,"props":61436,"children":61437},{"style":263},[61438],{"type":26,"value":2508},{"type":21,"tag":209,"props":61440,"children":61441},{"style":222},[61442],{"type":26,"value":61443},".time.start)",{"type":21,"tag":209,"props":61445,"children":61446},{"style":216},[61447],{"type":26,"value":944},{"type":21,"tag":209,"props":61449,"children":61450},{"style":263},[61451],{"type":26,"value":61452},"1000",{"type":21,"tag":209,"props":61454,"children":61455},{"style":222},[61456],{"type":26,"value":241},{"type":21,"tag":209,"props":61458,"children":61459},{"class":211,"line":444},[61460,61464,61468,61472,61477,61481,61485,61489,61493,61497,61502,61507,61511,61515],{"type":21,"tag":209,"props":61461,"children":61462},{"style":222},[61463],{"type":26,"value":2495},{"type":21,"tag":209,"props":61465,"children":61466},{"style":360},[61467],{"type":26,"value":1059},{"type":21,"tag":209,"props":61469,"children":61470},{"style":222},[61471],{"type":26,"value":368},{"type":21,"tag":209,"props":61473,"children":61474},{"style":233},[61475],{"type":26,"value":61476},"'time:'",{"type":21,"tag":209,"props":61478,"children":61479},{"style":222},[61480],{"type":26,"value":408},{"type":21,"tag":209,"props":61482,"children":61483},{"style":263},[61484],{"type":26,"value":2508},{"type":21,"tag":209,"props":61486,"children":61487},{"style":222},[61488],{"type":26,"value":61430},{"type":21,"tag":209,"props":61490,"children":61491},{"style":216},[61492],{"type":26,"value":13012},{"type":21,"tag":209,"props":61494,"children":61495},{"style":263},[61496],{"type":26,"value":2508},{"type":21,"tag":209,"props":61498,"children":61499},{"style":222},[61500],{"type":26,"value":61501},".time.start, ",{"type":21,"tag":209,"props":61503,"children":61504},{"style":233},[61505],{"type":26,"value":61506},"'speed:'",{"type":21,"tag":209,"props":61508,"children":61509},{"style":222},[61510],{"type":26,"value":408},{"type":21,"tag":209,"props":61512,"children":61513},{"style":263},[61514],{"type":26,"value":2508},{"type":21,"tag":209,"props":61516,"children":61517},{"style":222},[61518],{"type":26,"value":61519},".time.speed);\n",{"type":21,"tag":209,"props":61521,"children":61522},{"class":211,"line":454},[61523,61527,61532,61537,61542,61547,61552,61556,61561,61565],{"type":21,"tag":209,"props":61524,"children":61525},{"style":263},[61526],{"type":26,"value":2570},{"type":21,"tag":209,"props":61528,"children":61529},{"style":222},[61530],{"type":26,"value":61531},".defer.",{"type":21,"tag":209,"props":61533,"children":61534},{"style":360},[61535],{"type":26,"value":61536},"notify",{"type":21,"tag":209,"props":61538,"children":61539},{"style":222},[61540],{"type":26,"value":61541},"({state:Hup.state.",{"type":21,"tag":209,"props":61543,"children":61544},{"style":263},[61545],{"type":26,"value":61546},"FILE_UPLOAD_PROGRESS",{"type":21,"tag":209,"props":61548,"children":61549},{"style":222},[61550],{"type":26,"value":61551},", file_name:",{"type":21,"tag":209,"props":61553,"children":61554},{"style":263},[61555],{"type":26,"value":2508},{"type":21,"tag":209,"props":61557,"children":61558},{"style":222},[61559],{"type":26,"value":61560},".file.name, speed:",{"type":21,"tag":209,"props":61562,"children":61563},{"style":263},[61564],{"type":26,"value":2508},{"type":21,"tag":209,"props":61566,"children":61567},{"style":222},[61568],{"type":26,"value":61569},".time.speed,\n",{"type":21,"tag":209,"props":61571,"children":61572},{"class":211,"line":463},[61573,61578,61582],{"type":21,"tag":209,"props":61574,"children":61575},{"style":222},[61576],{"type":26,"value":61577},"                progress:",{"type":21,"tag":209,"props":61579,"children":61580},{"style":263},[61581],{"type":26,"value":2508},{"type":21,"tag":209,"props":61583,"children":61584},{"style":222},[61585],{"type":26,"value":61586},".progress});\n",{"type":21,"tag":209,"props":61588,"children":61589},{"class":211,"line":472},[61590],{"type":21,"tag":209,"props":61591,"children":61592},{"style":222},[61593],{"type":26,"value":2235},{"type":21,"tag":209,"props":61595,"children":61596},{"class":211,"line":480},[61597],{"type":21,"tag":209,"props":61598,"children":61599},{"style":222},[61600],{"type":26,"value":4850},{"type":21,"tag":22,"props":61602,"children":61603},{},[61604,61606,61612,61614,61621,61623,61628],{"type":26,"value":61605},"By adding a similar handler function with our ajax transport factory on the progress event, we can make calls to ",{"type":21,"tag":63,"props":61607,"children":61609},{"className":61608},[],[61610],{"type":26,"value":61611},"jqXHR.notify",{"type":26,"value":61613}," to send progress events and data to any listening ",{"type":21,"tag":29,"props":61615,"children":61618},{"href":61616,"rel":61617},"http://api.jquery.com/deferred.progress/",[93],[61619],{"type":26,"value":61620},".progress",{"type":26,"value":61622}," handlers dangling from our ",{"type":21,"tag":63,"props":61624,"children":61626},{"className":61625},[],[61627],{"type":26,"value":60257},{"type":26,"value":17953},{"type":21,"tag":22,"props":61630,"children":61631},{},[61632],{"type":26,"value":61633},"This, however, I leave as an exercise for the reader. :)",{"type":21,"tag":22,"props":61635,"children":61636},{},[61637],{"type":26,"value":61638},"If you like, please feel free to push the relevant changes to the gist in question.",{"type":21,"tag":22,"props":61640,"children":61641},{},[61642],{"type":26,"value":61643},"Here's the promised code:",{"type":21,"tag":200,"props":61645,"children":61647},{"className":9044,"code":61646,"language":9046,"meta":8,"style":8},"(function($){\n    /**\n     * Register ajax transports for blob send/recieve and array buffer send/receive via XMLHttpRequest Level 2\n     * within the comfortable framework of the jquery ajax request, with full support for promises.\n     *\n     * Notice the +* in the dataType string? The + indicates we want this transport to be prepended to the list\n     * of potential transports (so it gets first dibs if the request passes the conditions within to provide the\n     * ajax transport, preventing the standard transport from hogging the request), and the * indicates that\n     * potentially any request with any dataType might want to use the transports provided herein.\n     *\n     * Remember to specify 'processData:false' in the ajax options when attempting to send a blob or arraybuffer -\n     * otherwise jquery will try (and fail) to convert the blob or buffer into a query string.\n     *\n     * This revision now includes sending headers, resolves the stack overflow in abort(), and sets the status text\n     * into the response if the request is unsuccessful.\n     */\n    $.ajaxTransport(\"+*\", function(options, originalOptions, jqXHR){\n        // Test for the conditions that mean we can/want to send/receive blobs or arraybuffers - we need XMLHttpRequest\n        // level 2 (so feature-detect against window.FormData), feature detect against window.Blob or window.ArrayBuffer,\n        // and then check to see if the dataType is blob/arraybuffer or the data itself is a Blob/ArrayBuffer\n        if (window.FormData && ((options.dataType && (options.dataType == 'blob' || options.dataType == 'arraybuffer'))\n            || (options.data && ((window.Blob && options.data instanceof Blob)\n                || (window.ArrayBuffer && options.data instanceof ArrayBuffer)))\n            ))\n        {\n            var xhr;\n\n            return {\n                /**\n                 * Return a transport capable of sending and/or receiving blobs - in this case, we instantiate\n                 * a new XMLHttpRequest and use it to actually perform the request, and funnel the result back\n                 * into the jquery complete callback (such as the success function, done blocks, etc.)\n                 *\n                 * @param headers\n                 * @param completeCallback\n                 */\n                send: function(headers, completeCallback){\n                    var url = options.url || window.location.href,\n                        type = options.type || 'GET',\n                        dataType = options.dataType || 'text',\n                        data = options.data || null,\n                        async = options.async || true;\n\n                    xhr = new XMLHttpRequest();\n                    xhr.addEventListener('load', function(){\n                        var res = {},\n                            success = xhr.status >= 200 && xhr.status \u003C 300 || xhr.status === 304;\n\n                        if (success){\n                            res[dataType] = xhr.response;\n                        } else {\n                            res.text = xhr.statusText;\n                        }\n\n                        completeCallback(xhr.status, xhr.statusText, res, xhr.getAllResponseHeaders());\n                    });\n\n                    xhr.open(type, url, async);\n                    xhr.responseType = dataType;\n\n                    for (var key in headers){\n                        if (headers.hasOwnProperty(key)){\n                            xhr.setRequestHeader(key, headers[key]);\n                        }\n                    }\n\n                    xhr.send(data);\n                },\n                abort: function(){\n                    if (xhr){\n                        xhr.abort();\n                    }\n                }\n            };\n        }\n    });\n})(jQuery);\n",[61648],{"type":21,"tag":63,"props":61649,"children":61650},{"__ignoreMap":8},[61651,61674,61681,61689,61697,61704,61712,61720,61728,61736,61743,61751,61759,61766,61774,61782,61789,61844,61852,61860,61868,61923,61962,61994,62002,62009,62021,62028,62039,62046,62054,62062,62070,62078,62095,62111,62118,62154,62181,62209,62237,62265,62293,62300,62324,62356,62376,62440,62447,62460,62476,62493,62510,62518,62525,62545,62553,62560,62575,62591,62598,62628,62650,62668,62675,62682,62689,62704,62712,62732,62744,62760,62767,62774,62781,62788,62795],{"type":21,"tag":209,"props":61652,"children":61653},{"class":211,"line":212},[61654,61658,61662,61666,61670],{"type":21,"tag":209,"props":61655,"children":61656},{"style":222},[61657],{"type":26,"value":368},{"type":21,"tag":209,"props":61659,"children":61660},{"style":216},[61661],{"type":26,"value":5370},{"type":21,"tag":209,"props":61663,"children":61664},{"style":222},[61665],{"type":26,"value":368},{"type":21,"tag":209,"props":61667,"children":61668},{"style":400},[61669],{"type":26,"value":10250},{"type":21,"tag":209,"props":61671,"children":61672},{"style":222},[61673],{"type":26,"value":2369},{"type":21,"tag":209,"props":61675,"children":61676},{"class":211,"line":244},[61677],{"type":21,"tag":209,"props":61678,"children":61679},{"style":448},[61680],{"type":26,"value":4697},{"type":21,"tag":209,"props":61682,"children":61683},{"class":211,"line":254},[61684],{"type":21,"tag":209,"props":61685,"children":61686},{"style":448},[61687],{"type":26,"value":61688},"     * Register ajax transports for blob send/recieve and array buffer send/receive via XMLHttpRequest Level 2\n",{"type":21,"tag":209,"props":61690,"children":61691},{"class":211,"line":279},[61692],{"type":21,"tag":209,"props":61693,"children":61694},{"style":448},[61695],{"type":26,"value":61696},"     * within the comfortable framework of the jquery ajax request, with full support for promises.\n",{"type":21,"tag":209,"props":61698,"children":61699},{"class":211,"line":288},[61700],{"type":21,"tag":209,"props":61701,"children":61702},{"style":448},[61703],{"type":26,"value":15103},{"type":21,"tag":209,"props":61705,"children":61706},{"class":211,"line":307},[61707],{"type":21,"tag":209,"props":61708,"children":61709},{"style":448},[61710],{"type":26,"value":61711},"     * Notice the +* in the dataType string? The + indicates we want this transport to be prepended to the list\n",{"type":21,"tag":209,"props":61713,"children":61714},{"class":211,"line":325},[61715],{"type":21,"tag":209,"props":61716,"children":61717},{"style":448},[61718],{"type":26,"value":61719},"     * of potential transports (so it gets first dibs if the request passes the conditions within to provide the\n",{"type":21,"tag":209,"props":61721,"children":61722},{"class":211,"line":334},[61723],{"type":21,"tag":209,"props":61724,"children":61725},{"style":448},[61726],{"type":26,"value":61727},"     * ajax transport, preventing the standard transport from hogging the request), and the * indicates that\n",{"type":21,"tag":209,"props":61729,"children":61730},{"class":211,"line":343},[61731],{"type":21,"tag":209,"props":61732,"children":61733},{"style":448},[61734],{"type":26,"value":61735},"     * potentially any request with any dataType might want to use the transports provided herein.\n",{"type":21,"tag":209,"props":61737,"children":61738},{"class":211,"line":351},[61739],{"type":21,"tag":209,"props":61740,"children":61741},{"style":448},[61742],{"type":26,"value":15103},{"type":21,"tag":209,"props":61744,"children":61745},{"class":211,"line":444},[61746],{"type":21,"tag":209,"props":61747,"children":61748},{"style":448},[61749],{"type":26,"value":61750},"     * Remember to specify 'processData:false' in the ajax options when attempting to send a blob or arraybuffer -\n",{"type":21,"tag":209,"props":61752,"children":61753},{"class":211,"line":454},[61754],{"type":21,"tag":209,"props":61755,"children":61756},{"style":448},[61757],{"type":26,"value":61758},"     * otherwise jquery will try (and fail) to convert the blob or buffer into a query string.\n",{"type":21,"tag":209,"props":61760,"children":61761},{"class":211,"line":463},[61762],{"type":21,"tag":209,"props":61763,"children":61764},{"style":448},[61765],{"type":26,"value":15103},{"type":21,"tag":209,"props":61767,"children":61768},{"class":211,"line":472},[61769],{"type":21,"tag":209,"props":61770,"children":61771},{"style":448},[61772],{"type":26,"value":61773},"     * This revision now includes sending headers, resolves the stack overflow in abort(), and sets the status text\n",{"type":21,"tag":209,"props":61775,"children":61776},{"class":211,"line":480},[61777],{"type":21,"tag":209,"props":61778,"children":61779},{"style":448},[61780],{"type":26,"value":61781},"     * into the response if the request is unsuccessful.\n",{"type":21,"tag":209,"props":61783,"children":61784},{"class":211,"line":489},[61785],{"type":21,"tag":209,"props":61786,"children":61787},{"style":448},[61788],{"type":26,"value":4753},{"type":21,"tag":209,"props":61790,"children":61791},{"class":211,"line":847},[61792,61796,61800,61804,61808,61812,61816,61820,61824,61828,61832,61836,61840],{"type":21,"tag":209,"props":61793,"children":61794},{"style":222},[61795],{"type":26,"value":31124},{"type":21,"tag":209,"props":61797,"children":61798},{"style":360},[61799],{"type":26,"value":31966},{"type":21,"tag":209,"props":61801,"children":61802},{"style":222},[61803],{"type":26,"value":368},{"type":21,"tag":209,"props":61805,"children":61806},{"style":233},[61807],{"type":26,"value":31975},{"type":21,"tag":209,"props":61809,"children":61810},{"style":222},[61811],{"type":26,"value":408},{"type":21,"tag":209,"props":61813,"children":61814},{"style":216},[61815],{"type":26,"value":5370},{"type":21,"tag":209,"props":61817,"children":61818},{"style":222},[61819],{"type":26,"value":368},{"type":21,"tag":209,"props":61821,"children":61822},{"style":400},[61823],{"type":26,"value":29825},{"type":21,"tag":209,"props":61825,"children":61826},{"style":222},[61827],{"type":26,"value":408},{"type":21,"tag":209,"props":61829,"children":61830},{"style":400},[61831],{"type":26,"value":60450},{"type":21,"tag":209,"props":61833,"children":61834},{"style":222},[61835],{"type":26,"value":408},{"type":21,"tag":209,"props":61837,"children":61838},{"style":400},[61839],{"type":26,"value":18108},{"type":21,"tag":209,"props":61841,"children":61842},{"style":222},[61843],{"type":26,"value":2369},{"type":21,"tag":209,"props":61845,"children":61846},{"class":211,"line":860},[61847],{"type":21,"tag":209,"props":61848,"children":61849},{"style":448},[61850],{"type":26,"value":61851},"        // Test for the conditions that mean we can/want to send/receive blobs or arraybuffers - we need XMLHttpRequest\n",{"type":21,"tag":209,"props":61853,"children":61854},{"class":211,"line":877},[61855],{"type":21,"tag":209,"props":61856,"children":61857},{"style":448},[61858],{"type":26,"value":61859},"        // level 2 (so feature-detect against window.FormData), feature detect against window.Blob or window.ArrayBuffer,\n",{"type":21,"tag":209,"props":61861,"children":61862},{"class":211,"line":889},[61863],{"type":21,"tag":209,"props":61864,"children":61865},{"style":448},[61866],{"type":26,"value":61867},"        // and then check to see if the dataType is blob/arraybuffer or the data itself is a Blob/ArrayBuffer\n",{"type":21,"tag":209,"props":61869,"children":61870},{"class":211,"line":902},[61871,61875,61879,61883,61887,61891,61895,61899,61903,61907,61911,61915,61919],{"type":21,"tag":209,"props":61872,"children":61873},{"style":216},[61874],{"type":26,"value":5803},{"type":21,"tag":209,"props":61876,"children":61877},{"style":222},[61878],{"type":26,"value":60498},{"type":21,"tag":209,"props":61880,"children":61881},{"style":216},[61882],{"type":26,"value":15578},{"type":21,"tag":209,"props":61884,"children":61885},{"style":222},[61886],{"type":26,"value":60507},{"type":21,"tag":209,"props":61888,"children":61889},{"style":216},[61890],{"type":26,"value":15578},{"type":21,"tag":209,"props":61892,"children":61893},{"style":222},[61894],{"type":26,"value":60516},{"type":21,"tag":209,"props":61896,"children":61897},{"style":216},[61898],{"type":26,"value":12908},{"type":21,"tag":209,"props":61900,"children":61901},{"style":233},[61902],{"type":26,"value":60204},{"type":21,"tag":209,"props":61904,"children":61905},{"style":216},[61906],{"type":26,"value":18721},{"type":21,"tag":209,"props":61908,"children":61909},{"style":222},[61910],{"type":26,"value":60533},{"type":21,"tag":209,"props":61912,"children":61913},{"style":216},[61914],{"type":26,"value":12908},{"type":21,"tag":209,"props":61916,"children":61917},{"style":233},[61918],{"type":26,"value":60542},{"type":21,"tag":209,"props":61920,"children":61921},{"style":222},[61922],{"type":26,"value":35445},{"type":21,"tag":209,"props":61924,"children":61925},{"class":211,"line":914},[61926,61930,61934,61938,61942,61946,61950,61954,61958],{"type":21,"tag":209,"props":61927,"children":61928},{"style":216},[61929],{"type":26,"value":60596},{"type":21,"tag":209,"props":61931,"children":61932},{"style":222},[61933],{"type":26,"value":30058},{"type":21,"tag":209,"props":61935,"children":61936},{"style":216},[61937],{"type":26,"value":15578},{"type":21,"tag":209,"props":61939,"children":61940},{"style":222},[61941],{"type":26,"value":60567},{"type":21,"tag":209,"props":61943,"children":61944},{"style":216},[61945],{"type":26,"value":15578},{"type":21,"tag":209,"props":61947,"children":61948},{"style":222},[61949],{"type":26,"value":60576},{"type":21,"tag":209,"props":61951,"children":61952},{"style":216},[61953],{"type":26,"value":49963},{"type":21,"tag":209,"props":61955,"children":61956},{"style":360},[61957],{"type":26,"value":9014},{"type":21,"tag":209,"props":61959,"children":61960},{"style":222},[61961],{"type":26,"value":10112},{"type":21,"tag":209,"props":61963,"children":61964},{"class":211,"line":922},[61965,61970,61974,61978,61982,61986,61990],{"type":21,"tag":209,"props":61966,"children":61967},{"style":216},[61968],{"type":26,"value":61969},"                ||",{"type":21,"tag":209,"props":61971,"children":61972},{"style":222},[61973],{"type":26,"value":60601},{"type":21,"tag":209,"props":61975,"children":61976},{"style":216},[61977],{"type":26,"value":15578},{"type":21,"tag":209,"props":61979,"children":61980},{"style":222},[61981],{"type":26,"value":60576},{"type":21,"tag":209,"props":61983,"children":61984},{"style":216},[61985],{"type":26,"value":49963},{"type":21,"tag":209,"props":61987,"children":61988},{"style":360},[61989],{"type":26,"value":60618},{"type":21,"tag":209,"props":61991,"children":61992},{"style":222},[61993],{"type":26,"value":60623},{"type":21,"tag":209,"props":61995,"children":61996},{"class":211,"line":2312},[61997],{"type":21,"tag":209,"props":61998,"children":61999},{"style":222},[62000],{"type":26,"value":62001},"            ))\n",{"type":21,"tag":209,"props":62003,"children":62004},{"class":211,"line":2321},[62005],{"type":21,"tag":209,"props":62006,"children":62007},{"style":222},[62008],{"type":26,"value":7561},{"type":21,"tag":209,"props":62010,"children":62011},{"class":211,"line":2372},[62012,62016],{"type":21,"tag":209,"props":62013,"children":62014},{"style":216},[62015],{"type":26,"value":5959},{"type":21,"tag":209,"props":62017,"children":62018},{"style":222},[62019],{"type":26,"value":62020}," xhr;\n",{"type":21,"tag":209,"props":62022,"children":62023},{"class":211,"line":2381},[62024],{"type":21,"tag":209,"props":62025,"children":62026},{"emptyLinePlaceholder":248},[62027],{"type":26,"value":251},{"type":21,"tag":209,"props":62029,"children":62030},{"class":211,"line":2389},[62031,62035],{"type":21,"tag":209,"props":62032,"children":62033},{"style":216},[62034],{"type":26,"value":5101},{"type":21,"tag":209,"props":62036,"children":62037},{"style":222},[62038],{"type":26,"value":276},{"type":21,"tag":209,"props":62040,"children":62041},{"class":211,"line":2397},[62042],{"type":21,"tag":209,"props":62043,"children":62044},{"style":448},[62045],{"type":26,"value":32131},{"type":21,"tag":209,"props":62047,"children":62048},{"class":211,"line":2406},[62049],{"type":21,"tag":209,"props":62050,"children":62051},{"style":448},[62052],{"type":26,"value":62053},"                 * Return a transport capable of sending and/or receiving blobs - in this case, we instantiate\n",{"type":21,"tag":209,"props":62055,"children":62056},{"class":211,"line":2415},[62057],{"type":21,"tag":209,"props":62058,"children":62059},{"style":448},[62060],{"type":26,"value":62061},"                 * a new XMLHttpRequest and use it to actually perform the request, and funnel the result back\n",{"type":21,"tag":209,"props":62063,"children":62064},{"class":211,"line":2424},[62065],{"type":21,"tag":209,"props":62066,"children":62067},{"style":448},[62068],{"type":26,"value":62069},"                 * into the jquery complete callback (such as the success function, done blocks, etc.)\n",{"type":21,"tag":209,"props":62071,"children":62072},{"class":211,"line":2433},[62073],{"type":21,"tag":209,"props":62074,"children":62075},{"style":448},[62076],{"type":26,"value":62077},"                 *\n",{"type":21,"tag":209,"props":62079,"children":62080},{"class":211,"line":2442},[62081,62086,62090],{"type":21,"tag":209,"props":62082,"children":62083},{"style":448},[62084],{"type":26,"value":62085},"                 * ",{"type":21,"tag":209,"props":62087,"children":62088},{"style":216},[62089],{"type":26,"value":4718},{"type":21,"tag":209,"props":62091,"children":62092},{"style":222},[62093],{"type":26,"value":62094}," headers\n",{"type":21,"tag":209,"props":62096,"children":62097},{"class":211,"line":2471},[62098,62102,62106],{"type":21,"tag":209,"props":62099,"children":62100},{"style":448},[62101],{"type":26,"value":62085},{"type":21,"tag":209,"props":62103,"children":62104},{"style":216},[62105],{"type":26,"value":4718},{"type":21,"tag":209,"props":62107,"children":62108},{"style":222},[62109],{"type":26,"value":62110}," completeCallback\n",{"type":21,"tag":209,"props":62112,"children":62113},{"class":211,"line":2480},[62114],{"type":21,"tag":209,"props":62115,"children":62116},{"style":448},[62117],{"type":26,"value":32163},{"type":21,"tag":209,"props":62119,"children":62120},{"class":211,"line":2489},[62121,62126,62130,62134,62138,62142,62146,62150],{"type":21,"tag":209,"props":62122,"children":62123},{"style":360},[62124],{"type":26,"value":62125},"                send",{"type":21,"tag":209,"props":62127,"children":62128},{"style":222},[62129],{"type":26,"value":7427},{"type":21,"tag":209,"props":62131,"children":62132},{"style":216},[62133],{"type":26,"value":5370},{"type":21,"tag":209,"props":62135,"children":62136},{"style":222},[62137],{"type":26,"value":368},{"type":21,"tag":209,"props":62139,"children":62140},{"style":400},[62141],{"type":26,"value":15176},{"type":21,"tag":209,"props":62143,"children":62144},{"style":222},[62145],{"type":26,"value":408},{"type":21,"tag":209,"props":62147,"children":62148},{"style":400},[62149],{"type":26,"value":32207},{"type":21,"tag":209,"props":62151,"children":62152},{"style":222},[62153],{"type":26,"value":2369},{"type":21,"tag":209,"props":62155,"children":62156},{"class":211,"line":2516},[62157,62161,62165,62169,62173,62177],{"type":21,"tag":209,"props":62158,"children":62159},{"style":216},[62160],{"type":26,"value":56915},{"type":21,"tag":209,"props":62162,"children":62163},{"style":222},[62164],{"type":26,"value":15277},{"type":21,"tag":209,"props":62166,"children":62167},{"style":216},[62168],{"type":26,"value":1432},{"type":21,"tag":209,"props":62170,"children":62171},{"style":222},[62172],{"type":26,"value":60774},{"type":21,"tag":209,"props":62174,"children":62175},{"style":216},[62176],{"type":26,"value":4677},{"type":21,"tag":209,"props":62178,"children":62179},{"style":222},[62180],{"type":26,"value":60783},{"type":21,"tag":209,"props":62182,"children":62183},{"class":211,"line":2525},[62184,62189,62193,62197,62201,62205],{"type":21,"tag":209,"props":62185,"children":62186},{"style":222},[62187],{"type":26,"value":62188},"                        type ",{"type":21,"tag":209,"props":62190,"children":62191},{"style":216},[62192],{"type":26,"value":1432},{"type":21,"tag":209,"props":62194,"children":62195},{"style":222},[62196],{"type":26,"value":30049},{"type":21,"tag":209,"props":62198,"children":62199},{"style":216},[62200],{"type":26,"value":4677},{"type":21,"tag":209,"props":62202,"children":62203},{"style":233},[62204],{"type":26,"value":60808},{"type":21,"tag":209,"props":62206,"children":62207},{"style":222},[62208],{"type":26,"value":304},{"type":21,"tag":209,"props":62210,"children":62211},{"class":211,"line":2533},[62212,62217,62221,62225,62229,62233],{"type":21,"tag":209,"props":62213,"children":62214},{"style":222},[62215],{"type":26,"value":62216},"                        dataType ",{"type":21,"tag":209,"props":62218,"children":62219},{"style":216},[62220],{"type":26,"value":1432},{"type":21,"tag":209,"props":62222,"children":62223},{"style":222},[62224],{"type":26,"value":60533},{"type":21,"tag":209,"props":62226,"children":62227},{"style":216},[62228],{"type":26,"value":4677},{"type":21,"tag":209,"props":62230,"children":62231},{"style":233},[62232],{"type":26,"value":60837},{"type":21,"tag":209,"props":62234,"children":62235},{"style":222},[62236],{"type":26,"value":304},{"type":21,"tag":209,"props":62238,"children":62239},{"class":211,"line":2542},[62240,62245,62249,62253,62257,62261],{"type":21,"tag":209,"props":62241,"children":62242},{"style":222},[62243],{"type":26,"value":62244},"                        data ",{"type":21,"tag":209,"props":62246,"children":62247},{"style":216},[62248],{"type":26,"value":1432},{"type":21,"tag":209,"props":62250,"children":62251},{"style":222},[62252],{"type":26,"value":60576},{"type":21,"tag":209,"props":62254,"children":62255},{"style":216},[62256],{"type":26,"value":4677},{"type":21,"tag":209,"props":62258,"children":62259},{"style":263},[62260],{"type":26,"value":41733},{"type":21,"tag":209,"props":62262,"children":62263},{"style":222},[62264],{"type":26,"value":304},{"type":21,"tag":209,"props":62266,"children":62267},{"class":211,"line":2550},[62268,62273,62277,62281,62285,62289],{"type":21,"tag":209,"props":62269,"children":62270},{"style":222},[62271],{"type":26,"value":62272},"                        async ",{"type":21,"tag":209,"props":62274,"children":62275},{"style":216},[62276],{"type":26,"value":1432},{"type":21,"tag":209,"props":62278,"children":62279},{"style":222},[62280],{"type":26,"value":60886},{"type":21,"tag":209,"props":62282,"children":62283},{"style":216},[62284],{"type":26,"value":4677},{"type":21,"tag":209,"props":62286,"children":62287},{"style":263},[62288],{"type":26,"value":6243},{"type":21,"tag":209,"props":62290,"children":62291},{"style":222},[62292],{"type":26,"value":241},{"type":21,"tag":209,"props":62294,"children":62295},{"class":211,"line":2564},[62296],{"type":21,"tag":209,"props":62297,"children":62298},{"emptyLinePlaceholder":248},[62299],{"type":26,"value":251},{"type":21,"tag":209,"props":62301,"children":62302},{"class":211,"line":2611},[62303,62308,62312,62316,62320],{"type":21,"tag":209,"props":62304,"children":62305},{"style":222},[62306],{"type":26,"value":62307},"                    xhr ",{"type":21,"tag":209,"props":62309,"children":62310},{"style":216},[62311],{"type":26,"value":1432},{"type":21,"tag":209,"props":62313,"children":62314},{"style":216},[62315],{"type":26,"value":4667},{"type":21,"tag":209,"props":62317,"children":62318},{"style":360},[62319],{"type":26,"value":17634},{"type":21,"tag":209,"props":62321,"children":62322},{"style":222},[62323],{"type":26,"value":4842},{"type":21,"tag":209,"props":62325,"children":62326},{"class":211,"line":2619},[62327,62332,62336,62340,62344,62348,62352],{"type":21,"tag":209,"props":62328,"children":62329},{"style":222},[62330],{"type":26,"value":62331},"                    xhr.",{"type":21,"tag":209,"props":62333,"children":62334},{"style":360},[62335],{"type":26,"value":6424},{"type":21,"tag":209,"props":62337,"children":62338},{"style":222},[62339],{"type":26,"value":368},{"type":21,"tag":209,"props":62341,"children":62342},{"style":233},[62343],{"type":26,"value":11055},{"type":21,"tag":209,"props":62345,"children":62346},{"style":222},[62347],{"type":26,"value":408},{"type":21,"tag":209,"props":62349,"children":62350},{"style":216},[62351],{"type":26,"value":5370},{"type":21,"tag":209,"props":62353,"children":62354},{"style":222},[62355],{"type":26,"value":2561},{"type":21,"tag":209,"props":62357,"children":62358},{"class":211,"line":2627},[62359,62364,62368,62372],{"type":21,"tag":209,"props":62360,"children":62361},{"style":216},[62362],{"type":26,"value":62363},"                        var",{"type":21,"tag":209,"props":62365,"children":62366},{"style":222},[62367],{"type":26,"value":25161},{"type":21,"tag":209,"props":62369,"children":62370},{"style":216},[62371],{"type":26,"value":1432},{"type":21,"tag":209,"props":62373,"children":62374},{"style":222},[62375],{"type":26,"value":47144},{"type":21,"tag":209,"props":62377,"children":62378},{"class":211,"line":2636},[62379,62384,62388,62393,62398,62402,62406,62410,62414,62419,62423,62427,62431,62436],{"type":21,"tag":209,"props":62380,"children":62381},{"style":222},[62382],{"type":26,"value":62383},"                            success ",{"type":21,"tag":209,"props":62385,"children":62386},{"style":216},[62387],{"type":26,"value":1432},{"type":21,"tag":209,"props":62389,"children":62390},{"style":222},[62391],{"type":26,"value":62392}," xhr.status ",{"type":21,"tag":209,"props":62394,"children":62395},{"style":216},[62396],{"type":26,"value":62397},">=",{"type":21,"tag":209,"props":62399,"children":62400},{"style":263},[62401],{"type":26,"value":18716},{"type":21,"tag":209,"props":62403,"children":62404},{"style":216},[62405],{"type":26,"value":15539},{"type":21,"tag":209,"props":62407,"children":62408},{"style":222},[62409],{"type":26,"value":62392},{"type":21,"tag":209,"props":62411,"children":62412},{"style":216},[62413],{"type":26,"value":1985},{"type":21,"tag":209,"props":62415,"children":62416},{"style":263},[62417],{"type":26,"value":62418}," 300",{"type":21,"tag":209,"props":62420,"children":62421},{"style":216},[62422],{"type":26,"value":18721},{"type":21,"tag":209,"props":62424,"children":62425},{"style":222},[62426],{"type":26,"value":62392},{"type":21,"tag":209,"props":62428,"children":62429},{"style":216},[62430],{"type":26,"value":6102},{"type":21,"tag":209,"props":62432,"children":62433},{"style":263},[62434],{"type":26,"value":62435}," 304",{"type":21,"tag":209,"props":62437,"children":62438},{"style":222},[62439],{"type":26,"value":241},{"type":21,"tag":209,"props":62441,"children":62442},{"class":211,"line":2644},[62443],{"type":21,"tag":209,"props":62444,"children":62445},{"emptyLinePlaceholder":248},[62446],{"type":26,"value":251},{"type":21,"tag":209,"props":62448,"children":62449},{"class":211,"line":2657},[62450,62455],{"type":21,"tag":209,"props":62451,"children":62452},{"style":216},[62453],{"type":26,"value":62454},"                        if",{"type":21,"tag":209,"props":62456,"children":62457},{"style":222},[62458],{"type":26,"value":62459}," (success){\n",{"type":21,"tag":209,"props":62461,"children":62462},{"class":211,"line":2728},[62463,62468,62472],{"type":21,"tag":209,"props":62464,"children":62465},{"style":222},[62466],{"type":26,"value":62467},"                            res[dataType] ",{"type":21,"tag":209,"props":62469,"children":62470},{"style":216},[62471],{"type":26,"value":1432},{"type":21,"tag":209,"props":62473,"children":62474},{"style":222},[62475],{"type":26,"value":60980},{"type":21,"tag":209,"props":62477,"children":62478},{"class":211,"line":2758},[62479,62484,62489],{"type":21,"tag":209,"props":62480,"children":62481},{"style":222},[62482],{"type":26,"value":62483},"                        } ",{"type":21,"tag":209,"props":62485,"children":62486},{"style":216},[62487],{"type":26,"value":62488},"else",{"type":21,"tag":209,"props":62490,"children":62491},{"style":222},[62492],{"type":26,"value":276},{"type":21,"tag":209,"props":62494,"children":62495},{"class":211,"line":2776},[62496,62501,62505],{"type":21,"tag":209,"props":62497,"children":62498},{"style":222},[62499],{"type":26,"value":62500},"                            res.text ",{"type":21,"tag":209,"props":62502,"children":62503},{"style":216},[62504],{"type":26,"value":1432},{"type":21,"tag":209,"props":62506,"children":62507},{"style":222},[62508],{"type":26,"value":62509}," xhr.statusText;\n",{"type":21,"tag":209,"props":62511,"children":62512},{"class":211,"line":2785},[62513],{"type":21,"tag":209,"props":62514,"children":62515},{"style":222},[62516],{"type":26,"value":62517},"                        }\n",{"type":21,"tag":209,"props":62519,"children":62520},{"class":211,"line":2793},[62521],{"type":21,"tag":209,"props":62522,"children":62523},{"emptyLinePlaceholder":248},[62524],{"type":26,"value":251},{"type":21,"tag":209,"props":62526,"children":62527},{"class":211,"line":2801},[62528,62533,62537,62541],{"type":21,"tag":209,"props":62529,"children":62530},{"style":360},[62531],{"type":26,"value":62532},"                        completeCallback",{"type":21,"tag":209,"props":62534,"children":62535},{"style":222},[62536],{"type":26,"value":60993},{"type":21,"tag":209,"props":62538,"children":62539},{"style":360},[62540],{"type":26,"value":60998},{"type":21,"tag":209,"props":62542,"children":62543},{"style":222},[62544],{"type":26,"value":52185},{"type":21,"tag":209,"props":62546,"children":62547},{"class":211,"line":2809},[62548],{"type":21,"tag":209,"props":62549,"children":62550},{"style":222},[62551],{"type":26,"value":62552},"                    });\n",{"type":21,"tag":209,"props":62554,"children":62555},{"class":211,"line":6219},[62556],{"type":21,"tag":209,"props":62557,"children":62558},{"emptyLinePlaceholder":248},[62559],{"type":26,"value":251},{"type":21,"tag":209,"props":62561,"children":62562},{"class":211,"line":6228},[62563,62567,62571],{"type":21,"tag":209,"props":62564,"children":62565},{"style":222},[62566],{"type":26,"value":62331},{"type":21,"tag":209,"props":62568,"children":62569},{"style":360},[62570],{"type":26,"value":11610},{"type":21,"tag":209,"props":62572,"children":62573},{"style":222},[62574],{"type":26,"value":61032},{"type":21,"tag":209,"props":62576,"children":62577},{"class":211,"line":6250},[62578,62583,62587],{"type":21,"tag":209,"props":62579,"children":62580},{"style":222},[62581],{"type":26,"value":62582},"                    xhr.responseType ",{"type":21,"tag":209,"props":62584,"children":62585},{"style":216},[62586],{"type":26,"value":1432},{"type":21,"tag":209,"props":62588,"children":62589},{"style":222},[62590],{"type":26,"value":61049},{"type":21,"tag":209,"props":62592,"children":62593},{"class":211,"line":6258},[62594],{"type":21,"tag":209,"props":62595,"children":62596},{"emptyLinePlaceholder":248},[62597],{"type":26,"value":251},{"type":21,"tag":209,"props":62599,"children":62600},{"class":211,"line":6267},[62601,62606,62610,62614,62619,62623],{"type":21,"tag":209,"props":62602,"children":62603},{"style":216},[62604],{"type":26,"value":62605},"                    for",{"type":21,"tag":209,"props":62607,"children":62608},{"style":222},[62609],{"type":26,"value":4776},{"type":21,"tag":209,"props":62611,"children":62612},{"style":216},[62613],{"type":26,"value":8996},{"type":21,"tag":209,"props":62615,"children":62616},{"style":222},[62617],{"type":26,"value":62618}," key ",{"type":21,"tag":209,"props":62620,"children":62621},{"style":216},[62622],{"type":26,"value":20723},{"type":21,"tag":209,"props":62624,"children":62625},{"style":222},[62626],{"type":26,"value":62627}," headers){\n",{"type":21,"tag":209,"props":62629,"children":62630},{"class":211,"line":6303},[62631,62635,62640,62645],{"type":21,"tag":209,"props":62632,"children":62633},{"style":216},[62634],{"type":26,"value":62454},{"type":21,"tag":209,"props":62636,"children":62637},{"style":222},[62638],{"type":26,"value":62639}," (headers.",{"type":21,"tag":209,"props":62641,"children":62642},{"style":360},[62643],{"type":26,"value":62644},"hasOwnProperty",{"type":21,"tag":209,"props":62646,"children":62647},{"style":222},[62648],{"type":26,"value":62649},"(key)){\n",{"type":21,"tag":209,"props":62651,"children":62652},{"class":211,"line":6336},[62653,62658,62663],{"type":21,"tag":209,"props":62654,"children":62655},{"style":222},[62656],{"type":26,"value":62657},"                            xhr.",{"type":21,"tag":209,"props":62659,"children":62660},{"style":360},[62661],{"type":26,"value":62662},"setRequestHeader",{"type":21,"tag":209,"props":62664,"children":62665},{"style":222},[62666],{"type":26,"value":62667},"(key, headers[key]);\n",{"type":21,"tag":209,"props":62669,"children":62670},{"class":211,"line":6369},[62671],{"type":21,"tag":209,"props":62672,"children":62673},{"style":222},[62674],{"type":26,"value":62517},{"type":21,"tag":209,"props":62676,"children":62677},{"class":211,"line":6378},[62678],{"type":21,"tag":209,"props":62679,"children":62680},{"style":222},[62681],{"type":26,"value":12047},{"type":21,"tag":209,"props":62683,"children":62684},{"class":211,"line":6387},[62685],{"type":21,"tag":209,"props":62686,"children":62687},{"emptyLinePlaceholder":248},[62688],{"type":26,"value":251},{"type":21,"tag":209,"props":62690,"children":62691},{"class":211,"line":6395},[62692,62696,62700],{"type":21,"tag":209,"props":62693,"children":62694},{"style":222},[62695],{"type":26,"value":62331},{"type":21,"tag":209,"props":62697,"children":62698},{"style":360},[62699],{"type":26,"value":17917},{"type":21,"tag":209,"props":62701,"children":62702},{"style":222},[62703],{"type":26,"value":61065},{"type":21,"tag":209,"props":62705,"children":62706},{"class":211,"line":6404},[62707],{"type":21,"tag":209,"props":62708,"children":62709},{"style":222},[62710],{"type":26,"value":62711},"                },\n",{"type":21,"tag":209,"props":62713,"children":62714},{"class":211,"line":6413},[62715,62720,62724,62728],{"type":21,"tag":209,"props":62716,"children":62717},{"style":360},[62718],{"type":26,"value":62719},"                abort",{"type":21,"tag":209,"props":62721,"children":62722},{"style":222},[62723],{"type":26,"value":7427},{"type":21,"tag":209,"props":62725,"children":62726},{"style":216},[62727],{"type":26,"value":5370},{"type":21,"tag":209,"props":62729,"children":62730},{"style":222},[62731],{"type":26,"value":2561},{"type":21,"tag":209,"props":62733,"children":62734},{"class":211,"line":6447},[62735,62739],{"type":21,"tag":209,"props":62736,"children":62737},{"style":216},[62738],{"type":26,"value":12001},{"type":21,"tag":209,"props":62740,"children":62741},{"style":222},[62742],{"type":26,"value":62743}," (xhr){\n",{"type":21,"tag":209,"props":62745,"children":62746},{"class":211,"line":6479},[62747,62752,62756],{"type":21,"tag":209,"props":62748,"children":62749},{"style":222},[62750],{"type":26,"value":62751},"                        xhr.",{"type":21,"tag":209,"props":62753,"children":62754},{"style":360},[62755],{"type":26,"value":61105},{"type":21,"tag":209,"props":62757,"children":62758},{"style":222},[62759],{"type":26,"value":4842},{"type":21,"tag":209,"props":62761,"children":62762},{"class":211,"line":6511},[62763],{"type":21,"tag":209,"props":62764,"children":62765},{"style":222},[62766],{"type":26,"value":12047},{"type":21,"tag":209,"props":62768,"children":62769},{"class":211,"line":6519},[62770],{"type":21,"tag":209,"props":62771,"children":62772},{"style":222},[62773],{"type":26,"value":16636},{"type":21,"tag":209,"props":62775,"children":62776},{"class":211,"line":6527},[62777],{"type":21,"tag":209,"props":62778,"children":62779},{"style":222},[62780],{"type":26,"value":6375},{"type":21,"tag":209,"props":62782,"children":62783},{"class":211,"line":6535},[62784],{"type":21,"tag":209,"props":62785,"children":62786},{"style":222},[62787],{"type":26,"value":2235},{"type":21,"tag":209,"props":62789,"children":62790},{"class":211,"line":6543},[62791],{"type":21,"tag":209,"props":62792,"children":62793},{"style":222},[62794],{"type":26,"value":3391},{"type":21,"tag":209,"props":62796,"children":62797},{"class":211,"line":6552},[62798],{"type":21,"tag":209,"props":62799,"children":62800},{"style":222},[62801],{"type":26,"value":50721},{"type":21,"tag":22,"props":62803,"children":62804},{},[62805,62812],{"type":21,"tag":29,"props":62806,"children":62810},{"href":62807,"rel":62808,"title":62809},"https://gist.github.com/SaneMethod/7548768/",[93],"You can also find it here",[62811],{"type":26,"value":62809},{"type":26,"value":378},{"type":21,"tag":3490,"props":62814,"children":62815},{},[62816],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":62818},[],"content:ckeefer:2013-11:jquery-ajax-blobs.md","ckeefer/2013-11/jquery-ajax-blobs.md","ckeefer/2013-11/jquery-ajax-blobs",{"user":3518,"name":3519},{"_path":62824,"_dir":62825,"_draft":7,"_partial":7,"_locale":8,"title":62826,"description":62827,"publishDate":62828,"tags":62829,"image":62834,"excerpt":62827,"body":62835,"_type":3511,"_id":64579,"_source":3513,"_file":64580,"_stem":64581,"_extension":3516,"author":64582},"/ckeefer/2013-2/xslt","2013-2","XML and XSLT","Not terribly long ago, XML was the darling of the web. HTML4 was reformulated as XHTML 1.0, SOAP messages were XML, and let us not forget XMLHttpRequest.","2013-10-08",[62830,62831,62832,62833],"data-formats","xml","xsl","xslt","/ckeefer/2013-2/img/xslt-processing.png",{"type":18,"children":62836,"toc":64570},[62837,62872,62886,62900,62906,62920,62928,62933,62939,62951,62957,62962,62968,62973,62986,62999,63252,63265,63612,63640,63653,63666,64441,64446,64452,64457,64462,64483,64489,64494,64508,64513,64518,64524,64529,64552,64566],{"type":21,"tag":22,"props":62838,"children":62839},{},[62840,62842,62849,62850,62857,62859,62871],{"type":26,"value":62841},"Not terribly long ago, XML was the darling of the web. HTML4 was reformulated as ",{"type":21,"tag":29,"props":62843,"children":62846},{"href":62844,"rel":62845},"http://en.wikipedia.org/wiki/Xhtml",[93],[62847],{"type":26,"value":62848},"XHTML 1.0",{"type":26,"value":408},{"type":21,"tag":29,"props":62851,"children":62854},{"href":62852,"rel":62853},"http://en.wikipedia.org/wiki/SOAP",[93],[62855],{"type":26,"value":62856},"SOAP",{"type":26,"value":62858}," messages were XML, and let us not forget ",{"type":21,"tag":29,"props":62860,"children":62863},{"href":62861,"rel":62862},"http://en.wikipedia.org/wiki/XMLHttpRequest",[93],[62864,62869],{"type":21,"tag":5270,"props":62865,"children":62866},{},[62867],{"type":26,"value":62868},"XML",{"type":26,"value":62870},"HttpRequest",{"type":26,"value":378},{"type":21,"tag":22,"props":62873,"children":62874},{},[62875,62877,62884],{"type":26,"value":62876},"XML's 15 minutes of fame came and went, however, when JSON entered the scene. Your ajax request today is far more likely to receive a JSON return that can parsed into native objects than an XML document that has to be parsed like markup; HTML5 ",{"type":21,"tag":29,"props":62878,"children":62881},{"href":62879,"rel":62880},"http://www.ibm.com/developerworks/library/x-think45/#N100DE",[93],[62882],{"type":26,"value":62883},"parted ways with XML compliance",{"type":26,"value":62885},"; REST replaced SOAP for most development (and while you can, of course, send and receive XML with REST, its certainly less common).",{"type":21,"tag":22,"props":62887,"children":62888},{},[62889,62891,62898],{"type":26,"value":62890},"XML's passing is hardly to be lamented - JSON really is the better choice in many instances. But out of XML's celebrity status, its human-readable/editable similarity to markup, and the need/desire to employ it in a wide variety of scenarios, came some interesting benefits that linger today - one of them being Extensible Stylesheet Language Transformations (XSLT). As promised ",{"type":21,"tag":29,"props":62892,"children":62895},{"href":62893,"rel":62894},"http://blog.artlogic.com/2013/08/29/client-side-fulltext-searching-with-fullproof/",[93],[62896],{"type":26,"value":62897},"previously",{"type":26,"value":62899}," let's take a look at what XSLT is, and what it can offer us.",{"type":21,"tag":193,"props":62901,"children":62903},{"id":62902},"so-what-is-xslt",[62904],{"type":26,"value":62905},"So what is XSLT?",{"type":21,"tag":22,"props":62907,"children":62908},{},[62909,62911,62919],{"type":26,"value":62910},"Per ",{"type":21,"tag":29,"props":62912,"children":62916},{"href":62913,"rel":62914,"title":62915},"https://developer.mozilla.org/en-US/docs/XSLT",[93],"Mozilla Developer Network",[62917],{"type":26,"value":62918},"MDN",{"type":26,"value":191},{"type":21,"tag":4462,"props":62921,"children":62922},{},[62923],{"type":21,"tag":22,"props":62924,"children":62925},{},[62926],{"type":26,"value":62927},"[XSLT] is an XML-based language used, in conjunction with specialized processing software, for the transformation of XML documents. Although the process is referred to as \"transformation,\" the original document is not changed; rather, a new XML document is created based on the content of an existing document. Then, the new document may be serialized (output) by the processor in standard XML syntax or in another format, such as HTML or plain text.",{"type":21,"tag":22,"props":62929,"children":62930},{},[62931],{"type":26,"value":62932},"So, let's break this into a problem/solution formulation.",{"type":21,"tag":193,"props":62934,"children":62936},{"id":62935},"problem",[62937],{"type":26,"value":62938},"Problem:",{"type":21,"tag":22,"props":62940,"children":62941},{},[62942,62944,62949],{"type":26,"value":62943},"You need an [client|user]-editable document in markup-like format (or just want to completely separate content from presentation details), that nonetheless will not be markup -- maybe you don't want to burden the client/user with needing to understand the structure of an html document, maybe it needs to contain (meta-)data that html doesn't easily accommodate, maybe the data contained therein needs to be transformed in various ways, or it needs to be transformed into multiple formats (i.e. not just HTML, but also PDF or Postscript, and you don't want to rely on tools like ",{"type":21,"tag":29,"props":62945,"children":62947},{"href":62946},"code.google.com/p/wkhtmltopdf/",[62948],{"type":26,"value":12821},{"type":26,"value":62950},".)",{"type":21,"tag":193,"props":62952,"children":62954},{"id":62953},"solution",[62955],{"type":26,"value":62956},"Solution:",{"type":21,"tag":22,"props":62958,"children":62959},{},[62960],{"type":26,"value":62961},"XML+XSLT. If it seems like you'd need a a fairly specific set of circumstances to ever need to delve into this tech, you'd be right -- XSLT isn't particularly common for just that reason. When the circumstances do crop up, however, it can prove the best tool for the job. There are some pitfalls to watch out for, though - especially if you're hoping to use the support baked into many modern browsers.",{"type":21,"tag":193,"props":62963,"children":62965},{"id":62964},"examples",[62966],{"type":26,"value":62967},"Examples",{"type":21,"tag":22,"props":62969,"children":62970},{},[62971],{"type":26,"value":62972},"Some easily available references (listed below) can offer you a full picture of what XSLT (or at least, XSLT 1.0, which is the form baked into most modern browsers) looks like. Rather than reproduce that detail, let's take a look at what an XSL document might look like.",{"type":21,"tag":22,"props":62974,"children":62975},{},[62976,62978,62984],{"type":26,"value":62977},"The general structure of a well-formed XSLT document will be modular - you want to take advantage of ",{"type":21,"tag":63,"props":62979,"children":62981},{"className":62980},[],[62982],{"type":26,"value":62983},"xsl:template",{"type":26,"value":62985},"s to seperate concerns, keeping your code well-organized and potentially reusable. Often times you'll nest template calls within templates with increasing specificity, or to target other parts of the xml document you want to include within the structure of your new document at a certain place.",{"type":21,"tag":22,"props":62987,"children":62988},{},[62989,62991,62997],{"type":26,"value":62990},"For instance, let's consider this snippet, which describes a side-nav element for an html transformation for some xml (in the ",{"type":21,"tag":29,"props":62992,"children":62994},{"href":62993},"www.docbook.org/",[62995],{"type":26,"value":62996},"Docbook",{"type":26,"value":62998}," format):",{"type":21,"tag":200,"props":63000,"children":63002},{"className":7947,"code":63001,"language":7949,"meta":8,"style":8},"\u003Cdiv class=\"sidebar affix\">\n    \u003Cdiv id=\"tabContent\" class=\"tab-content\">\n        \u003Cdiv id=\"tocTab\" class=\"tab-pane active\">\n            \u003Cul class=\"nav nav-list\">\n                \u003Cxsl:apply-templates select=\"//book\">\n                \u003C/xsl:apply-templates>\n            \u003C/ul>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n",[63003],{"type":21,"tag":63,"props":63004,"children":63005},{"__ignoreMap":8},[63006,63034,63075,63116,63144,63175,63191,63207,63222,63237],{"type":21,"tag":209,"props":63007,"children":63008},{"class":211,"line":212},[63009,63013,63017,63021,63025,63030],{"type":21,"tag":209,"props":63010,"children":63011},{"style":222},[63012],{"type":26,"value":1985},{"type":21,"tag":209,"props":63014,"children":63015},{"style":1988},[63016],{"type":26,"value":2009},{"type":21,"tag":209,"props":63018,"children":63019},{"style":360},[63020],{"type":26,"value":33949},{"type":21,"tag":209,"props":63022,"children":63023},{"style":222},[63024],{"type":26,"value":1432},{"type":21,"tag":209,"props":63026,"children":63027},{"style":233},[63028],{"type":26,"value":63029},"\"sidebar affix\"",{"type":21,"tag":209,"props":63031,"children":63032},{"style":222},[63033],{"type":26,"value":1996},{"type":21,"tag":209,"props":63035,"children":63036},{"class":211,"line":244},[63037,63041,63045,63049,63053,63058,63062,63066,63071],{"type":21,"tag":209,"props":63038,"children":63039},{"style":222},[63040],{"type":26,"value":2004},{"type":21,"tag":209,"props":63042,"children":63043},{"style":1988},[63044],{"type":26,"value":2009},{"type":21,"tag":209,"props":63046,"children":63047},{"style":360},[63048],{"type":26,"value":24498},{"type":21,"tag":209,"props":63050,"children":63051},{"style":222},[63052],{"type":26,"value":1432},{"type":21,"tag":209,"props":63054,"children":63055},{"style":233},[63056],{"type":26,"value":63057},"\"tabContent\"",{"type":21,"tag":209,"props":63059,"children":63060},{"style":360},[63061],{"type":26,"value":33949},{"type":21,"tag":209,"props":63063,"children":63064},{"style":222},[63065],{"type":26,"value":1432},{"type":21,"tag":209,"props":63067,"children":63068},{"style":233},[63069],{"type":26,"value":63070},"\"tab-content\"",{"type":21,"tag":209,"props":63072,"children":63073},{"style":222},[63074],{"type":26,"value":1996},{"type":21,"tag":209,"props":63076,"children":63077},{"class":211,"line":254},[63078,63082,63086,63090,63094,63099,63103,63107,63112],{"type":21,"tag":209,"props":63079,"children":63080},{"style":222},[63081],{"type":26,"value":24472},{"type":21,"tag":209,"props":63083,"children":63084},{"style":1988},[63085],{"type":26,"value":2009},{"type":21,"tag":209,"props":63087,"children":63088},{"style":360},[63089],{"type":26,"value":24498},{"type":21,"tag":209,"props":63091,"children":63092},{"style":222},[63093],{"type":26,"value":1432},{"type":21,"tag":209,"props":63095,"children":63096},{"style":233},[63097],{"type":26,"value":63098},"\"tocTab\"",{"type":21,"tag":209,"props":63100,"children":63101},{"style":360},[63102],{"type":26,"value":33949},{"type":21,"tag":209,"props":63104,"children":63105},{"style":222},[63106],{"type":26,"value":1432},{"type":21,"tag":209,"props":63108,"children":63109},{"style":233},[63110],{"type":26,"value":63111},"\"tab-pane active\"",{"type":21,"tag":209,"props":63113,"children":63114},{"style":222},[63115],{"type":26,"value":1996},{"type":21,"tag":209,"props":63117,"children":63118},{"class":211,"line":279},[63119,63123,63127,63131,63135,63140],{"type":21,"tag":209,"props":63120,"children":63121},{"style":222},[63122],{"type":26,"value":24489},{"type":21,"tag":209,"props":63124,"children":63125},{"style":1988},[63126],{"type":26,"value":3677},{"type":21,"tag":209,"props":63128,"children":63129},{"style":360},[63130],{"type":26,"value":33949},{"type":21,"tag":209,"props":63132,"children":63133},{"style":222},[63134],{"type":26,"value":1432},{"type":21,"tag":209,"props":63136,"children":63137},{"style":233},[63138],{"type":26,"value":63139},"\"nav nav-list\"",{"type":21,"tag":209,"props":63141,"children":63142},{"style":222},[63143],{"type":26,"value":1996},{"type":21,"tag":209,"props":63145,"children":63146},{"class":211,"line":288},[63147,63152,63157,63162,63166,63171],{"type":21,"tag":209,"props":63148,"children":63149},{"style":222},[63150],{"type":26,"value":63151},"                \u003C",{"type":21,"tag":209,"props":63153,"children":63154},{"style":20979},[63155],{"type":26,"value":63156},"xsl:apply-templates",{"type":21,"tag":209,"props":63158,"children":63159},{"style":360},[63160],{"type":26,"value":63161}," select",{"type":21,"tag":209,"props":63163,"children":63164},{"style":222},[63165],{"type":26,"value":1432},{"type":21,"tag":209,"props":63167,"children":63168},{"style":233},[63169],{"type":26,"value":63170},"\"//book\"",{"type":21,"tag":209,"props":63172,"children":63173},{"style":222},[63174],{"type":26,"value":1996},{"type":21,"tag":209,"props":63176,"children":63177},{"class":211,"line":307},[63178,63183,63187],{"type":21,"tag":209,"props":63179,"children":63180},{"style":222},[63181],{"type":26,"value":63182},"                \u003C/",{"type":21,"tag":209,"props":63184,"children":63185},{"style":20979},[63186],{"type":26,"value":63156},{"type":21,"tag":209,"props":63188,"children":63189},{"style":222},[63190],{"type":26,"value":1996},{"type":21,"tag":209,"props":63192,"children":63193},{"class":211,"line":325},[63194,63199,63203],{"type":21,"tag":209,"props":63195,"children":63196},{"style":222},[63197],{"type":26,"value":63198},"            \u003C/",{"type":21,"tag":209,"props":63200,"children":63201},{"style":1988},[63202],{"type":26,"value":3677},{"type":21,"tag":209,"props":63204,"children":63205},{"style":222},[63206],{"type":26,"value":1996},{"type":21,"tag":209,"props":63208,"children":63209},{"class":211,"line":334},[63210,63214,63218],{"type":21,"tag":209,"props":63211,"children":63212},{"style":222},[63213],{"type":26,"value":24574},{"type":21,"tag":209,"props":63215,"children":63216},{"style":1988},[63217],{"type":26,"value":2009},{"type":21,"tag":209,"props":63219,"children":63220},{"style":222},[63221],{"type":26,"value":1996},{"type":21,"tag":209,"props":63223,"children":63224},{"class":211,"line":343},[63225,63229,63233],{"type":21,"tag":209,"props":63226,"children":63227},{"style":222},[63228],{"type":26,"value":24597},{"type":21,"tag":209,"props":63230,"children":63231},{"style":1988},[63232],{"type":26,"value":2009},{"type":21,"tag":209,"props":63234,"children":63235},{"style":222},[63236],{"type":26,"value":1996},{"type":21,"tag":209,"props":63238,"children":63239},{"class":211,"line":351},[63240,63244,63248],{"type":21,"tag":209,"props":63241,"children":63242},{"style":222},[63243],{"type":26,"value":2024},{"type":21,"tag":209,"props":63245,"children":63246},{"style":1988},[63247],{"type":26,"value":2009},{"type":21,"tag":209,"props":63249,"children":63250},{"style":222},[63251],{"type":26,"value":1996},{"type":21,"tag":22,"props":63253,"children":63254},{},[63255,63257,63263],{"type":26,"value":63256},"Unseen at the top is a tag which matches us to the root of the xml document. In the snippet above, for each ",{"type":21,"tag":63,"props":63258,"children":63260},{"className":63259},[],[63261],{"type":26,"value":63262},"book",{"type":26,"value":63264}," node we encounter, we're applying the relevant template:",{"type":21,"tag":200,"props":63266,"children":63269},{"className":63267,"code":63268,"language":62831,"meta":8,"style":8},"language-xml shiki shiki-themes github-light github-dark","\u003C!--Template for book select on side nav -->\n\u003Cxsl:template match=\"book\">\n    \u003Ca href=\"#{@xml:id}\">\n        \u003Cli class=\"branch\">\n            \u003Ci class=\"more icon-chevron-right\">\u003C/i> \u003Cxsl:value-of select=\"info/title\" />\n        \u003C/li>\n    \u003C/a>\n    \u003Cdiv class=\"chapterSection\" style=\"display:none;\">\n        \u003Cul class=\"nav nav-list\">\n            \u003Cxsl:apply-templates select=\"chapter\">\n            \u003C/xsl:apply-templates>\n        \u003C/ul>\n    \u003C/div>\n\u003C/xsl:template>\n",[63270],{"type":21,"tag":63,"props":63271,"children":63272},{"__ignoreMap":8},[63273,63281,63310,63338,63366,63425,63440,63455,63497,63524,63552,63567,63582,63597],{"type":21,"tag":209,"props":63274,"children":63275},{"class":211,"line":212},[63276],{"type":21,"tag":209,"props":63277,"children":63278},{"style":448},[63279],{"type":26,"value":63280},"\u003C!--Template for book select on side nav -->\n",{"type":21,"tag":209,"props":63282,"children":63283},{"class":211,"line":244},[63284,63288,63292,63297,63301,63306],{"type":21,"tag":209,"props":63285,"children":63286},{"style":222},[63287],{"type":26,"value":1985},{"type":21,"tag":209,"props":63289,"children":63290},{"style":1988},[63291],{"type":26,"value":62983},{"type":21,"tag":209,"props":63293,"children":63294},{"style":360},[63295],{"type":26,"value":63296}," match",{"type":21,"tag":209,"props":63298,"children":63299},{"style":222},[63300],{"type":26,"value":1432},{"type":21,"tag":209,"props":63302,"children":63303},{"style":233},[63304],{"type":26,"value":63305},"\"book\"",{"type":21,"tag":209,"props":63307,"children":63308},{"style":222},[63309],{"type":26,"value":1996},{"type":21,"tag":209,"props":63311,"children":63312},{"class":211,"line":254},[63313,63317,63321,63325,63329,63334],{"type":21,"tag":209,"props":63314,"children":63315},{"style":222},[63316],{"type":26,"value":2004},{"type":21,"tag":209,"props":63318,"children":63319},{"style":1988},[63320],{"type":26,"value":29},{"type":21,"tag":209,"props":63322,"children":63323},{"style":360},[63324],{"type":26,"value":7992},{"type":21,"tag":209,"props":63326,"children":63327},{"style":222},[63328],{"type":26,"value":1432},{"type":21,"tag":209,"props":63330,"children":63331},{"style":233},[63332],{"type":26,"value":63333},"\"#{@xml:id}\"",{"type":21,"tag":209,"props":63335,"children":63336},{"style":222},[63337],{"type":26,"value":1996},{"type":21,"tag":209,"props":63339,"children":63340},{"class":211,"line":279},[63341,63345,63349,63353,63357,63362],{"type":21,"tag":209,"props":63342,"children":63343},{"style":222},[63344],{"type":26,"value":24472},{"type":21,"tag":209,"props":63346,"children":63347},{"style":1988},[63348],{"type":26,"value":3681},{"type":21,"tag":209,"props":63350,"children":63351},{"style":360},[63352],{"type":26,"value":33949},{"type":21,"tag":209,"props":63354,"children":63355},{"style":222},[63356],{"type":26,"value":1432},{"type":21,"tag":209,"props":63358,"children":63359},{"style":233},[63360],{"type":26,"value":63361},"\"branch\"",{"type":21,"tag":209,"props":63363,"children":63364},{"style":222},[63365],{"type":26,"value":1996},{"type":21,"tag":209,"props":63367,"children":63368},{"class":211,"line":288},[63369,63373,63377,63381,63385,63390,63394,63398,63403,63408,63412,63416,63421],{"type":21,"tag":209,"props":63370,"children":63371},{"style":222},[63372],{"type":26,"value":24489},{"type":21,"tag":209,"props":63374,"children":63375},{"style":1988},[63376],{"type":26,"value":58977},{"type":21,"tag":209,"props":63378,"children":63379},{"style":360},[63380],{"type":26,"value":33949},{"type":21,"tag":209,"props":63382,"children":63383},{"style":222},[63384],{"type":26,"value":1432},{"type":21,"tag":209,"props":63386,"children":63387},{"style":233},[63388],{"type":26,"value":63389},"\"more icon-chevron-right\"",{"type":21,"tag":209,"props":63391,"children":63392},{"style":222},[63393],{"type":26,"value":24512},{"type":21,"tag":209,"props":63395,"children":63396},{"style":1988},[63397],{"type":26,"value":58977},{"type":21,"tag":209,"props":63399,"children":63400},{"style":222},[63401],{"type":26,"value":63402},"> \u003C",{"type":21,"tag":209,"props":63404,"children":63405},{"style":1988},[63406],{"type":26,"value":63407},"xsl:value-of",{"type":21,"tag":209,"props":63409,"children":63410},{"style":360},[63411],{"type":26,"value":63161},{"type":21,"tag":209,"props":63413,"children":63414},{"style":222},[63415],{"type":26,"value":1432},{"type":21,"tag":209,"props":63417,"children":63418},{"style":233},[63419],{"type":26,"value":63420},"\"info/title\"",{"type":21,"tag":209,"props":63422,"children":63423},{"style":222},[63424],{"type":26,"value":8127},{"type":21,"tag":209,"props":63426,"children":63427},{"class":211,"line":307},[63428,63432,63436],{"type":21,"tag":209,"props":63429,"children":63430},{"style":222},[63431],{"type":26,"value":24574},{"type":21,"tag":209,"props":63433,"children":63434},{"style":1988},[63435],{"type":26,"value":3681},{"type":21,"tag":209,"props":63437,"children":63438},{"style":222},[63439],{"type":26,"value":1996},{"type":21,"tag":209,"props":63441,"children":63442},{"class":211,"line":325},[63443,63447,63451],{"type":21,"tag":209,"props":63444,"children":63445},{"style":222},[63446],{"type":26,"value":24597},{"type":21,"tag":209,"props":63448,"children":63449},{"style":1988},[63450],{"type":26,"value":29},{"type":21,"tag":209,"props":63452,"children":63453},{"style":222},[63454],{"type":26,"value":1996},{"type":21,"tag":209,"props":63456,"children":63457},{"class":211,"line":334},[63458,63462,63466,63470,63474,63479,63484,63488,63493],{"type":21,"tag":209,"props":63459,"children":63460},{"style":222},[63461],{"type":26,"value":2004},{"type":21,"tag":209,"props":63463,"children":63464},{"style":1988},[63465],{"type":26,"value":2009},{"type":21,"tag":209,"props":63467,"children":63468},{"style":360},[63469],{"type":26,"value":33949},{"type":21,"tag":209,"props":63471,"children":63472},{"style":222},[63473],{"type":26,"value":1432},{"type":21,"tag":209,"props":63475,"children":63476},{"style":233},[63477],{"type":26,"value":63478},"\"chapterSection\"",{"type":21,"tag":209,"props":63480,"children":63481},{"style":360},[63482],{"type":26,"value":63483}," style",{"type":21,"tag":209,"props":63485,"children":63486},{"style":222},[63487],{"type":26,"value":1432},{"type":21,"tag":209,"props":63489,"children":63490},{"style":233},[63491],{"type":26,"value":63492},"\"display:none;\"",{"type":21,"tag":209,"props":63494,"children":63495},{"style":222},[63496],{"type":26,"value":1996},{"type":21,"tag":209,"props":63498,"children":63499},{"class":211,"line":343},[63500,63504,63508,63512,63516,63520],{"type":21,"tag":209,"props":63501,"children":63502},{"style":222},[63503],{"type":26,"value":24472},{"type":21,"tag":209,"props":63505,"children":63506},{"style":1988},[63507],{"type":26,"value":3677},{"type":21,"tag":209,"props":63509,"children":63510},{"style":360},[63511],{"type":26,"value":33949},{"type":21,"tag":209,"props":63513,"children":63514},{"style":222},[63515],{"type":26,"value":1432},{"type":21,"tag":209,"props":63517,"children":63518},{"style":233},[63519],{"type":26,"value":63139},{"type":21,"tag":209,"props":63521,"children":63522},{"style":222},[63523],{"type":26,"value":1996},{"type":21,"tag":209,"props":63525,"children":63526},{"class":211,"line":351},[63527,63531,63535,63539,63543,63548],{"type":21,"tag":209,"props":63528,"children":63529},{"style":222},[63530],{"type":26,"value":24489},{"type":21,"tag":209,"props":63532,"children":63533},{"style":1988},[63534],{"type":26,"value":63156},{"type":21,"tag":209,"props":63536,"children":63537},{"style":360},[63538],{"type":26,"value":63161},{"type":21,"tag":209,"props":63540,"children":63541},{"style":222},[63542],{"type":26,"value":1432},{"type":21,"tag":209,"props":63544,"children":63545},{"style":233},[63546],{"type":26,"value":63547},"\"chapter\"",{"type":21,"tag":209,"props":63549,"children":63550},{"style":222},[63551],{"type":26,"value":1996},{"type":21,"tag":209,"props":63553,"children":63554},{"class":211,"line":444},[63555,63559,63563],{"type":21,"tag":209,"props":63556,"children":63557},{"style":222},[63558],{"type":26,"value":63198},{"type":21,"tag":209,"props":63560,"children":63561},{"style":1988},[63562],{"type":26,"value":63156},{"type":21,"tag":209,"props":63564,"children":63565},{"style":222},[63566],{"type":26,"value":1996},{"type":21,"tag":209,"props":63568,"children":63569},{"class":211,"line":454},[63570,63574,63578],{"type":21,"tag":209,"props":63571,"children":63572},{"style":222},[63573],{"type":26,"value":24574},{"type":21,"tag":209,"props":63575,"children":63576},{"style":1988},[63577],{"type":26,"value":3677},{"type":21,"tag":209,"props":63579,"children":63580},{"style":222},[63581],{"type":26,"value":1996},{"type":21,"tag":209,"props":63583,"children":63584},{"class":211,"line":463},[63585,63589,63593],{"type":21,"tag":209,"props":63586,"children":63587},{"style":222},[63588],{"type":26,"value":24597},{"type":21,"tag":209,"props":63590,"children":63591},{"style":1988},[63592],{"type":26,"value":2009},{"type":21,"tag":209,"props":63594,"children":63595},{"style":222},[63596],{"type":26,"value":1996},{"type":21,"tag":209,"props":63598,"children":63599},{"class":211,"line":472},[63600,63604,63608],{"type":21,"tag":209,"props":63601,"children":63602},{"style":222},[63603],{"type":26,"value":2024},{"type":21,"tag":209,"props":63605,"children":63606},{"style":1988},[63607],{"type":26,"value":62983},{"type":21,"tag":209,"props":63609,"children":63610},{"style":222},[63611],{"type":26,"value":1996},{"type":21,"tag":22,"props":63613,"children":63614},{},[63615,63617,63622,63624,63630,63631,63638],{"type":26,"value":63616},"And the above snippet shows our template, with its ",{"type":21,"tag":63,"props":63618,"children":63620},{"className":63619},[],[63621],{"type":26,"value":12457},{"type":26,"value":63623}," attribute indicating what node it matches, so when we call apply on book nodes, this is the template to use. The ",{"type":21,"tag":29,"props":63625,"children":63627},{"href":63626},"mailto:code%3E@%7Bxml:id%7D%3C/code",[63628],{"type":26,"value":63629},"code>@{xml:id} is an attribute value template, enclosing an",{"type":26,"value":12776},{"type":21,"tag":29,"props":63632,"children":63635},{"href":63633,"rel":63634},"http://en.wikipedia.org/wiki/XPath",[93],[63636],{"type":26,"value":63637},"XPath",{"type":26,"value":63639}," expression - in this case, to get an attribute that will be included in the anchor href.",{"type":21,"tag":22,"props":63641,"children":63642},{},[63643,63645,63651],{"type":26,"value":63644},"You'll notice that within the ",{"type":21,"tag":63,"props":63646,"children":63648},{"className":63647},[],[63649],{"type":26,"value":63650},"ul.nav.nav-list",{"type":26,"value":63652}," we have another template call - as noted previously, this allows us to separate out the various templates for various sections and functionality, so that they can be used elsewhere, and are more readable/maintainable than hundreds (or thousands) of lines that do everything all clumped together.",{"type":21,"tag":22,"props":63654,"children":63655},{},[63656,63658,63664],{"type":26,"value":63657},"You can have more than one template for a given node name, by specifying a ",{"type":21,"tag":63,"props":63659,"children":63661},{"className":63660},[],[63662],{"type":26,"value":63663},"mode",{"type":26,"value":63665}," for the template - for instance:",{"type":21,"tag":200,"props":63667,"children":63669},{"className":63267,"code":63668,"language":62831,"meta":8,"style":8},"    \u003C!-- Template for chapter select on side nav -->\n    \u003Cxsl:template match=\"chapter\">\n        \u003Ca href=\"#{@xml:id}\">\n            \u003Cli class=\"nav-header\">\n                \u003Ci class=\"more icon-chevron-right\">\u003C/i> \u003Cxsl:value-of select=\"info/title\" />\n            \u003C/li>\n        \u003C/a>\n        \u003Cdiv class=\"sectionLinks\" style=\"display:none;\">\n            \u003Cxsl:for-each select=\"section\">\n                \u003Ca href=\"#{@xml:id}\">\n                    \u003Cli class=\"nav-subitem\">\u003Cxsl:value-of select=\"title\" />\u003C/li>\n                \u003C/a>\n            \u003C/xsl:for-each>\n        \u003C/div>\n    \u003C/xsl:template>\n\n\u003C!-- Template for chapters in content view -->\n\u003Cxsl:template match=\"chapter\" mode=\"inner\">\n    \u003Cdiv id=\"{@xml:id}\" class=\"chapter\">\n        \u003Ch1 class=\"chapterTitle\">\u003Cxsl:value-of select=\"info/title\" />\u003C/h1>\n        \u003Cxsl:for-each select=\"section\">\n            \u003Cdiv id=\"{@xml:id}\" class=\"section\">\n                \u003Ch3 class=\"sectionTitle\">\u003Cxsl:value-of select=\"title\" />\u003C/h3>\n                \u003Cxsl:apply-templates select=\"*[not(self::title)]\">\n                \u003C/xsl:apply-templates>\n            \u003C/div>\n        \u003C/xsl:for-each>\n    \u003C/div>\n\u003C/xsl:template>\n",[63670],{"type":21,"tag":63,"props":63671,"children":63672},{"__ignoreMap":8},[63673,63681,63708,63735,63763,63818,63833,63848,63888,63917,63944,64004,64019,64034,64049,64064,64071,64079,64120,64160,64216,64243,64282,64338,64366,64381,64396,64411,64426],{"type":21,"tag":209,"props":63674,"children":63675},{"class":211,"line":212},[63676],{"type":21,"tag":209,"props":63677,"children":63678},{"style":448},[63679],{"type":26,"value":63680},"    \u003C!-- Template for chapter select on side nav -->\n",{"type":21,"tag":209,"props":63682,"children":63683},{"class":211,"line":244},[63684,63688,63692,63696,63700,63704],{"type":21,"tag":209,"props":63685,"children":63686},{"style":222},[63687],{"type":26,"value":2004},{"type":21,"tag":209,"props":63689,"children":63690},{"style":1988},[63691],{"type":26,"value":62983},{"type":21,"tag":209,"props":63693,"children":63694},{"style":360},[63695],{"type":26,"value":63296},{"type":21,"tag":209,"props":63697,"children":63698},{"style":222},[63699],{"type":26,"value":1432},{"type":21,"tag":209,"props":63701,"children":63702},{"style":233},[63703],{"type":26,"value":63547},{"type":21,"tag":209,"props":63705,"children":63706},{"style":222},[63707],{"type":26,"value":1996},{"type":21,"tag":209,"props":63709,"children":63710},{"class":211,"line":254},[63711,63715,63719,63723,63727,63731],{"type":21,"tag":209,"props":63712,"children":63713},{"style":222},[63714],{"type":26,"value":24472},{"type":21,"tag":209,"props":63716,"children":63717},{"style":1988},[63718],{"type":26,"value":29},{"type":21,"tag":209,"props":63720,"children":63721},{"style":360},[63722],{"type":26,"value":7992},{"type":21,"tag":209,"props":63724,"children":63725},{"style":222},[63726],{"type":26,"value":1432},{"type":21,"tag":209,"props":63728,"children":63729},{"style":233},[63730],{"type":26,"value":63333},{"type":21,"tag":209,"props":63732,"children":63733},{"style":222},[63734],{"type":26,"value":1996},{"type":21,"tag":209,"props":63736,"children":63737},{"class":211,"line":279},[63738,63742,63746,63750,63754,63759],{"type":21,"tag":209,"props":63739,"children":63740},{"style":222},[63741],{"type":26,"value":24489},{"type":21,"tag":209,"props":63743,"children":63744},{"style":1988},[63745],{"type":26,"value":3681},{"type":21,"tag":209,"props":63747,"children":63748},{"style":360},[63749],{"type":26,"value":33949},{"type":21,"tag":209,"props":63751,"children":63752},{"style":222},[63753],{"type":26,"value":1432},{"type":21,"tag":209,"props":63755,"children":63756},{"style":233},[63757],{"type":26,"value":63758},"\"nav-header\"",{"type":21,"tag":209,"props":63760,"children":63761},{"style":222},[63762],{"type":26,"value":1996},{"type":21,"tag":209,"props":63764,"children":63765},{"class":211,"line":288},[63766,63770,63774,63778,63782,63786,63790,63794,63798,63802,63806,63810,63814],{"type":21,"tag":209,"props":63767,"children":63768},{"style":222},[63769],{"type":26,"value":63151},{"type":21,"tag":209,"props":63771,"children":63772},{"style":1988},[63773],{"type":26,"value":58977},{"type":21,"tag":209,"props":63775,"children":63776},{"style":360},[63777],{"type":26,"value":33949},{"type":21,"tag":209,"props":63779,"children":63780},{"style":222},[63781],{"type":26,"value":1432},{"type":21,"tag":209,"props":63783,"children":63784},{"style":233},[63785],{"type":26,"value":63389},{"type":21,"tag":209,"props":63787,"children":63788},{"style":222},[63789],{"type":26,"value":24512},{"type":21,"tag":209,"props":63791,"children":63792},{"style":1988},[63793],{"type":26,"value":58977},{"type":21,"tag":209,"props":63795,"children":63796},{"style":222},[63797],{"type":26,"value":63402},{"type":21,"tag":209,"props":63799,"children":63800},{"style":1988},[63801],{"type":26,"value":63407},{"type":21,"tag":209,"props":63803,"children":63804},{"style":360},[63805],{"type":26,"value":63161},{"type":21,"tag":209,"props":63807,"children":63808},{"style":222},[63809],{"type":26,"value":1432},{"type":21,"tag":209,"props":63811,"children":63812},{"style":233},[63813],{"type":26,"value":63420},{"type":21,"tag":209,"props":63815,"children":63816},{"style":222},[63817],{"type":26,"value":8127},{"type":21,"tag":209,"props":63819,"children":63820},{"class":211,"line":307},[63821,63825,63829],{"type":21,"tag":209,"props":63822,"children":63823},{"style":222},[63824],{"type":26,"value":63198},{"type":21,"tag":209,"props":63826,"children":63827},{"style":1988},[63828],{"type":26,"value":3681},{"type":21,"tag":209,"props":63830,"children":63831},{"style":222},[63832],{"type":26,"value":1996},{"type":21,"tag":209,"props":63834,"children":63835},{"class":211,"line":325},[63836,63840,63844],{"type":21,"tag":209,"props":63837,"children":63838},{"style":222},[63839],{"type":26,"value":24574},{"type":21,"tag":209,"props":63841,"children":63842},{"style":1988},[63843],{"type":26,"value":29},{"type":21,"tag":209,"props":63845,"children":63846},{"style":222},[63847],{"type":26,"value":1996},{"type":21,"tag":209,"props":63849,"children":63850},{"class":211,"line":334},[63851,63855,63859,63863,63867,63872,63876,63880,63884],{"type":21,"tag":209,"props":63852,"children":63853},{"style":222},[63854],{"type":26,"value":24472},{"type":21,"tag":209,"props":63856,"children":63857},{"style":1988},[63858],{"type":26,"value":2009},{"type":21,"tag":209,"props":63860,"children":63861},{"style":360},[63862],{"type":26,"value":33949},{"type":21,"tag":209,"props":63864,"children":63865},{"style":222},[63866],{"type":26,"value":1432},{"type":21,"tag":209,"props":63868,"children":63869},{"style":233},[63870],{"type":26,"value":63871},"\"sectionLinks\"",{"type":21,"tag":209,"props":63873,"children":63874},{"style":360},[63875],{"type":26,"value":63483},{"type":21,"tag":209,"props":63877,"children":63878},{"style":222},[63879],{"type":26,"value":1432},{"type":21,"tag":209,"props":63881,"children":63882},{"style":233},[63883],{"type":26,"value":63492},{"type":21,"tag":209,"props":63885,"children":63886},{"style":222},[63887],{"type":26,"value":1996},{"type":21,"tag":209,"props":63889,"children":63890},{"class":211,"line":343},[63891,63895,63900,63904,63908,63913],{"type":21,"tag":209,"props":63892,"children":63893},{"style":222},[63894],{"type":26,"value":24489},{"type":21,"tag":209,"props":63896,"children":63897},{"style":1988},[63898],{"type":26,"value":63899},"xsl:for-each",{"type":21,"tag":209,"props":63901,"children":63902},{"style":360},[63903],{"type":26,"value":63161},{"type":21,"tag":209,"props":63905,"children":63906},{"style":222},[63907],{"type":26,"value":1432},{"type":21,"tag":209,"props":63909,"children":63910},{"style":233},[63911],{"type":26,"value":63912},"\"section\"",{"type":21,"tag":209,"props":63914,"children":63915},{"style":222},[63916],{"type":26,"value":1996},{"type":21,"tag":209,"props":63918,"children":63919},{"class":211,"line":351},[63920,63924,63928,63932,63936,63940],{"type":21,"tag":209,"props":63921,"children":63922},{"style":222},[63923],{"type":26,"value":63151},{"type":21,"tag":209,"props":63925,"children":63926},{"style":1988},[63927],{"type":26,"value":29},{"type":21,"tag":209,"props":63929,"children":63930},{"style":360},[63931],{"type":26,"value":7992},{"type":21,"tag":209,"props":63933,"children":63934},{"style":222},[63935],{"type":26,"value":1432},{"type":21,"tag":209,"props":63937,"children":63938},{"style":233},[63939],{"type":26,"value":63333},{"type":21,"tag":209,"props":63941,"children":63942},{"style":222},[63943],{"type":26,"value":1996},{"type":21,"tag":209,"props":63945,"children":63946},{"class":211,"line":444},[63947,63952,63956,63960,63964,63969,63974,63978,63982,63986,63991,63996,64000],{"type":21,"tag":209,"props":63948,"children":63949},{"style":222},[63950],{"type":26,"value":63951},"                    \u003C",{"type":21,"tag":209,"props":63953,"children":63954},{"style":1988},[63955],{"type":26,"value":3681},{"type":21,"tag":209,"props":63957,"children":63958},{"style":360},[63959],{"type":26,"value":33949},{"type":21,"tag":209,"props":63961,"children":63962},{"style":222},[63963],{"type":26,"value":1432},{"type":21,"tag":209,"props":63965,"children":63966},{"style":233},[63967],{"type":26,"value":63968},"\"nav-subitem\"",{"type":21,"tag":209,"props":63970,"children":63971},{"style":222},[63972],{"type":26,"value":63973},">\u003C",{"type":21,"tag":209,"props":63975,"children":63976},{"style":1988},[63977],{"type":26,"value":63407},{"type":21,"tag":209,"props":63979,"children":63980},{"style":360},[63981],{"type":26,"value":63161},{"type":21,"tag":209,"props":63983,"children":63984},{"style":222},[63985],{"type":26,"value":1432},{"type":21,"tag":209,"props":63987,"children":63988},{"style":233},[63989],{"type":26,"value":63990},"\"title\"",{"type":21,"tag":209,"props":63992,"children":63993},{"style":222},[63994],{"type":26,"value":63995}," />\u003C/",{"type":21,"tag":209,"props":63997,"children":63998},{"style":1988},[63999],{"type":26,"value":3681},{"type":21,"tag":209,"props":64001,"children":64002},{"style":222},[64003],{"type":26,"value":1996},{"type":21,"tag":209,"props":64005,"children":64006},{"class":211,"line":454},[64007,64011,64015],{"type":21,"tag":209,"props":64008,"children":64009},{"style":222},[64010],{"type":26,"value":63182},{"type":21,"tag":209,"props":64012,"children":64013},{"style":1988},[64014],{"type":26,"value":29},{"type":21,"tag":209,"props":64016,"children":64017},{"style":222},[64018],{"type":26,"value":1996},{"type":21,"tag":209,"props":64020,"children":64021},{"class":211,"line":463},[64022,64026,64030],{"type":21,"tag":209,"props":64023,"children":64024},{"style":222},[64025],{"type":26,"value":63198},{"type":21,"tag":209,"props":64027,"children":64028},{"style":1988},[64029],{"type":26,"value":63899},{"type":21,"tag":209,"props":64031,"children":64032},{"style":222},[64033],{"type":26,"value":1996},{"type":21,"tag":209,"props":64035,"children":64036},{"class":211,"line":472},[64037,64041,64045],{"type":21,"tag":209,"props":64038,"children":64039},{"style":222},[64040],{"type":26,"value":24574},{"type":21,"tag":209,"props":64042,"children":64043},{"style":1988},[64044],{"type":26,"value":2009},{"type":21,"tag":209,"props":64046,"children":64047},{"style":222},[64048],{"type":26,"value":1996},{"type":21,"tag":209,"props":64050,"children":64051},{"class":211,"line":480},[64052,64056,64060],{"type":21,"tag":209,"props":64053,"children":64054},{"style":222},[64055],{"type":26,"value":24597},{"type":21,"tag":209,"props":64057,"children":64058},{"style":1988},[64059],{"type":26,"value":62983},{"type":21,"tag":209,"props":64061,"children":64062},{"style":222},[64063],{"type":26,"value":1996},{"type":21,"tag":209,"props":64065,"children":64066},{"class":211,"line":489},[64067],{"type":21,"tag":209,"props":64068,"children":64069},{"emptyLinePlaceholder":248},[64070],{"type":26,"value":251},{"type":21,"tag":209,"props":64072,"children":64073},{"class":211,"line":847},[64074],{"type":21,"tag":209,"props":64075,"children":64076},{"style":448},[64077],{"type":26,"value":64078},"\u003C!-- Template for chapters in content view -->\n",{"type":21,"tag":209,"props":64080,"children":64081},{"class":211,"line":860},[64082,64086,64090,64094,64098,64102,64107,64111,64116],{"type":21,"tag":209,"props":64083,"children":64084},{"style":222},[64085],{"type":26,"value":1985},{"type":21,"tag":209,"props":64087,"children":64088},{"style":1988},[64089],{"type":26,"value":62983},{"type":21,"tag":209,"props":64091,"children":64092},{"style":360},[64093],{"type":26,"value":63296},{"type":21,"tag":209,"props":64095,"children":64096},{"style":222},[64097],{"type":26,"value":1432},{"type":21,"tag":209,"props":64099,"children":64100},{"style":233},[64101],{"type":26,"value":63547},{"type":21,"tag":209,"props":64103,"children":64104},{"style":360},[64105],{"type":26,"value":64106}," mode",{"type":21,"tag":209,"props":64108,"children":64109},{"style":222},[64110],{"type":26,"value":1432},{"type":21,"tag":209,"props":64112,"children":64113},{"style":233},[64114],{"type":26,"value":64115},"\"inner\"",{"type":21,"tag":209,"props":64117,"children":64118},{"style":222},[64119],{"type":26,"value":1996},{"type":21,"tag":209,"props":64121,"children":64122},{"class":211,"line":877},[64123,64127,64131,64135,64139,64144,64148,64152,64156],{"type":21,"tag":209,"props":64124,"children":64125},{"style":222},[64126],{"type":26,"value":2004},{"type":21,"tag":209,"props":64128,"children":64129},{"style":1988},[64130],{"type":26,"value":2009},{"type":21,"tag":209,"props":64132,"children":64133},{"style":360},[64134],{"type":26,"value":24498},{"type":21,"tag":209,"props":64136,"children":64137},{"style":222},[64138],{"type":26,"value":1432},{"type":21,"tag":209,"props":64140,"children":64141},{"style":233},[64142],{"type":26,"value":64143},"\"{@xml:id}\"",{"type":21,"tag":209,"props":64145,"children":64146},{"style":360},[64147],{"type":26,"value":33949},{"type":21,"tag":209,"props":64149,"children":64150},{"style":222},[64151],{"type":26,"value":1432},{"type":21,"tag":209,"props":64153,"children":64154},{"style":233},[64155],{"type":26,"value":63547},{"type":21,"tag":209,"props":64157,"children":64158},{"style":222},[64159],{"type":26,"value":1996},{"type":21,"tag":209,"props":64161,"children":64162},{"class":211,"line":889},[64163,64167,64171,64175,64179,64184,64188,64192,64196,64200,64204,64208,64212],{"type":21,"tag":209,"props":64164,"children":64165},{"style":222},[64166],{"type":26,"value":24472},{"type":21,"tag":209,"props":64168,"children":64169},{"style":1988},[64170],{"type":26,"value":58507},{"type":21,"tag":209,"props":64172,"children":64173},{"style":360},[64174],{"type":26,"value":33949},{"type":21,"tag":209,"props":64176,"children":64177},{"style":222},[64178],{"type":26,"value":1432},{"type":21,"tag":209,"props":64180,"children":64181},{"style":233},[64182],{"type":26,"value":64183},"\"chapterTitle\"",{"type":21,"tag":209,"props":64185,"children":64186},{"style":222},[64187],{"type":26,"value":63973},{"type":21,"tag":209,"props":64189,"children":64190},{"style":1988},[64191],{"type":26,"value":63407},{"type":21,"tag":209,"props":64193,"children":64194},{"style":360},[64195],{"type":26,"value":63161},{"type":21,"tag":209,"props":64197,"children":64198},{"style":222},[64199],{"type":26,"value":1432},{"type":21,"tag":209,"props":64201,"children":64202},{"style":233},[64203],{"type":26,"value":63420},{"type":21,"tag":209,"props":64205,"children":64206},{"style":222},[64207],{"type":26,"value":63995},{"type":21,"tag":209,"props":64209,"children":64210},{"style":1988},[64211],{"type":26,"value":58507},{"type":21,"tag":209,"props":64213,"children":64214},{"style":222},[64215],{"type":26,"value":1996},{"type":21,"tag":209,"props":64217,"children":64218},{"class":211,"line":902},[64219,64223,64227,64231,64235,64239],{"type":21,"tag":209,"props":64220,"children":64221},{"style":222},[64222],{"type":26,"value":24472},{"type":21,"tag":209,"props":64224,"children":64225},{"style":1988},[64226],{"type":26,"value":63899},{"type":21,"tag":209,"props":64228,"children":64229},{"style":360},[64230],{"type":26,"value":63161},{"type":21,"tag":209,"props":64232,"children":64233},{"style":222},[64234],{"type":26,"value":1432},{"type":21,"tag":209,"props":64236,"children":64237},{"style":233},[64238],{"type":26,"value":63912},{"type":21,"tag":209,"props":64240,"children":64241},{"style":222},[64242],{"type":26,"value":1996},{"type":21,"tag":209,"props":64244,"children":64245},{"class":211,"line":914},[64246,64250,64254,64258,64262,64266,64270,64274,64278],{"type":21,"tag":209,"props":64247,"children":64248},{"style":222},[64249],{"type":26,"value":24489},{"type":21,"tag":209,"props":64251,"children":64252},{"style":1988},[64253],{"type":26,"value":2009},{"type":21,"tag":209,"props":64255,"children":64256},{"style":360},[64257],{"type":26,"value":24498},{"type":21,"tag":209,"props":64259,"children":64260},{"style":222},[64261],{"type":26,"value":1432},{"type":21,"tag":209,"props":64263,"children":64264},{"style":233},[64265],{"type":26,"value":64143},{"type":21,"tag":209,"props":64267,"children":64268},{"style":360},[64269],{"type":26,"value":33949},{"type":21,"tag":209,"props":64271,"children":64272},{"style":222},[64273],{"type":26,"value":1432},{"type":21,"tag":209,"props":64275,"children":64276},{"style":233},[64277],{"type":26,"value":63912},{"type":21,"tag":209,"props":64279,"children":64280},{"style":222},[64281],{"type":26,"value":1996},{"type":21,"tag":209,"props":64283,"children":64284},{"class":211,"line":922},[64285,64289,64293,64297,64301,64306,64310,64314,64318,64322,64326,64330,64334],{"type":21,"tag":209,"props":64286,"children":64287},{"style":222},[64288],{"type":26,"value":63151},{"type":21,"tag":209,"props":64290,"children":64291},{"style":1988},[64292],{"type":26,"value":51},{"type":21,"tag":209,"props":64294,"children":64295},{"style":360},[64296],{"type":26,"value":33949},{"type":21,"tag":209,"props":64298,"children":64299},{"style":222},[64300],{"type":26,"value":1432},{"type":21,"tag":209,"props":64302,"children":64303},{"style":233},[64304],{"type":26,"value":64305},"\"sectionTitle\"",{"type":21,"tag":209,"props":64307,"children":64308},{"style":222},[64309],{"type":26,"value":63973},{"type":21,"tag":209,"props":64311,"children":64312},{"style":1988},[64313],{"type":26,"value":63407},{"type":21,"tag":209,"props":64315,"children":64316},{"style":360},[64317],{"type":26,"value":63161},{"type":21,"tag":209,"props":64319,"children":64320},{"style":222},[64321],{"type":26,"value":1432},{"type":21,"tag":209,"props":64323,"children":64324},{"style":233},[64325],{"type":26,"value":63990},{"type":21,"tag":209,"props":64327,"children":64328},{"style":222},[64329],{"type":26,"value":63995},{"type":21,"tag":209,"props":64331,"children":64332},{"style":1988},[64333],{"type":26,"value":51},{"type":21,"tag":209,"props":64335,"children":64336},{"style":222},[64337],{"type":26,"value":1996},{"type":21,"tag":209,"props":64339,"children":64340},{"class":211,"line":2312},[64341,64345,64349,64353,64357,64362],{"type":21,"tag":209,"props":64342,"children":64343},{"style":222},[64344],{"type":26,"value":63151},{"type":21,"tag":209,"props":64346,"children":64347},{"style":1988},[64348],{"type":26,"value":63156},{"type":21,"tag":209,"props":64350,"children":64351},{"style":360},[64352],{"type":26,"value":63161},{"type":21,"tag":209,"props":64354,"children":64355},{"style":222},[64356],{"type":26,"value":1432},{"type":21,"tag":209,"props":64358,"children":64359},{"style":233},[64360],{"type":26,"value":64361},"\"*[not(self::title)]\"",{"type":21,"tag":209,"props":64363,"children":64364},{"style":222},[64365],{"type":26,"value":1996},{"type":21,"tag":209,"props":64367,"children":64368},{"class":211,"line":2321},[64369,64373,64377],{"type":21,"tag":209,"props":64370,"children":64371},{"style":222},[64372],{"type":26,"value":63182},{"type":21,"tag":209,"props":64374,"children":64375},{"style":1988},[64376],{"type":26,"value":63156},{"type":21,"tag":209,"props":64378,"children":64379},{"style":222},[64380],{"type":26,"value":1996},{"type":21,"tag":209,"props":64382,"children":64383},{"class":211,"line":2372},[64384,64388,64392],{"type":21,"tag":209,"props":64385,"children":64386},{"style":222},[64387],{"type":26,"value":63198},{"type":21,"tag":209,"props":64389,"children":64390},{"style":1988},[64391],{"type":26,"value":2009},{"type":21,"tag":209,"props":64393,"children":64394},{"style":222},[64395],{"type":26,"value":1996},{"type":21,"tag":209,"props":64397,"children":64398},{"class":211,"line":2381},[64399,64403,64407],{"type":21,"tag":209,"props":64400,"children":64401},{"style":222},[64402],{"type":26,"value":24574},{"type":21,"tag":209,"props":64404,"children":64405},{"style":1988},[64406],{"type":26,"value":63899},{"type":21,"tag":209,"props":64408,"children":64409},{"style":222},[64410],{"type":26,"value":1996},{"type":21,"tag":209,"props":64412,"children":64413},{"class":211,"line":2389},[64414,64418,64422],{"type":21,"tag":209,"props":64415,"children":64416},{"style":222},[64417],{"type":26,"value":24597},{"type":21,"tag":209,"props":64419,"children":64420},{"style":1988},[64421],{"type":26,"value":2009},{"type":21,"tag":209,"props":64423,"children":64424},{"style":222},[64425],{"type":26,"value":1996},{"type":21,"tag":209,"props":64427,"children":64428},{"class":211,"line":2397},[64429,64433,64437],{"type":21,"tag":209,"props":64430,"children":64431},{"style":222},[64432],{"type":26,"value":2024},{"type":21,"tag":209,"props":64434,"children":64435},{"style":1988},[64436],{"type":26,"value":62983},{"type":21,"tag":209,"props":64438,"children":64439},{"style":222},[64440],{"type":26,"value":1996},{"type":21,"tag":22,"props":64442,"children":64443},{},[64444],{"type":26,"value":64445},"XSL is a Turing-complete language, so for the most part, anything you might do in another language is doable in XSL - that said, it finds its best fit as a templating language, rather than general purpose use.",{"type":21,"tag":193,"props":64447,"children":64449},{"id":64448},"static-compilation",[64450],{"type":26,"value":64451},"Static Compilation",{"type":21,"tag":22,"props":64453,"children":64454},{},[64455],{"type":26,"value":64456},"So, you're convinced that XSL is going to solve your problems (whatever those may be) - you'll be able to create one data document, and then as many XSL documents as you need to present your data anywhere (HTML for the web, PDF for the execs, plain text for the the company records, ASCII art for your own amusement...) Sounds good. You're creating those statically, I assume?",{"type":21,"tag":22,"props":64458,"children":64459},{},[64460],{"type":26,"value":64461},"Because if you're going to rely on the baked-in XSLT support in browsers, you'll likely run into some problems. The references below will help you navigate some of the ones found in Trident (IE) and Gecko (Firefox) - the MDN reference is particularly good about calling out where support is lacking. Even so, you're likely to encounter issues with certain versions of the clients not performing exactly the same (for instance, Firefox 20 broke XSL support from the local file system - Firefox 20.0.1 fixed it).",{"type":21,"tag":22,"props":64463,"children":64464},{},[64465,64467,64473,64475,64481],{"type":26,"value":64466},"My suggestion is, if you're offering the XML+XSL from a web server that can perform the transform for you (such as apache with ",{"type":21,"tag":29,"props":64468,"children":64470},{"href":64469},"www.modxslt.org",[64471],{"type":26,"value":64472},"mod-xslt",{"type":26,"value":64474},") use that instead, and save yourself the QA time. Otherwise, use a processor like ",{"type":21,"tag":29,"props":64476,"children":64478},{"href":64477},"saxon.sourceforge.net",[64479],{"type":26,"value":64480},"Saxon",{"type":26,"value":64482}," to produce a static version of your output to display, and re-run when you make changes - you lose the ability to simply update the XML and have those changes instantly reflected, but gain cross-browser stability. You'll also gain access to newer versions of the XSLT and XQuery specifications than the browsers offer.",{"type":21,"tag":193,"props":64484,"children":64486},{"id":64485},"re-the-future",[64487],{"type":26,"value":64488},"re: The Future",{"type":21,"tag":22,"props":64490,"children":64491},{},[64492],{"type":26,"value":64493},"As someone who's used XSLT for a few projects and counts the learning curve as time well-spent, I'm in a different position than someone considering learning it for the first time. Given how sparsely used it is, is it even worth the time investment?",{"type":21,"tag":22,"props":64495,"children":64496},{},[64497,64499,64506],{"type":26,"value":64498},"As answer, I direct you to consider ",{"type":21,"tag":29,"props":64500,"children":64503},{"href":64501,"rel":64502},"https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/zIg2KC7PyH0",[93],[64504],{"type":26,"value":64505},"this thread",{"type":26,"value":64507}," from the chromium group, considering deprecating support for XSLT from Blink (Google's fork of webkit). The consensus by the end seems to be that, while support for it in the browser is 'nice-to-have', it's too seldomly used to justify its size in the binary, or its place in the code. At the same time, any number of individuals were citing their specific use cases (or even multi-year careers) built on XSLT -- while the open web seems little interested in XSLT, corporate intranets are another story.",{"type":21,"tag":22,"props":64509,"children":64510},{},[64511],{"type":26,"value":64512},"The answer would seem, then - if you have a specific use case at hand where XSLT would be useful, based on what you know of it - yes, go ahead and add it to your developer's toolbelt (but be sure not to count on browser support of the standard in the future!). If you're just passingly curious, pass on by - there are other, potentially more useful technologies out there, waiting for your attention.",{"type":21,"tag":22,"props":64514,"children":64515},{},[64516],{"type":26,"value":64517},"Personally, I would very much like to see an approach like XSLT for JSON make an appearance (hopefully with the same emphasis on simplicity that JSON itself enjoys) - for now, we fill that gap with javascript templates and DOM manipulation, for better or for worse.",{"type":21,"tag":193,"props":64519,"children":64521},{"id":64520},"references",[64522],{"type":26,"value":64523},"References",{"type":21,"tag":22,"props":64525,"children":64526},{},[64527],{"type":26,"value":64528},"I prefer to learn by doing - pick a project that can benefit from XSLT, and go for broke! Both the MDN and MSDN references for XSLT are quite good - I'd suggest using both as you learn, with one sometimes offering details that the other glosses over.",{"type":21,"tag":3739,"props":64530,"children":64531},{},[64532,64542],{"type":21,"tag":3681,"props":64533,"children":64534},{},[64535],{"type":21,"tag":29,"props":64536,"children":64539},{"href":64537,"rel":64538},"https://developer.mozilla.org/en/docs/XSLT",[93],[64540],{"type":26,"value":64541},"MDN XSLT Reference",{"type":21,"tag":3681,"props":64543,"children":64544},{},[64545],{"type":21,"tag":29,"props":64546,"children":64549},{"href":64547,"rel":64548},"http://msdn.microsoft.com/en-us/library/ms256069.aspx",[93],[64550],{"type":26,"value":64551},"MSDN XSLT Reference",{"type":21,"tag":22,"props":64553,"children":64554},{},[64555,64557,64564],{"type":26,"value":64556},"If you'd prefer the dead-tree approach, Michael Kay's ",{"type":21,"tag":29,"props":64558,"children":64561},{"href":64559,"rel":64560},"http://www.amazon.com/dp/0470192747/",[93],[64562],{"type":26,"value":64563},"XSLT 2 and XPath 2 Programmer's Reference",{"type":26,"value":64565}," comes well-recommended.",{"type":21,"tag":3490,"props":64567,"children":64568},{},[64569],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":64571},[64572,64573,64574,64575,64576,64577,64578],{"id":62902,"depth":279,"text":62905},{"id":62935,"depth":279,"text":62938},{"id":62953,"depth":279,"text":62956},{"id":62964,"depth":279,"text":62967},{"id":64448,"depth":279,"text":64451},{"id":64485,"depth":279,"text":64488},{"id":64520,"depth":279,"text":64523},"content:ckeefer:2013-2:xslt.md","ckeefer/2013-2/xslt.md","ckeefer/2013-2/xslt",{"user":3518,"name":3519},{"_path":64584,"_dir":64585,"_draft":7,"_partial":7,"_locale":8,"title":64586,"description":64587,"publishDate":64588,"tags":64589,"excerpt":64587,"body":64590,"_type":3511,"_id":67001,"_source":3513,"_file":67002,"_stem":67003,"_extension":3516,"author":67004},"/ckeefer/2013-1/misc","2013-1","JS Hints & Shortcuts","During the course of any complex project (and even many simple ones), on the way to accomplish the actual goal, you're certain to encounter any number of small hurdles along the way - little problems which need to be resolved for the bigger picture to come into focus.","2013-09-01",[12],{"type":18,"children":64591,"toc":66991},[64592,64604,64609,64613,64619,64642,64647,64775,64781,64794,64807,64893,64898,64943,64956,64969,65141,65154,65274,65279,65390,65403,65620,65626,65631,65636,65700,65705,65774,65788,65794,65812,65825,66975,66987],{"type":21,"tag":22,"props":64593,"children":64594},{},[64595,64597,64602],{"type":26,"value":64596},"During the course of any complex project (and even many simple ones), on the way to accomplish the ",{"type":21,"tag":1084,"props":64598,"children":64599},{},[64600],{"type":26,"value":64601},"actual",{"type":26,"value":64603}," goal, you're certain to encounter any number of small hurdles along the way - little problems which need to be resolved for the bigger picture to come into focus.",{"type":21,"tag":22,"props":64605,"children":64606},{},[64607],{"type":26,"value":64608},"Below, in no particular order, are some of the 'little' problems I've encountered, and solutions thereto - hopefully giving you a leg up so that when and if you encounter something similar, you can jump it without breaking stride.",{"type":21,"tag":64610,"props":64611,"children":64612},"toc",{},[],{"type":21,"tag":3549,"props":64614,"children":64616},{"id":64615},"is-that-a-promise",[64617],{"type":26,"value":64618},"Is that a Promise?",{"type":21,"tag":22,"props":64620,"children":64621},{},[64622,64624,64631,64633,64640],{"type":26,"value":64623},"To determine whether a Javascript object implements the ",{"type":21,"tag":29,"props":64625,"children":64628},{"href":64626,"rel":64627},"http://wiki.commonjs.org/wiki/Promises/A",[93],[64629],{"type":26,"value":64630},"promise interface",{"type":26,"value":64632},", we'll have to rely on ",{"type":21,"tag":29,"props":64634,"children":64637},{"href":64635,"rel":64636},"http://en.wikipedia.org/wiki/Duck_typing",[93],[64638],{"type":26,"value":64639},"duck typing",{"type":26,"value":64641},". This is generally safe (outside of a potentially hostile environment), and if you're suspicious that tested objects might return false positives, you can add/change what is tested tailored to the specific implementation you're using.",{"type":21,"tag":22,"props":64643,"children":64644},{},[64645],{"type":26,"value":64646},"For instance, you might add a test on functions like 'promise' and 'pipe' being present for jQuery Deferred. This could also be stretched to try and tell one implementation apart from another, if you're mixing them for whatever reason.",{"type":21,"tag":200,"props":64648,"children":64650},{"className":9044,"code":64649,"language":9046,"meta":8,"style":8},"    /**\n     * Determine whether object implements promises.\n     * @param object\n     * @returns {*}\n     */\n    isPromise:function(object){\n        return (typeof object.then === 'function');\n    }\n",[64651],{"type":21,"tag":63,"props":64652,"children":64653},{"__ignoreMap":8},[64654,64661,64669,64685,64700,64707,64736,64768],{"type":21,"tag":209,"props":64655,"children":64656},{"class":211,"line":212},[64657],{"type":21,"tag":209,"props":64658,"children":64659},{"style":448},[64660],{"type":26,"value":4697},{"type":21,"tag":209,"props":64662,"children":64663},{"class":211,"line":244},[64664],{"type":21,"tag":209,"props":64665,"children":64666},{"style":448},[64667],{"type":26,"value":64668},"     * Determine whether object implements promises.\n",{"type":21,"tag":209,"props":64670,"children":64671},{"class":211,"line":254},[64672,64676,64680],{"type":21,"tag":209,"props":64673,"children":64674},{"style":448},[64675],{"type":26,"value":4713},{"type":21,"tag":209,"props":64677,"children":64678},{"style":216},[64679],{"type":26,"value":4718},{"type":21,"tag":209,"props":64681,"children":64682},{"style":222},[64683],{"type":26,"value":64684}," object\n",{"type":21,"tag":209,"props":64686,"children":64687},{"class":211,"line":279},[64688,64692,64696],{"type":21,"tag":209,"props":64689,"children":64690},{"style":448},[64691],{"type":26,"value":4713},{"type":21,"tag":209,"props":64693,"children":64694},{"style":216},[64695],{"type":26,"value":4740},{"type":21,"tag":209,"props":64697,"children":64698},{"style":360},[64699],{"type":26,"value":27113},{"type":21,"tag":209,"props":64701,"children":64702},{"class":211,"line":288},[64703],{"type":21,"tag":209,"props":64704,"children":64705},{"style":448},[64706],{"type":26,"value":4753},{"type":21,"tag":209,"props":64708,"children":64709},{"class":211,"line":307},[64710,64715,64719,64723,64727,64732],{"type":21,"tag":209,"props":64711,"children":64712},{"style":360},[64713],{"type":26,"value":64714},"    isPromise",{"type":21,"tag":209,"props":64716,"children":64717},{"style":222},[64718],{"type":26,"value":191},{"type":21,"tag":209,"props":64720,"children":64721},{"style":216},[64722],{"type":26,"value":5370},{"type":21,"tag":209,"props":64724,"children":64725},{"style":222},[64726],{"type":26,"value":368},{"type":21,"tag":209,"props":64728,"children":64729},{"style":400},[64730],{"type":26,"value":64731},"object",{"type":21,"tag":209,"props":64733,"children":64734},{"style":222},[64735],{"type":26,"value":2369},{"type":21,"tag":209,"props":64737,"children":64738},{"class":211,"line":325},[64739,64743,64747,64751,64756,64760,64764],{"type":21,"tag":209,"props":64740,"children":64741},{"style":216},[64742],{"type":26,"value":3069},{"type":21,"tag":209,"props":64744,"children":64745},{"style":222},[64746],{"type":26,"value":4776},{"type":21,"tag":209,"props":64748,"children":64749},{"style":216},[64750],{"type":26,"value":6092},{"type":21,"tag":209,"props":64752,"children":64753},{"style":222},[64754],{"type":26,"value":64755}," object.then ",{"type":21,"tag":209,"props":64757,"children":64758},{"style":216},[64759],{"type":26,"value":6102},{"type":21,"tag":209,"props":64761,"children":64762},{"style":233},[64763],{"type":26,"value":6107},{"type":21,"tag":209,"props":64765,"children":64766},{"style":222},[64767],{"type":26,"value":2608},{"type":21,"tag":209,"props":64769,"children":64770},{"class":211,"line":334},[64771],{"type":21,"tag":209,"props":64772,"children":64773},{"style":222},[64774],{"type":26,"value":331},{"type":21,"tag":3549,"props":64776,"children":64778},{"id":64777},"ie-console-woes-log-only-in-debug-mode",[64779],{"type":26,"value":64780},"IE Console woes, log only in debug mode",{"type":21,"tag":22,"props":64782,"children":64783},{},[64784,64786,64792],{"type":26,"value":64785},"It's extremely common to litter your js with some ",{"type":21,"tag":63,"props":64787,"children":64789},{"className":64788},[],[64790],{"type":26,"value":64791},"console.log",{"type":26,"value":64793}," calls while developing, in order to get a better handle on inputs, outpus, variable states, etc. Some of these calls are obviated by the incresingly powerful built-in browser tools, but inevitably your code will pick up a few.",{"type":21,"tag":22,"props":64795,"children":64796},{},[64797,64799,64805],{"type":26,"value":64798},"Suddenly, you realize that you need to port that code to an IE version \u003C= 8. The code breaks. You open up devtools. The code works. What's going on? The ",{"type":21,"tag":63,"props":64800,"children":64802},{"className":64801},[],[64803],{"type":26,"value":64804},"console",{"type":26,"value":64806}," object doesn't exist until you open up devtools - its tricky the first time you stumble into it. Here's the quick fix:",{"type":21,"tag":200,"props":64808,"children":64810},{"className":9044,"code":64809,"language":9046,"meta":8,"style":8},"window.console = window.console || {\n    /** @param {...*} args */\n    log:function(){};\n};\n",[64811],{"type":21,"tag":63,"props":64812,"children":64813},{"__ignoreMap":8},[64814,64839,64865,64886],{"type":21,"tag":209,"props":64815,"children":64816},{"class":211,"line":212},[64817,64822,64826,64831,64835],{"type":21,"tag":209,"props":64818,"children":64819},{"style":222},[64820],{"type":26,"value":64821},"window.console ",{"type":21,"tag":209,"props":64823,"children":64824},{"style":216},[64825],{"type":26,"value":1432},{"type":21,"tag":209,"props":64827,"children":64828},{"style":222},[64829],{"type":26,"value":64830}," window.console ",{"type":21,"tag":209,"props":64832,"children":64833},{"style":216},[64834],{"type":26,"value":4677},{"type":21,"tag":209,"props":64836,"children":64837},{"style":222},[64838],{"type":26,"value":276},{"type":21,"tag":209,"props":64840,"children":64841},{"class":211,"line":244},[64842,64847,64851,64856,64861],{"type":21,"tag":209,"props":64843,"children":64844},{"style":448},[64845],{"type":26,"value":64846},"    /** ",{"type":21,"tag":209,"props":64848,"children":64849},{"style":216},[64850],{"type":26,"value":4718},{"type":21,"tag":209,"props":64852,"children":64853},{"style":360},[64854],{"type":26,"value":64855}," {...*}",{"type":21,"tag":209,"props":64857,"children":64858},{"style":222},[64859],{"type":26,"value":64860}," args",{"type":21,"tag":209,"props":64862,"children":64863},{"style":448},[64864],{"type":26,"value":755},{"type":21,"tag":209,"props":64866,"children":64867},{"class":211,"line":254},[64868,64873,64877,64881],{"type":21,"tag":209,"props":64869,"children":64870},{"style":360},[64871],{"type":26,"value":64872},"    log",{"type":21,"tag":209,"props":64874,"children":64875},{"style":222},[64876],{"type":26,"value":191},{"type":21,"tag":209,"props":64878,"children":64879},{"style":216},[64880],{"type":26,"value":5370},{"type":21,"tag":209,"props":64882,"children":64883},{"style":222},[64884],{"type":26,"value":64885},"(){};\n",{"type":21,"tag":209,"props":64887,"children":64888},{"class":211,"line":279},[64889],{"type":21,"tag":209,"props":64890,"children":64891},{"style":222},[64892],{"type":26,"value":340},{"type":21,"tag":22,"props":64894,"children":64895},{},[64896],{"type":26,"value":64897},"Have code that needs to be tested on a production server, but want to leave those console.log calls in for future debugging use - but not have them output when you're on the production server? Set a variable (either global if you must, or better, in an init call to a function, on the function prototype, etc.) to indicate 'debug mode' and call console.log like so:",{"type":21,"tag":200,"props":64899,"children":64901},{"className":9044,"code":64900,"language":9046,"meta":8,"style":8},"this.debug && console.log(\"Console output.\");\n",[64902],{"type":21,"tag":63,"props":64903,"children":64904},{"__ignoreMap":8},[64905],{"type":21,"tag":209,"props":64906,"children":64907},{"class":211,"line":212},[64908,64912,64917,64921,64926,64930,64934,64939],{"type":21,"tag":209,"props":64909,"children":64910},{"style":263},[64911],{"type":26,"value":2508},{"type":21,"tag":209,"props":64913,"children":64914},{"style":222},[64915],{"type":26,"value":64916},".debug ",{"type":21,"tag":209,"props":64918,"children":64919},{"style":216},[64920],{"type":26,"value":15578},{"type":21,"tag":209,"props":64922,"children":64923},{"style":222},[64924],{"type":26,"value":64925}," console.",{"type":21,"tag":209,"props":64927,"children":64928},{"style":360},[64929],{"type":26,"value":1059},{"type":21,"tag":209,"props":64931,"children":64932},{"style":222},[64933],{"type":26,"value":368},{"type":21,"tag":209,"props":64935,"children":64936},{"style":233},[64937],{"type":26,"value":64938},"\"Console output.\"",{"type":21,"tag":209,"props":64940,"children":64941},{"style":222},[64942],{"type":26,"value":2608},{"type":21,"tag":3549,"props":64944,"children":64946},{"id":64945},"getting-a-trim-capitals-and-splitting-camelcase",[64947,64949,64954],{"type":26,"value":64948},"Getting a ",{"type":21,"tag":63,"props":64950,"children":64952},{"className":64951},[],[64953],{"type":26,"value":42335},{"type":26,"value":64955},", Capitals and splitting camelCase",{"type":21,"tag":22,"props":64957,"children":64958},{},[64959,64961,64967],{"type":26,"value":64960},"It seems that even libraries purporting to support older browsers expect the ",{"type":21,"tag":63,"props":64962,"children":64964},{"className":64963},[],[64965],{"type":26,"value":64966},"String.prototype.trim",{"type":26,"value":64968}," function to be present (see the Google Maps v3 api, for instance). Unfortunately, IE versions \u003C= 8 and Safari \u003C= 5 don't. We'll just quickly pop that in to place, then:",{"type":21,"tag":200,"props":64970,"children":64972},{"className":9044,"code":64971,"language":9046,"meta":8,"style":8},"if (typeof String.prototype.trim !== 'function'){\n    String.prototype.trim = function(){\n        return this.replace(/^s+|s+$/g, '');\n    };\n}\n",[64973],{"type":21,"tag":63,"props":64974,"children":64975},{"__ignoreMap":8},[64976,65020,65056,65127,65134],{"type":21,"tag":209,"props":64977,"children":64978},{"class":211,"line":212},[64979,64983,64987,64991,64995,64999,65003,65008,65012,65016],{"type":21,"tag":209,"props":64980,"children":64981},{"style":216},[64982],{"type":26,"value":43437},{"type":21,"tag":209,"props":64984,"children":64985},{"style":222},[64986],{"type":26,"value":4776},{"type":21,"tag":209,"props":64988,"children":64989},{"style":216},[64990],{"type":26,"value":6092},{"type":21,"tag":209,"props":64992,"children":64993},{"style":263},[64994],{"type":26,"value":56573},{"type":21,"tag":209,"props":64996,"children":64997},{"style":222},[64998],{"type":26,"value":378},{"type":21,"tag":209,"props":65000,"children":65001},{"style":263},[65002],{"type":26,"value":37016},{"type":21,"tag":209,"props":65004,"children":65005},{"style":222},[65006],{"type":26,"value":65007},".trim ",{"type":21,"tag":209,"props":65009,"children":65010},{"style":216},[65011],{"type":26,"value":12011},{"type":21,"tag":209,"props":65013,"children":65014},{"style":233},[65015],{"type":26,"value":6107},{"type":21,"tag":209,"props":65017,"children":65018},{"style":222},[65019],{"type":26,"value":2369},{"type":21,"tag":209,"props":65021,"children":65022},{"class":211,"line":244},[65023,65028,65032,65036,65040,65044,65048,65052],{"type":21,"tag":209,"props":65024,"children":65025},{"style":263},[65026],{"type":26,"value":65027},"    String",{"type":21,"tag":209,"props":65029,"children":65030},{"style":222},[65031],{"type":26,"value":378},{"type":21,"tag":209,"props":65033,"children":65034},{"style":263},[65035],{"type":26,"value":37016},{"type":21,"tag":209,"props":65037,"children":65038},{"style":222},[65039],{"type":26,"value":378},{"type":21,"tag":209,"props":65041,"children":65042},{"style":360},[65043],{"type":26,"value":42335},{"type":21,"tag":209,"props":65045,"children":65046},{"style":216},[65047],{"type":26,"value":271},{"type":21,"tag":209,"props":65049,"children":65050},{"style":216},[65051],{"type":26,"value":4766},{"type":21,"tag":209,"props":65053,"children":65054},{"style":222},[65055],{"type":26,"value":2561},{"type":21,"tag":209,"props":65057,"children":65058},{"class":211,"line":254},[65059,65063,65067,65071,65075,65079,65083,65087,65092,65097,65101,65106,65110,65115,65119,65123],{"type":21,"tag":209,"props":65060,"children":65061},{"style":216},[65062],{"type":26,"value":3069},{"type":21,"tag":209,"props":65064,"children":65065},{"style":263},[65066],{"type":26,"value":17698},{"type":21,"tag":209,"props":65068,"children":65069},{"style":222},[65070],{"type":26,"value":378},{"type":21,"tag":209,"props":65072,"children":65073},{"style":360},[65074],{"type":26,"value":29854},{"type":21,"tag":209,"props":65076,"children":65077},{"style":222},[65078],{"type":26,"value":368},{"type":21,"tag":209,"props":65080,"children":65081},{"style":233},[65082],{"type":26,"value":9749},{"type":21,"tag":209,"props":65084,"children":65085},{"style":216},[65086],{"type":26,"value":10201},{"type":21,"tag":209,"props":65088,"children":65089},{"style":10204},[65090],{"type":26,"value":65091},"s",{"type":21,"tag":209,"props":65093,"children":65094},{"style":216},[65095],{"type":26,"value":65096},"+|",{"type":21,"tag":209,"props":65098,"children":65099},{"style":10204},[65100],{"type":26,"value":65091},{"type":21,"tag":209,"props":65102,"children":65103},{"style":216},[65104],{"type":26,"value":65105},"+$",{"type":21,"tag":209,"props":65107,"children":65108},{"style":233},[65109],{"type":26,"value":9749},{"type":21,"tag":209,"props":65111,"children":65112},{"style":216},[65113],{"type":26,"value":65114},"g",{"type":21,"tag":209,"props":65116,"children":65117},{"style":222},[65118],{"type":26,"value":408},{"type":21,"tag":209,"props":65120,"children":65121},{"style":233},[65122],{"type":26,"value":20111},{"type":21,"tag":209,"props":65124,"children":65125},{"style":222},[65126],{"type":26,"value":2608},{"type":21,"tag":209,"props":65128,"children":65129},{"class":211,"line":279},[65130],{"type":21,"tag":209,"props":65131,"children":65132},{"style":222},[65133],{"type":26,"value":4850},{"type":21,"tag":209,"props":65135,"children":65136},{"class":211,"line":288},[65137],{"type":21,"tag":209,"props":65138,"children":65139},{"style":222},[65140],{"type":26,"value":7798},{"type":21,"tag":22,"props":65142,"children":65143},{},[65144,65146,65152],{"type":26,"value":65145},"If you have input strings that you know will need capitalizing (say database column names that will end up in the ",{"type":21,"tag":63,"props":65147,"children":65149},{"className":65148},[],[65150],{"type":26,"value":65151},"th",{"type":26,"value":65153}," of an html table), best to wrap that in an easily callable, chainable function:",{"type":21,"tag":200,"props":65155,"children":65157},{"className":9044,"code":65156,"language":9046,"meta":8,"style":8},"String.prototype.capitalize = function(){\n    return this.charAt(0).toUpperCase() + this.slice(1);\n};\n",[65158],{"type":21,"tag":63,"props":65159,"children":65160},{"__ignoreMap":8},[65161,65198,65267],{"type":21,"tag":209,"props":65162,"children":65163},{"class":211,"line":212},[65164,65169,65173,65177,65181,65186,65190,65194],{"type":21,"tag":209,"props":65165,"children":65166},{"style":263},[65167],{"type":26,"value":65168},"String",{"type":21,"tag":209,"props":65170,"children":65171},{"style":222},[65172],{"type":26,"value":378},{"type":21,"tag":209,"props":65174,"children":65175},{"style":263},[65176],{"type":26,"value":37016},{"type":21,"tag":209,"props":65178,"children":65179},{"style":222},[65180],{"type":26,"value":378},{"type":21,"tag":209,"props":65182,"children":65183},{"style":360},[65184],{"type":26,"value":65185},"capitalize",{"type":21,"tag":209,"props":65187,"children":65188},{"style":216},[65189],{"type":26,"value":271},{"type":21,"tag":209,"props":65191,"children":65192},{"style":216},[65193],{"type":26,"value":4766},{"type":21,"tag":209,"props":65195,"children":65196},{"style":222},[65197],{"type":26,"value":2561},{"type":21,"tag":209,"props":65199,"children":65200},{"class":211,"line":244},[65201,65205,65209,65213,65218,65222,65226,65230,65235,65239,65243,65247,65251,65255,65259,65263],{"type":21,"tag":209,"props":65202,"children":65203},{"style":216},[65204],{"type":26,"value":1298},{"type":21,"tag":209,"props":65206,"children":65207},{"style":263},[65208],{"type":26,"value":17698},{"type":21,"tag":209,"props":65210,"children":65211},{"style":222},[65212],{"type":26,"value":378},{"type":21,"tag":209,"props":65214,"children":65215},{"style":360},[65216],{"type":26,"value":65217},"charAt",{"type":21,"tag":209,"props":65219,"children":65220},{"style":222},[65221],{"type":26,"value":368},{"type":21,"tag":209,"props":65223,"children":65224},{"style":263},[65225],{"type":26,"value":6048},{"type":21,"tag":209,"props":65227,"children":65228},{"style":222},[65229],{"type":26,"value":2699},{"type":21,"tag":209,"props":65231,"children":65232},{"style":360},[65233],{"type":26,"value":65234},"toUpperCase",{"type":21,"tag":209,"props":65236,"children":65237},{"style":222},[65238],{"type":26,"value":14393},{"type":21,"tag":209,"props":65240,"children":65241},{"style":216},[65242],{"type":26,"value":10237},{"type":21,"tag":209,"props":65244,"children":65245},{"style":263},[65246],{"type":26,"value":17698},{"type":21,"tag":209,"props":65248,"children":65249},{"style":222},[65250],{"type":26,"value":378},{"type":21,"tag":209,"props":65252,"children":65253},{"style":360},[65254],{"type":26,"value":46541},{"type":21,"tag":209,"props":65256,"children":65257},{"style":222},[65258],{"type":26,"value":368},{"type":21,"tag":209,"props":65260,"children":65261},{"style":263},[65262],{"type":26,"value":3224},{"type":21,"tag":209,"props":65264,"children":65265},{"style":222},[65266],{"type":26,"value":2608},{"type":21,"tag":209,"props":65268,"children":65269},{"class":211,"line":254},[65270],{"type":21,"tag":209,"props":65271,"children":65272},{"style":222},[65273],{"type":26,"value":340},{"type":21,"tag":22,"props":65275,"children":65276},{},[65277],{"type":26,"value":65278},"We can do something similar if we know we'll need to split a string on camelCaseNames:",{"type":21,"tag":200,"props":65280,"children":65282},{"className":9044,"code":65281,"language":9046,"meta":8,"style":8},"String.prototype.splitCamelCase = function(){\n    return this.replace(/([A-Z])/g, ' $1');\n};\n",[65283],{"type":21,"tag":63,"props":65284,"children":65285},{"__ignoreMap":8},[65286,65322,65383],{"type":21,"tag":209,"props":65287,"children":65288},{"class":211,"line":212},[65289,65293,65297,65301,65305,65310,65314,65318],{"type":21,"tag":209,"props":65290,"children":65291},{"style":263},[65292],{"type":26,"value":65168},{"type":21,"tag":209,"props":65294,"children":65295},{"style":222},[65296],{"type":26,"value":378},{"type":21,"tag":209,"props":65298,"children":65299},{"style":263},[65300],{"type":26,"value":37016},{"type":21,"tag":209,"props":65302,"children":65303},{"style":222},[65304],{"type":26,"value":378},{"type":21,"tag":209,"props":65306,"children":65307},{"style":360},[65308],{"type":26,"value":65309},"splitCamelCase",{"type":21,"tag":209,"props":65311,"children":65312},{"style":216},[65313],{"type":26,"value":271},{"type":21,"tag":209,"props":65315,"children":65316},{"style":216},[65317],{"type":26,"value":4766},{"type":21,"tag":209,"props":65319,"children":65320},{"style":222},[65321],{"type":26,"value":2561},{"type":21,"tag":209,"props":65323,"children":65324},{"class":211,"line":244},[65325,65329,65333,65337,65341,65345,65349,65353,65358,65362,65366,65370,65374,65379],{"type":21,"tag":209,"props":65326,"children":65327},{"style":216},[65328],{"type":26,"value":1298},{"type":21,"tag":209,"props":65330,"children":65331},{"style":263},[65332],{"type":26,"value":17698},{"type":21,"tag":209,"props":65334,"children":65335},{"style":222},[65336],{"type":26,"value":378},{"type":21,"tag":209,"props":65338,"children":65339},{"style":360},[65340],{"type":26,"value":29854},{"type":21,"tag":209,"props":65342,"children":65343},{"style":222},[65344],{"type":26,"value":368},{"type":21,"tag":209,"props":65346,"children":65347},{"style":233},[65348],{"type":26,"value":9749},{"type":21,"tag":209,"props":65350,"children":65351},{"style":10204},[65352],{"type":26,"value":368},{"type":21,"tag":209,"props":65354,"children":65355},{"style":263},[65356],{"type":26,"value":65357},"[A-Z]",{"type":21,"tag":209,"props":65359,"children":65360},{"style":10204},[65361],{"type":26,"value":57741},{"type":21,"tag":209,"props":65363,"children":65364},{"style":233},[65365],{"type":26,"value":9749},{"type":21,"tag":209,"props":65367,"children":65368},{"style":216},[65369],{"type":26,"value":65114},{"type":21,"tag":209,"props":65371,"children":65372},{"style":222},[65373],{"type":26,"value":408},{"type":21,"tag":209,"props":65375,"children":65376},{"style":233},[65377],{"type":26,"value":65378},"' $1'",{"type":21,"tag":209,"props":65380,"children":65381},{"style":222},[65382],{"type":26,"value":2608},{"type":21,"tag":209,"props":65384,"children":65385},{"class":211,"line":254},[65386],{"type":21,"tag":209,"props":65387,"children":65388},{"style":222},[65389],{"type":26,"value":340},{"type":21,"tag":22,"props":65391,"children":65392},{},[65393,65395,65401],{"type":26,"value":65394},"If you cringe at the idea of adding to the built-in prototypes, we can do something similar with, for example ",{"type":21,"tag":29,"props":65396,"children":65398},{"href":38363,"rel":65397},[93],[65399],{"type":26,"value":65400},"underscore's",{"type":26,"value":65402}," mixins:",{"type":21,"tag":200,"props":65404,"children":65406},{"className":9044,"code":65405,"language":9046,"meta":8,"style":8},"_.mixin({\n    capitalize:function(string){\n        return string.charAt(0).toUpperCase() + string.slice(1);\n    },\n    splitCamelCase:function(string){\n        return string.replace(/([A-Z])/g, ' $1');\n    }\n});\n",[65407],{"type":21,"tag":63,"props":65408,"children":65409},{"__ignoreMap":8},[65410,65427,65456,65516,65523,65551,65606,65613],{"type":21,"tag":209,"props":65411,"children":65412},{"class":211,"line":212},[65413,65418,65423],{"type":21,"tag":209,"props":65414,"children":65415},{"style":222},[65416],{"type":26,"value":65417},"_.",{"type":21,"tag":209,"props":65419,"children":65420},{"style":360},[65421],{"type":26,"value":65422},"mixin",{"type":21,"tag":209,"props":65424,"children":65425},{"style":222},[65426],{"type":26,"value":17983},{"type":21,"tag":209,"props":65428,"children":65429},{"class":211,"line":244},[65430,65435,65439,65443,65447,65452],{"type":21,"tag":209,"props":65431,"children":65432},{"style":360},[65433],{"type":26,"value":65434},"    capitalize",{"type":21,"tag":209,"props":65436,"children":65437},{"style":222},[65438],{"type":26,"value":191},{"type":21,"tag":209,"props":65440,"children":65441},{"style":216},[65442],{"type":26,"value":5370},{"type":21,"tag":209,"props":65444,"children":65445},{"style":222},[65446],{"type":26,"value":368},{"type":21,"tag":209,"props":65448,"children":65449},{"style":400},[65450],{"type":26,"value":65451},"string",{"type":21,"tag":209,"props":65453,"children":65454},{"style":222},[65455],{"type":26,"value":2369},{"type":21,"tag":209,"props":65457,"children":65458},{"class":211,"line":254},[65459,65463,65468,65472,65476,65480,65484,65488,65492,65496,65500,65504,65508,65512],{"type":21,"tag":209,"props":65460,"children":65461},{"style":216},[65462],{"type":26,"value":3069},{"type":21,"tag":209,"props":65464,"children":65465},{"style":222},[65466],{"type":26,"value":65467}," string.",{"type":21,"tag":209,"props":65469,"children":65470},{"style":360},[65471],{"type":26,"value":65217},{"type":21,"tag":209,"props":65473,"children":65474},{"style":222},[65475],{"type":26,"value":368},{"type":21,"tag":209,"props":65477,"children":65478},{"style":263},[65479],{"type":26,"value":6048},{"type":21,"tag":209,"props":65481,"children":65482},{"style":222},[65483],{"type":26,"value":2699},{"type":21,"tag":209,"props":65485,"children":65486},{"style":360},[65487],{"type":26,"value":65234},{"type":21,"tag":209,"props":65489,"children":65490},{"style":222},[65491],{"type":26,"value":14393},{"type":21,"tag":209,"props":65493,"children":65494},{"style":216},[65495],{"type":26,"value":10237},{"type":21,"tag":209,"props":65497,"children":65498},{"style":222},[65499],{"type":26,"value":65467},{"type":21,"tag":209,"props":65501,"children":65502},{"style":360},[65503],{"type":26,"value":46541},{"type":21,"tag":209,"props":65505,"children":65506},{"style":222},[65507],{"type":26,"value":368},{"type":21,"tag":209,"props":65509,"children":65510},{"style":263},[65511],{"type":26,"value":3224},{"type":21,"tag":209,"props":65513,"children":65514},{"style":222},[65515],{"type":26,"value":2608},{"type":21,"tag":209,"props":65517,"children":65518},{"class":211,"line":279},[65519],{"type":21,"tag":209,"props":65520,"children":65521},{"style":222},[65522],{"type":26,"value":2251},{"type":21,"tag":209,"props":65524,"children":65525},{"class":211,"line":288},[65526,65531,65535,65539,65543,65547],{"type":21,"tag":209,"props":65527,"children":65528},{"style":360},[65529],{"type":26,"value":65530},"    splitCamelCase",{"type":21,"tag":209,"props":65532,"children":65533},{"style":222},[65534],{"type":26,"value":191},{"type":21,"tag":209,"props":65536,"children":65537},{"style":216},[65538],{"type":26,"value":5370},{"type":21,"tag":209,"props":65540,"children":65541},{"style":222},[65542],{"type":26,"value":368},{"type":21,"tag":209,"props":65544,"children":65545},{"style":400},[65546],{"type":26,"value":65451},{"type":21,"tag":209,"props":65548,"children":65549},{"style":222},[65550],{"type":26,"value":2369},{"type":21,"tag":209,"props":65552,"children":65553},{"class":211,"line":307},[65554,65558,65562,65566,65570,65574,65578,65582,65586,65590,65594,65598,65602],{"type":21,"tag":209,"props":65555,"children":65556},{"style":216},[65557],{"type":26,"value":3069},{"type":21,"tag":209,"props":65559,"children":65560},{"style":222},[65561],{"type":26,"value":65467},{"type":21,"tag":209,"props":65563,"children":65564},{"style":360},[65565],{"type":26,"value":29854},{"type":21,"tag":209,"props":65567,"children":65568},{"style":222},[65569],{"type":26,"value":368},{"type":21,"tag":209,"props":65571,"children":65572},{"style":233},[65573],{"type":26,"value":9749},{"type":21,"tag":209,"props":65575,"children":65576},{"style":10204},[65577],{"type":26,"value":368},{"type":21,"tag":209,"props":65579,"children":65580},{"style":263},[65581],{"type":26,"value":65357},{"type":21,"tag":209,"props":65583,"children":65584},{"style":10204},[65585],{"type":26,"value":57741},{"type":21,"tag":209,"props":65587,"children":65588},{"style":233},[65589],{"type":26,"value":9749},{"type":21,"tag":209,"props":65591,"children":65592},{"style":216},[65593],{"type":26,"value":65114},{"type":21,"tag":209,"props":65595,"children":65596},{"style":222},[65597],{"type":26,"value":408},{"type":21,"tag":209,"props":65599,"children":65600},{"style":233},[65601],{"type":26,"value":65378},{"type":21,"tag":209,"props":65603,"children":65604},{"style":222},[65605],{"type":26,"value":2608},{"type":21,"tag":209,"props":65607,"children":65608},{"class":211,"line":325},[65609],{"type":21,"tag":209,"props":65610,"children":65611},{"style":222},[65612],{"type":26,"value":331},{"type":21,"tag":209,"props":65614,"children":65615},{"class":211,"line":334},[65616],{"type":21,"tag":209,"props":65617,"children":65618},{"style":222},[65619],{"type":26,"value":469},{"type":21,"tag":51,"props":65621,"children":65623},{"id":65622},"this-space-reserved",[65624],{"type":26,"value":65625},"This Space Reserved",{"type":21,"tag":22,"props":65627,"children":65628},{},[65629],{"type":26,"value":65630},"So, you've created an object somewhere in your code, probably something with meaningful names given the function their value is expected to be used for/perform, and run it, only to be met with an error: 'Expected identifier, string or number'. Chances are you've accidentally used a reserved keyword in your object keys.",{"type":21,"tag":22,"props":65632,"children":65633},{},[65634],{"type":26,"value":65635},"Something like this:",{"type":21,"tag":200,"props":65637,"children":65639},{"className":9044,"code":65638,"language":9046,"meta":8,"style":8},"var ob = {\n    for:12,\n    class:15\n};\n",[65640],{"type":21,"tag":63,"props":65641,"children":65642},{"__ignoreMap":8},[65643,65663,65680,65693],{"type":21,"tag":209,"props":65644,"children":65645},{"class":211,"line":212},[65646,65650,65655,65659],{"type":21,"tag":209,"props":65647,"children":65648},{"style":216},[65649],{"type":26,"value":8996},{"type":21,"tag":209,"props":65651,"children":65652},{"style":222},[65653],{"type":26,"value":65654}," ob ",{"type":21,"tag":209,"props":65656,"children":65657},{"style":216},[65658],{"type":26,"value":1432},{"type":21,"tag":209,"props":65660,"children":65661},{"style":222},[65662],{"type":26,"value":276},{"type":21,"tag":209,"props":65664,"children":65665},{"class":211,"line":244},[65666,65671,65676],{"type":21,"tag":209,"props":65667,"children":65668},{"style":222},[65669],{"type":26,"value":65670},"    for:",{"type":21,"tag":209,"props":65672,"children":65673},{"style":263},[65674],{"type":26,"value":65675},"12",{"type":21,"tag":209,"props":65677,"children":65678},{"style":222},[65679],{"type":26,"value":304},{"type":21,"tag":209,"props":65681,"children":65682},{"class":211,"line":254},[65683,65688],{"type":21,"tag":209,"props":65684,"children":65685},{"style":222},[65686],{"type":26,"value":65687},"    class:",{"type":21,"tag":209,"props":65689,"children":65690},{"style":263},[65691],{"type":26,"value":65692},"15\n",{"type":21,"tag":209,"props":65694,"children":65695},{"class":211,"line":279},[65696],{"type":21,"tag":209,"props":65697,"children":65698},{"style":222},[65699],{"type":26,"value":340},{"type":21,"tag":22,"props":65701,"children":65702},{},[65703],{"type":26,"value":65704},"Needs to be altered to this:",{"type":21,"tag":200,"props":65706,"children":65708},{"className":9044,"code":65707,"language":9046,"meta":8,"style":8},"var ob = {\n    'for':12,\n    'class':15\n};\n",[65709],{"type":21,"tag":63,"props":65710,"children":65711},{"__ignoreMap":8},[65712,65731,65751,65767],{"type":21,"tag":209,"props":65713,"children":65714},{"class":211,"line":212},[65715,65719,65723,65727],{"type":21,"tag":209,"props":65716,"children":65717},{"style":216},[65718],{"type":26,"value":8996},{"type":21,"tag":209,"props":65720,"children":65721},{"style":222},[65722],{"type":26,"value":65654},{"type":21,"tag":209,"props":65724,"children":65725},{"style":216},[65726],{"type":26,"value":1432},{"type":21,"tag":209,"props":65728,"children":65729},{"style":222},[65730],{"type":26,"value":276},{"type":21,"tag":209,"props":65732,"children":65733},{"class":211,"line":244},[65734,65739,65743,65747],{"type":21,"tag":209,"props":65735,"children":65736},{"style":233},[65737],{"type":26,"value":65738},"    'for'",{"type":21,"tag":209,"props":65740,"children":65741},{"style":222},[65742],{"type":26,"value":191},{"type":21,"tag":209,"props":65744,"children":65745},{"style":263},[65746],{"type":26,"value":65675},{"type":21,"tag":209,"props":65748,"children":65749},{"style":222},[65750],{"type":26,"value":304},{"type":21,"tag":209,"props":65752,"children":65753},{"class":211,"line":254},[65754,65759,65763],{"type":21,"tag":209,"props":65755,"children":65756},{"style":233},[65757],{"type":26,"value":65758},"    'class'",{"type":21,"tag":209,"props":65760,"children":65761},{"style":222},[65762],{"type":26,"value":191},{"type":21,"tag":209,"props":65764,"children":65765},{"style":263},[65766],{"type":26,"value":65692},{"type":21,"tag":209,"props":65768,"children":65769},{"class":211,"line":279},[65770],{"type":21,"tag":209,"props":65771,"children":65772},{"style":222},[65773],{"type":26,"value":340},{"type":21,"tag":22,"props":65775,"children":65776},{},[65777,65779,65786],{"type":26,"value":65778},"This will keep the js engine in question from seeing a keyword where an object key was intended. Another alternative is, of course, to simply avoid using any of the ",{"type":21,"tag":29,"props":65780,"children":65783},{"href":65781,"rel":65782},"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Reserved_Words",[93],[65784],{"type":26,"value":65785},"reserved keywords",{"type":26,"value":65787}," as object keys.",{"type":21,"tag":193,"props":65789,"children":65791},{"id":65790},"expert-timing",[65792],{"type":26,"value":65793},"Expert Timing",{"type":21,"tag":22,"props":65795,"children":65796},{},[65797,65799,65804,65806,65810],{"type":26,"value":65798},"setTimeout/setInterval is not very accurate. It has to compete with ui events and other callbacks, and really only guarantees that ",{"type":21,"tag":1084,"props":65800,"children":65801},{},[65802],{"type":26,"value":65803},"at least",{"type":26,"value":65805}," the specified interval will have passed before it gets called. Usually, its not an issue. If it ",{"type":21,"tag":1084,"props":65807,"children":65808},{},[65809],{"type":26,"value":26020},{"type":26,"value":65811}," important that the timing be accurate, however, we'll have to work a little harder.",{"type":21,"tag":22,"props":65813,"children":65814},{},[65815,65817,65823],{"type":26,"value":65816},"In modern browsers, we can rely on ",{"type":21,"tag":63,"props":65818,"children":65820},{"className":65819},[],[65821],{"type":26,"value":65822},"window.performance.now()",{"type":26,"value":65824}," for a highly accurate (10 us) timestamp. In older browsers, we'll have to make do with ms resolution from Date(). Either way, we'll be altering our desired interval with this number in our next call for the setTimeout, in order to try and keep the callbacks happening as regularly as possible, accounting for delays. This is still subject to variation, and very short intervals likely won't be long enough to allow for us to account for said variation, but the result should still be more accurate than a simple setTimeout/setInterval call, in a way that offers a similar api to the standard setInterval call.",{"type":21,"tag":200,"props":65826,"children":65828},{"className":9044,"code":65827,"language":9046,"meta":8,"style":8},"(function(window){\n    window.performance = window.performance || {};\n    performance.now = performance.now || function(){\n        return +new Date();\n    };\n\n    function AccurateInterval(options){\n        this.startTime = 0;\n        this.elapsed = 0;\n        this.timeout = 0;\n        this.interval = options.interval || 100;\n        this.callback = options.callback;\n\n        if (typeof this.callback !== 'function') throw 'You must specify a callback function.';\n\n        return this;\n    }\n\n    AccurateInterval.prototype.start = function(){\n        this.startTime = performance.now();\n        this.timeout = window.setTimeout(this.tick.bind(this), this.interval);\n\n        return this;\n    };\n\n    AccurateInterval.prototype.tick = function(){\n        this.elapsed += this.interval;\n        var missedTicks = 0,\n            nextInterval = this.interval - ((performance.now() - this.startTime) - this.elapsed);\n\n        if (nextInterval \u003C= 0) {\n            missedTicks = (Math.abs(nextInterval) / this.interval) | 0;\n            this.elapsed += missedTicks * this.interval;\n            this.tick();\n            return;\n        }\n        this.callback();\n        this.timeout = window.setTimeout(this.tick.bind(this), nextInterval);\n    };\n\n    AccurateInterval.prototype.stop = function(){\n        window.clearTimeout(this.timeout);\n\n        return this;\n    };\n\n    window.setAccurateInterval = function(callback, interval){\n        return new AccurateInterval({callback:callback, interval:interval}).start();\n    };\n\n    window.clearAccurateInterval = function(acc){\n        acc.stop();\n    };\n})(window);\n",[65829],{"type":21,"tag":63,"props":65830,"children":65831},{"__ignoreMap":8},[65832,65855,65880,65909,65928,65935,65942,65966,65990,66014,66038,66072,66093,66100,66148,66155,66170,66177,66184,66220,66249,66311,66318,66333,66340,66347,66383,66407,66431,66494,66501,66526,66578,66609,66628,66639,66646,66665,66717,66724,66731,66767,66792,66799,66814,66821,66828,66870,66898,66905,66912,66945,66961,66968],{"type":21,"tag":209,"props":65833,"children":65834},{"class":211,"line":212},[65835,65839,65843,65847,65851],{"type":21,"tag":209,"props":65836,"children":65837},{"style":222},[65838],{"type":26,"value":368},{"type":21,"tag":209,"props":65840,"children":65841},{"style":216},[65842],{"type":26,"value":5370},{"type":21,"tag":209,"props":65844,"children":65845},{"style":222},[65846],{"type":26,"value":368},{"type":21,"tag":209,"props":65848,"children":65849},{"style":400},[65850],{"type":26,"value":10393},{"type":21,"tag":209,"props":65852,"children":65853},{"style":222},[65854],{"type":26,"value":2369},{"type":21,"tag":209,"props":65856,"children":65857},{"class":211,"line":244},[65858,65863,65867,65872,65876],{"type":21,"tag":209,"props":65859,"children":65860},{"style":222},[65861],{"type":26,"value":65862},"    window.performance ",{"type":21,"tag":209,"props":65864,"children":65865},{"style":216},[65866],{"type":26,"value":1432},{"type":21,"tag":209,"props":65868,"children":65869},{"style":222},[65870],{"type":26,"value":65871}," window.performance ",{"type":21,"tag":209,"props":65873,"children":65874},{"style":216},[65875],{"type":26,"value":4677},{"type":21,"tag":209,"props":65877,"children":65878},{"style":222},[65879],{"type":26,"value":32274},{"type":21,"tag":209,"props":65881,"children":65882},{"class":211,"line":254},[65883,65888,65892,65897,65901,65905],{"type":21,"tag":209,"props":65884,"children":65885},{"style":222},[65886],{"type":26,"value":65887},"    performance.now ",{"type":21,"tag":209,"props":65889,"children":65890},{"style":216},[65891],{"type":26,"value":1432},{"type":21,"tag":209,"props":65893,"children":65894},{"style":222},[65895],{"type":26,"value":65896}," performance.now ",{"type":21,"tag":209,"props":65898,"children":65899},{"style":216},[65900],{"type":26,"value":4677},{"type":21,"tag":209,"props":65902,"children":65903},{"style":216},[65904],{"type":26,"value":4766},{"type":21,"tag":209,"props":65906,"children":65907},{"style":222},[65908],{"type":26,"value":2561},{"type":21,"tag":209,"props":65910,"children":65911},{"class":211,"line":279},[65912,65916,65920,65924],{"type":21,"tag":209,"props":65913,"children":65914},{"style":216},[65915],{"type":26,"value":3069},{"type":21,"tag":209,"props":65917,"children":65918},{"style":216},[65919],{"type":26,"value":17248},{"type":21,"tag":209,"props":65921,"children":65922},{"style":360},[65923],{"type":26,"value":14388},{"type":21,"tag":209,"props":65925,"children":65926},{"style":222},[65927],{"type":26,"value":4842},{"type":21,"tag":209,"props":65929,"children":65930},{"class":211,"line":288},[65931],{"type":21,"tag":209,"props":65932,"children":65933},{"style":222},[65934],{"type":26,"value":4850},{"type":21,"tag":209,"props":65936,"children":65937},{"class":211,"line":307},[65938],{"type":21,"tag":209,"props":65939,"children":65940},{"emptyLinePlaceholder":248},[65941],{"type":26,"value":251},{"type":21,"tag":209,"props":65943,"children":65944},{"class":211,"line":325},[65945,65949,65954,65958,65962],{"type":21,"tag":209,"props":65946,"children":65947},{"style":216},[65948],{"type":26,"value":2981},{"type":21,"tag":209,"props":65950,"children":65951},{"style":360},[65952],{"type":26,"value":65953}," AccurateInterval",{"type":21,"tag":209,"props":65955,"children":65956},{"style":222},[65957],{"type":26,"value":368},{"type":21,"tag":209,"props":65959,"children":65960},{"style":400},[65961],{"type":26,"value":29825},{"type":21,"tag":209,"props":65963,"children":65964},{"style":222},[65965],{"type":26,"value":2369},{"type":21,"tag":209,"props":65967,"children":65968},{"class":211,"line":334},[65969,65973,65978,65982,65986],{"type":21,"tag":209,"props":65970,"children":65971},{"style":263},[65972],{"type":26,"value":51473},{"type":21,"tag":209,"props":65974,"children":65975},{"style":222},[65976],{"type":26,"value":65977},".startTime ",{"type":21,"tag":209,"props":65979,"children":65980},{"style":216},[65981],{"type":26,"value":1432},{"type":21,"tag":209,"props":65983,"children":65984},{"style":263},[65985],{"type":26,"value":17197},{"type":21,"tag":209,"props":65987,"children":65988},{"style":222},[65989],{"type":26,"value":241},{"type":21,"tag":209,"props":65991,"children":65992},{"class":211,"line":343},[65993,65997,66002,66006,66010],{"type":21,"tag":209,"props":65994,"children":65995},{"style":263},[65996],{"type":26,"value":51473},{"type":21,"tag":209,"props":65998,"children":65999},{"style":222},[66000],{"type":26,"value":66001},".elapsed ",{"type":21,"tag":209,"props":66003,"children":66004},{"style":216},[66005],{"type":26,"value":1432},{"type":21,"tag":209,"props":66007,"children":66008},{"style":263},[66009],{"type":26,"value":17197},{"type":21,"tag":209,"props":66011,"children":66012},{"style":222},[66013],{"type":26,"value":241},{"type":21,"tag":209,"props":66015,"children":66016},{"class":211,"line":351},[66017,66021,66026,66030,66034],{"type":21,"tag":209,"props":66018,"children":66019},{"style":263},[66020],{"type":26,"value":51473},{"type":21,"tag":209,"props":66022,"children":66023},{"style":222},[66024],{"type":26,"value":66025},".timeout ",{"type":21,"tag":209,"props":66027,"children":66028},{"style":216},[66029],{"type":26,"value":1432},{"type":21,"tag":209,"props":66031,"children":66032},{"style":263},[66033],{"type":26,"value":17197},{"type":21,"tag":209,"props":66035,"children":66036},{"style":222},[66037],{"type":26,"value":241},{"type":21,"tag":209,"props":66039,"children":66040},{"class":211,"line":444},[66041,66045,66050,66054,66059,66063,66068],{"type":21,"tag":209,"props":66042,"children":66043},{"style":263},[66044],{"type":26,"value":51473},{"type":21,"tag":209,"props":66046,"children":66047},{"style":222},[66048],{"type":26,"value":66049},".interval ",{"type":21,"tag":209,"props":66051,"children":66052},{"style":216},[66053],{"type":26,"value":1432},{"type":21,"tag":209,"props":66055,"children":66056},{"style":222},[66057],{"type":26,"value":66058}," options.interval ",{"type":21,"tag":209,"props":66060,"children":66061},{"style":216},[66062],{"type":26,"value":4677},{"type":21,"tag":209,"props":66064,"children":66065},{"style":263},[66066],{"type":26,"value":66067}," 100",{"type":21,"tag":209,"props":66069,"children":66070},{"style":222},[66071],{"type":26,"value":241},{"type":21,"tag":209,"props":66073,"children":66074},{"class":211,"line":454},[66075,66079,66084,66088],{"type":21,"tag":209,"props":66076,"children":66077},{"style":263},[66078],{"type":26,"value":51473},{"type":21,"tag":209,"props":66080,"children":66081},{"style":222},[66082],{"type":26,"value":66083},".callback ",{"type":21,"tag":209,"props":66085,"children":66086},{"style":216},[66087],{"type":26,"value":1432},{"type":21,"tag":209,"props":66089,"children":66090},{"style":222},[66091],{"type":26,"value":66092}," options.callback;\n",{"type":21,"tag":209,"props":66094,"children":66095},{"class":211,"line":463},[66096],{"type":21,"tag":209,"props":66097,"children":66098},{"emptyLinePlaceholder":248},[66099],{"type":26,"value":251},{"type":21,"tag":209,"props":66101,"children":66102},{"class":211,"line":472},[66103,66107,66111,66115,66119,66123,66127,66131,66135,66139,66144],{"type":21,"tag":209,"props":66104,"children":66105},{"style":216},[66106],{"type":26,"value":5803},{"type":21,"tag":209,"props":66108,"children":66109},{"style":222},[66110],{"type":26,"value":4776},{"type":21,"tag":209,"props":66112,"children":66113},{"style":216},[66114],{"type":26,"value":6092},{"type":21,"tag":209,"props":66116,"children":66117},{"style":263},[66118],{"type":26,"value":17698},{"type":21,"tag":209,"props":66120,"children":66121},{"style":222},[66122],{"type":26,"value":66083},{"type":21,"tag":209,"props":66124,"children":66125},{"style":216},[66126],{"type":26,"value":12011},{"type":21,"tag":209,"props":66128,"children":66129},{"style":233},[66130],{"type":26,"value":6107},{"type":21,"tag":209,"props":66132,"children":66133},{"style":222},[66134],{"type":26,"value":432},{"type":21,"tag":209,"props":66136,"children":66137},{"style":216},[66138],{"type":26,"value":18743},{"type":21,"tag":209,"props":66140,"children":66141},{"style":233},[66142],{"type":26,"value":66143}," 'You must specify a callback function.'",{"type":21,"tag":209,"props":66145,"children":66146},{"style":222},[66147],{"type":26,"value":241},{"type":21,"tag":209,"props":66149,"children":66150},{"class":211,"line":480},[66151],{"type":21,"tag":209,"props":66152,"children":66153},{"emptyLinePlaceholder":248},[66154],{"type":26,"value":251},{"type":21,"tag":209,"props":66156,"children":66157},{"class":211,"line":489},[66158,66162,66166],{"type":21,"tag":209,"props":66159,"children":66160},{"style":216},[66161],{"type":26,"value":3069},{"type":21,"tag":209,"props":66163,"children":66164},{"style":263},[66165],{"type":26,"value":17698},{"type":21,"tag":209,"props":66167,"children":66168},{"style":222},[66169],{"type":26,"value":241},{"type":21,"tag":209,"props":66171,"children":66172},{"class":211,"line":847},[66173],{"type":21,"tag":209,"props":66174,"children":66175},{"style":222},[66176],{"type":26,"value":331},{"type":21,"tag":209,"props":66178,"children":66179},{"class":211,"line":860},[66180],{"type":21,"tag":209,"props":66181,"children":66182},{"emptyLinePlaceholder":248},[66183],{"type":26,"value":251},{"type":21,"tag":209,"props":66185,"children":66186},{"class":211,"line":877},[66187,66192,66196,66200,66204,66208,66212,66216],{"type":21,"tag":209,"props":66188,"children":66189},{"style":263},[66190],{"type":26,"value":66191},"    AccurateInterval",{"type":21,"tag":209,"props":66193,"children":66194},{"style":222},[66195],{"type":26,"value":378},{"type":21,"tag":209,"props":66197,"children":66198},{"style":263},[66199],{"type":26,"value":37016},{"type":21,"tag":209,"props":66201,"children":66202},{"style":222},[66203],{"type":26,"value":378},{"type":21,"tag":209,"props":66205,"children":66206},{"style":360},[66207],{"type":26,"value":5082},{"type":21,"tag":209,"props":66209,"children":66210},{"style":216},[66211],{"type":26,"value":271},{"type":21,"tag":209,"props":66213,"children":66214},{"style":216},[66215],{"type":26,"value":4766},{"type":21,"tag":209,"props":66217,"children":66218},{"style":222},[66219],{"type":26,"value":2561},{"type":21,"tag":209,"props":66221,"children":66222},{"class":211,"line":889},[66223,66227,66231,66235,66240,66245],{"type":21,"tag":209,"props":66224,"children":66225},{"style":263},[66226],{"type":26,"value":51473},{"type":21,"tag":209,"props":66228,"children":66229},{"style":222},[66230],{"type":26,"value":65977},{"type":21,"tag":209,"props":66232,"children":66233},{"style":216},[66234],{"type":26,"value":1432},{"type":21,"tag":209,"props":66236,"children":66237},{"style":222},[66238],{"type":26,"value":66239}," performance.",{"type":21,"tag":209,"props":66241,"children":66242},{"style":360},[66243],{"type":26,"value":66244},"now",{"type":21,"tag":209,"props":66246,"children":66247},{"style":222},[66248],{"type":26,"value":4842},{"type":21,"tag":209,"props":66250,"children":66251},{"class":211,"line":902},[66252,66256,66260,66264,66269,66273,66277,66281,66286,66290,66294,66298,66302,66306],{"type":21,"tag":209,"props":66253,"children":66254},{"style":263},[66255],{"type":26,"value":51473},{"type":21,"tag":209,"props":66257,"children":66258},{"style":222},[66259],{"type":26,"value":66025},{"type":21,"tag":209,"props":66261,"children":66262},{"style":216},[66263],{"type":26,"value":1432},{"type":21,"tag":209,"props":66265,"children":66266},{"style":222},[66267],{"type":26,"value":66268}," window.",{"type":21,"tag":209,"props":66270,"children":66271},{"style":360},[66272],{"type":26,"value":9415},{"type":21,"tag":209,"props":66274,"children":66275},{"style":222},[66276],{"type":26,"value":368},{"type":21,"tag":209,"props":66278,"children":66279},{"style":263},[66280],{"type":26,"value":2508},{"type":21,"tag":209,"props":66282,"children":66283},{"style":222},[66284],{"type":26,"value":66285},".tick.",{"type":21,"tag":209,"props":66287,"children":66288},{"style":360},[66289],{"type":26,"value":17387},{"type":21,"tag":209,"props":66291,"children":66292},{"style":222},[66293],{"type":26,"value":368},{"type":21,"tag":209,"props":66295,"children":66296},{"style":263},[66297],{"type":26,"value":2508},{"type":21,"tag":209,"props":66299,"children":66300},{"style":222},[66301],{"type":26,"value":54894},{"type":21,"tag":209,"props":66303,"children":66304},{"style":263},[66305],{"type":26,"value":2508},{"type":21,"tag":209,"props":66307,"children":66308},{"style":222},[66309],{"type":26,"value":66310},".interval);\n",{"type":21,"tag":209,"props":66312,"children":66313},{"class":211,"line":914},[66314],{"type":21,"tag":209,"props":66315,"children":66316},{"emptyLinePlaceholder":248},[66317],{"type":26,"value":251},{"type":21,"tag":209,"props":66319,"children":66320},{"class":211,"line":922},[66321,66325,66329],{"type":21,"tag":209,"props":66322,"children":66323},{"style":216},[66324],{"type":26,"value":3069},{"type":21,"tag":209,"props":66326,"children":66327},{"style":263},[66328],{"type":26,"value":17698},{"type":21,"tag":209,"props":66330,"children":66331},{"style":222},[66332],{"type":26,"value":241},{"type":21,"tag":209,"props":66334,"children":66335},{"class":211,"line":2312},[66336],{"type":21,"tag":209,"props":66337,"children":66338},{"style":222},[66339],{"type":26,"value":4850},{"type":21,"tag":209,"props":66341,"children":66342},{"class":211,"line":2321},[66343],{"type":21,"tag":209,"props":66344,"children":66345},{"emptyLinePlaceholder":248},[66346],{"type":26,"value":251},{"type":21,"tag":209,"props":66348,"children":66349},{"class":211,"line":2372},[66350,66354,66358,66362,66366,66371,66375,66379],{"type":21,"tag":209,"props":66351,"children":66352},{"style":263},[66353],{"type":26,"value":66191},{"type":21,"tag":209,"props":66355,"children":66356},{"style":222},[66357],{"type":26,"value":378},{"type":21,"tag":209,"props":66359,"children":66360},{"style":263},[66361],{"type":26,"value":37016},{"type":21,"tag":209,"props":66363,"children":66364},{"style":222},[66365],{"type":26,"value":378},{"type":21,"tag":209,"props":66367,"children":66368},{"style":360},[66369],{"type":26,"value":66370},"tick",{"type":21,"tag":209,"props":66372,"children":66373},{"style":216},[66374],{"type":26,"value":271},{"type":21,"tag":209,"props":66376,"children":66377},{"style":216},[66378],{"type":26,"value":4766},{"type":21,"tag":209,"props":66380,"children":66381},{"style":222},[66382],{"type":26,"value":2561},{"type":21,"tag":209,"props":66384,"children":66385},{"class":211,"line":2381},[66386,66390,66394,66398,66402],{"type":21,"tag":209,"props":66387,"children":66388},{"style":263},[66389],{"type":26,"value":51473},{"type":21,"tag":209,"props":66391,"children":66392},{"style":222},[66393],{"type":26,"value":66001},{"type":21,"tag":209,"props":66395,"children":66396},{"style":216},[66397],{"type":26,"value":13131},{"type":21,"tag":209,"props":66399,"children":66400},{"style":263},[66401],{"type":26,"value":17698},{"type":21,"tag":209,"props":66403,"children":66404},{"style":222},[66405],{"type":26,"value":66406},".interval;\n",{"type":21,"tag":209,"props":66408,"children":66409},{"class":211,"line":2389},[66410,66414,66419,66423,66427],{"type":21,"tag":209,"props":66411,"children":66412},{"style":216},[66413],{"type":26,"value":5925},{"type":21,"tag":209,"props":66415,"children":66416},{"style":222},[66417],{"type":26,"value":66418}," missedTicks ",{"type":21,"tag":209,"props":66420,"children":66421},{"style":216},[66422],{"type":26,"value":1432},{"type":21,"tag":209,"props":66424,"children":66425},{"style":263},[66426],{"type":26,"value":17197},{"type":21,"tag":209,"props":66428,"children":66429},{"style":222},[66430],{"type":26,"value":304},{"type":21,"tag":209,"props":66432,"children":66433},{"class":211,"line":2397},[66434,66439,66443,66447,66451,66455,66460,66464,66468,66472,66476,66481,66485,66489],{"type":21,"tag":209,"props":66435,"children":66436},{"style":222},[66437],{"type":26,"value":66438},"            nextInterval ",{"type":21,"tag":209,"props":66440,"children":66441},{"style":216},[66442],{"type":26,"value":1432},{"type":21,"tag":209,"props":66444,"children":66445},{"style":263},[66446],{"type":26,"value":17698},{"type":21,"tag":209,"props":66448,"children":66449},{"style":222},[66450],{"type":26,"value":66049},{"type":21,"tag":209,"props":66452,"children":66453},{"style":216},[66454],{"type":26,"value":13012},{"type":21,"tag":209,"props":66456,"children":66457},{"style":222},[66458],{"type":26,"value":66459}," ((performance.",{"type":21,"tag":209,"props":66461,"children":66462},{"style":360},[66463],{"type":26,"value":66244},{"type":21,"tag":209,"props":66465,"children":66466},{"style":222},[66467],{"type":26,"value":14393},{"type":21,"tag":209,"props":66469,"children":66470},{"style":216},[66471],{"type":26,"value":13012},{"type":21,"tag":209,"props":66473,"children":66474},{"style":263},[66475],{"type":26,"value":17698},{"type":21,"tag":209,"props":66477,"children":66478},{"style":222},[66479],{"type":26,"value":66480},".startTime) ",{"type":21,"tag":209,"props":66482,"children":66483},{"style":216},[66484],{"type":26,"value":13012},{"type":21,"tag":209,"props":66486,"children":66487},{"style":263},[66488],{"type":26,"value":17698},{"type":21,"tag":209,"props":66490,"children":66491},{"style":222},[66492],{"type":26,"value":66493},".elapsed);\n",{"type":21,"tag":209,"props":66495,"children":66496},{"class":211,"line":2406},[66497],{"type":21,"tag":209,"props":66498,"children":66499},{"emptyLinePlaceholder":248},[66500],{"type":26,"value":251},{"type":21,"tag":209,"props":66502,"children":66503},{"class":211,"line":2415},[66504,66508,66513,66518,66522],{"type":21,"tag":209,"props":66505,"children":66506},{"style":216},[66507],{"type":26,"value":5803},{"type":21,"tag":209,"props":66509,"children":66510},{"style":222},[66511],{"type":26,"value":66512}," (nextInterval ",{"type":21,"tag":209,"props":66514,"children":66515},{"style":216},[66516],{"type":26,"value":66517},"\u003C=",{"type":21,"tag":209,"props":66519,"children":66520},{"style":263},[66521],{"type":26,"value":17197},{"type":21,"tag":209,"props":66523,"children":66524},{"style":222},[66525],{"type":26,"value":4786},{"type":21,"tag":209,"props":66527,"children":66528},{"class":211,"line":2424},[66529,66534,66538,66543,66548,66553,66557,66561,66566,66570,66574],{"type":21,"tag":209,"props":66530,"children":66531},{"style":222},[66532],{"type":26,"value":66533},"            missedTicks ",{"type":21,"tag":209,"props":66535,"children":66536},{"style":216},[66537],{"type":26,"value":1432},{"type":21,"tag":209,"props":66539,"children":66540},{"style":222},[66541],{"type":26,"value":66542}," (Math.",{"type":21,"tag":209,"props":66544,"children":66545},{"style":360},[66546],{"type":26,"value":66547},"abs",{"type":21,"tag":209,"props":66549,"children":66550},{"style":222},[66551],{"type":26,"value":66552},"(nextInterval) ",{"type":21,"tag":209,"props":66554,"children":66555},{"style":216},[66556],{"type":26,"value":9749},{"type":21,"tag":209,"props":66558,"children":66559},{"style":263},[66560],{"type":26,"value":17698},{"type":21,"tag":209,"props":66562,"children":66563},{"style":222},[66564],{"type":26,"value":66565},".interval) ",{"type":21,"tag":209,"props":66567,"children":66568},{"style":216},[66569],{"type":26,"value":58972},{"type":21,"tag":209,"props":66571,"children":66572},{"style":263},[66573],{"type":26,"value":17197},{"type":21,"tag":209,"props":66575,"children":66576},{"style":222},[66577],{"type":26,"value":241},{"type":21,"tag":209,"props":66579,"children":66580},{"class":211,"line":2433},[66581,66585,66589,66593,66597,66601,66605],{"type":21,"tag":209,"props":66582,"children":66583},{"style":263},[66584],{"type":26,"value":2570},{"type":21,"tag":209,"props":66586,"children":66587},{"style":222},[66588],{"type":26,"value":66001},{"type":21,"tag":209,"props":66590,"children":66591},{"style":216},[66592],{"type":26,"value":13131},{"type":21,"tag":209,"props":66594,"children":66595},{"style":222},[66596],{"type":26,"value":66418},{"type":21,"tag":209,"props":66598,"children":66599},{"style":216},[66600],{"type":26,"value":944},{"type":21,"tag":209,"props":66602,"children":66603},{"style":263},[66604],{"type":26,"value":17698},{"type":21,"tag":209,"props":66606,"children":66607},{"style":222},[66608],{"type":26,"value":66406},{"type":21,"tag":209,"props":66610,"children":66611},{"class":211,"line":2442},[66612,66616,66620,66624],{"type":21,"tag":209,"props":66613,"children":66614},{"style":263},[66615],{"type":26,"value":2570},{"type":21,"tag":209,"props":66617,"children":66618},{"style":222},[66619],{"type":26,"value":378},{"type":21,"tag":209,"props":66621,"children":66622},{"style":360},[66623],{"type":26,"value":66370},{"type":21,"tag":209,"props":66625,"children":66626},{"style":222},[66627],{"type":26,"value":4842},{"type":21,"tag":209,"props":66629,"children":66630},{"class":211,"line":2471},[66631,66635],{"type":21,"tag":209,"props":66632,"children":66633},{"style":216},[66634],{"type":26,"value":5101},{"type":21,"tag":209,"props":66636,"children":66637},{"style":222},[66638],{"type":26,"value":241},{"type":21,"tag":209,"props":66640,"children":66641},{"class":211,"line":2480},[66642],{"type":21,"tag":209,"props":66643,"children":66644},{"style":222},[66645],{"type":26,"value":2235},{"type":21,"tag":209,"props":66647,"children":66648},{"class":211,"line":2489},[66649,66653,66657,66661],{"type":21,"tag":209,"props":66650,"children":66651},{"style":263},[66652],{"type":26,"value":51473},{"type":21,"tag":209,"props":66654,"children":66655},{"style":222},[66656],{"type":26,"value":378},{"type":21,"tag":209,"props":66658,"children":66659},{"style":360},[66660],{"type":26,"value":36323},{"type":21,"tag":209,"props":66662,"children":66663},{"style":222},[66664],{"type":26,"value":4842},{"type":21,"tag":209,"props":66666,"children":66667},{"class":211,"line":2516},[66668,66672,66676,66680,66684,66688,66692,66696,66700,66704,66708,66712],{"type":21,"tag":209,"props":66669,"children":66670},{"style":263},[66671],{"type":26,"value":51473},{"type":21,"tag":209,"props":66673,"children":66674},{"style":222},[66675],{"type":26,"value":66025},{"type":21,"tag":209,"props":66677,"children":66678},{"style":216},[66679],{"type":26,"value":1432},{"type":21,"tag":209,"props":66681,"children":66682},{"style":222},[66683],{"type":26,"value":66268},{"type":21,"tag":209,"props":66685,"children":66686},{"style":360},[66687],{"type":26,"value":9415},{"type":21,"tag":209,"props":66689,"children":66690},{"style":222},[66691],{"type":26,"value":368},{"type":21,"tag":209,"props":66693,"children":66694},{"style":263},[66695],{"type":26,"value":2508},{"type":21,"tag":209,"props":66697,"children":66698},{"style":222},[66699],{"type":26,"value":66285},{"type":21,"tag":209,"props":66701,"children":66702},{"style":360},[66703],{"type":26,"value":17387},{"type":21,"tag":209,"props":66705,"children":66706},{"style":222},[66707],{"type":26,"value":368},{"type":21,"tag":209,"props":66709,"children":66710},{"style":263},[66711],{"type":26,"value":2508},{"type":21,"tag":209,"props":66713,"children":66714},{"style":222},[66715],{"type":26,"value":66716},"), nextInterval);\n",{"type":21,"tag":209,"props":66718,"children":66719},{"class":211,"line":2525},[66720],{"type":21,"tag":209,"props":66721,"children":66722},{"style":222},[66723],{"type":26,"value":4850},{"type":21,"tag":209,"props":66725,"children":66726},{"class":211,"line":2533},[66727],{"type":21,"tag":209,"props":66728,"children":66729},{"emptyLinePlaceholder":248},[66730],{"type":26,"value":251},{"type":21,"tag":209,"props":66732,"children":66733},{"class":211,"line":2542},[66734,66738,66742,66746,66750,66755,66759,66763],{"type":21,"tag":209,"props":66735,"children":66736},{"style":263},[66737],{"type":26,"value":66191},{"type":21,"tag":209,"props":66739,"children":66740},{"style":222},[66741],{"type":26,"value":378},{"type":21,"tag":209,"props":66743,"children":66744},{"style":263},[66745],{"type":26,"value":37016},{"type":21,"tag":209,"props":66747,"children":66748},{"style":222},[66749],{"type":26,"value":378},{"type":21,"tag":209,"props":66751,"children":66752},{"style":360},[66753],{"type":26,"value":66754},"stop",{"type":21,"tag":209,"props":66756,"children":66757},{"style":216},[66758],{"type":26,"value":271},{"type":21,"tag":209,"props":66760,"children":66761},{"style":216},[66762],{"type":26,"value":4766},{"type":21,"tag":209,"props":66764,"children":66765},{"style":222},[66766],{"type":26,"value":2561},{"type":21,"tag":209,"props":66768,"children":66769},{"class":211,"line":2550},[66770,66774,66779,66783,66787],{"type":21,"tag":209,"props":66771,"children":66772},{"style":222},[66773],{"type":26,"value":11042},{"type":21,"tag":209,"props":66775,"children":66776},{"style":360},[66777],{"type":26,"value":66778},"clearTimeout",{"type":21,"tag":209,"props":66780,"children":66781},{"style":222},[66782],{"type":26,"value":368},{"type":21,"tag":209,"props":66784,"children":66785},{"style":263},[66786],{"type":26,"value":2508},{"type":21,"tag":209,"props":66788,"children":66789},{"style":222},[66790],{"type":26,"value":66791},".timeout);\n",{"type":21,"tag":209,"props":66793,"children":66794},{"class":211,"line":2564},[66795],{"type":21,"tag":209,"props":66796,"children":66797},{"emptyLinePlaceholder":248},[66798],{"type":26,"value":251},{"type":21,"tag":209,"props":66800,"children":66801},{"class":211,"line":2611},[66802,66806,66810],{"type":21,"tag":209,"props":66803,"children":66804},{"style":216},[66805],{"type":26,"value":3069},{"type":21,"tag":209,"props":66807,"children":66808},{"style":263},[66809],{"type":26,"value":17698},{"type":21,"tag":209,"props":66811,"children":66812},{"style":222},[66813],{"type":26,"value":241},{"type":21,"tag":209,"props":66815,"children":66816},{"class":211,"line":2619},[66817],{"type":21,"tag":209,"props":66818,"children":66819},{"style":222},[66820],{"type":26,"value":4850},{"type":21,"tag":209,"props":66822,"children":66823},{"class":211,"line":2627},[66824],{"type":21,"tag":209,"props":66825,"children":66826},{"emptyLinePlaceholder":248},[66827],{"type":26,"value":251},{"type":21,"tag":209,"props":66829,"children":66830},{"class":211,"line":2636},[66831,66836,66841,66845,66849,66853,66857,66861,66866],{"type":21,"tag":209,"props":66832,"children":66833},{"style":222},[66834],{"type":26,"value":66835},"    window.",{"type":21,"tag":209,"props":66837,"children":66838},{"style":360},[66839],{"type":26,"value":66840},"setAccurateInterval",{"type":21,"tag":209,"props":66842,"children":66843},{"style":216},[66844],{"type":26,"value":271},{"type":21,"tag":209,"props":66846,"children":66847},{"style":216},[66848],{"type":26,"value":4766},{"type":21,"tag":209,"props":66850,"children":66851},{"style":222},[66852],{"type":26,"value":368},{"type":21,"tag":209,"props":66854,"children":66855},{"style":400},[66856],{"type":26,"value":36323},{"type":21,"tag":209,"props":66858,"children":66859},{"style":222},[66860],{"type":26,"value":408},{"type":21,"tag":209,"props":66862,"children":66863},{"style":400},[66864],{"type":26,"value":66865},"interval",{"type":21,"tag":209,"props":66867,"children":66868},{"style":222},[66869],{"type":26,"value":2369},{"type":21,"tag":209,"props":66871,"children":66872},{"class":211,"line":2644},[66873,66877,66881,66885,66890,66894],{"type":21,"tag":209,"props":66874,"children":66875},{"style":216},[66876],{"type":26,"value":3069},{"type":21,"tag":209,"props":66878,"children":66879},{"style":216},[66880],{"type":26,"value":4667},{"type":21,"tag":209,"props":66882,"children":66883},{"style":360},[66884],{"type":26,"value":65953},{"type":21,"tag":209,"props":66886,"children":66887},{"style":222},[66888],{"type":26,"value":66889},"({callback:callback, interval:interval}).",{"type":21,"tag":209,"props":66891,"children":66892},{"style":360},[66893],{"type":26,"value":5082},{"type":21,"tag":209,"props":66895,"children":66896},{"style":222},[66897],{"type":26,"value":4842},{"type":21,"tag":209,"props":66899,"children":66900},{"class":211,"line":2657},[66901],{"type":21,"tag":209,"props":66902,"children":66903},{"style":222},[66904],{"type":26,"value":4850},{"type":21,"tag":209,"props":66906,"children":66907},{"class":211,"line":2728},[66908],{"type":21,"tag":209,"props":66909,"children":66910},{"emptyLinePlaceholder":248},[66911],{"type":26,"value":251},{"type":21,"tag":209,"props":66913,"children":66914},{"class":211,"line":2758},[66915,66919,66924,66928,66932,66936,66941],{"type":21,"tag":209,"props":66916,"children":66917},{"style":222},[66918],{"type":26,"value":66835},{"type":21,"tag":209,"props":66920,"children":66921},{"style":360},[66922],{"type":26,"value":66923},"clearAccurateInterval",{"type":21,"tag":209,"props":66925,"children":66926},{"style":216},[66927],{"type":26,"value":271},{"type":21,"tag":209,"props":66929,"children":66930},{"style":216},[66931],{"type":26,"value":4766},{"type":21,"tag":209,"props":66933,"children":66934},{"style":222},[66935],{"type":26,"value":368},{"type":21,"tag":209,"props":66937,"children":66938},{"style":400},[66939],{"type":26,"value":66940},"acc",{"type":21,"tag":209,"props":66942,"children":66943},{"style":222},[66944],{"type":26,"value":2369},{"type":21,"tag":209,"props":66946,"children":66947},{"class":211,"line":2776},[66948,66953,66957],{"type":21,"tag":209,"props":66949,"children":66950},{"style":222},[66951],{"type":26,"value":66952},"        acc.",{"type":21,"tag":209,"props":66954,"children":66955},{"style":360},[66956],{"type":26,"value":66754},{"type":21,"tag":209,"props":66958,"children":66959},{"style":222},[66960],{"type":26,"value":4842},{"type":21,"tag":209,"props":66962,"children":66963},{"class":211,"line":2785},[66964],{"type":21,"tag":209,"props":66965,"children":66966},{"style":222},[66967],{"type":26,"value":4850},{"type":21,"tag":209,"props":66969,"children":66970},{"class":211,"line":2793},[66971],{"type":21,"tag":209,"props":66972,"children":66973},{"style":222},[66974],{"type":26,"value":11184},{"type":21,"tag":22,"props":66976,"children":66977},{},[66978,66980,66985],{"type":26,"value":66979},"Hopefully, one or more of the above offers you a quick solution so you can get back to the ",{"type":21,"tag":1084,"props":66981,"children":66982},{},[66983],{"type":26,"value":66984},"real",{"type":26,"value":66986}," problem you were supposed to be solving... and if not, at least offer you some solace as you struggle - we've all hit a few little hurdles along the way.",{"type":21,"tag":3490,"props":66988,"children":66989},{},[66990],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":66992},[66993,66994,66995],{"id":64615,"depth":244,"text":64618},{"id":64777,"depth":244,"text":64780},{"id":64945,"depth":244,"text":66996,"children":66997},"Getting a trim, Capitals and splitting camelCase",[66998],{"id":65622,"depth":254,"text":65625,"children":66999},[67000],{"id":65790,"depth":279,"text":65793},"content:ckeefer:2013-1:misc.md","ckeefer/2013-1/misc.md","ckeefer/2013-1/misc",{"user":3518,"name":3519},{"_path":67006,"_dir":67007,"_draft":7,"_partial":7,"_locale":8,"title":67008,"description":67009,"publishDate":67010,"tags":67011,"excerpt":67009,"body":67013,"_type":3511,"_id":69095,"_source":3513,"_file":69096,"_stem":69097,"_extension":3516,"author":69098},"/ckeefer/2013-08/fullproof-fulltext-search","2013-08","Client-side Fulltext Searching with Fullproof","Recently, I was engaged in a genial argument with a friend of an older generation, each of us taking an opposing stance on some obscure trivia neither of us was entirely certain about - but which we were both ready to defend with all the wit and rhetoric at our disposal. When we had finally exhausted all attempts to make the other budge on the matter, we turned to an authoritative 3rd-party source to lay the matter to rest for us - a Google search.","2013-08-29",[67012,62833],"search",{"type":18,"children":67014,"toc":69089},[67015,67019,67032,67037,67060,67072,67077,67085,67090,67121,67127,67132,67208,67214,67219,67294,67299,67304,67736,67749,68128,68133,68391,68396,68420,68433,68439,68444,69067,69080,69085],{"type":21,"tag":22,"props":67016,"children":67017},{},[67018],{"type":26,"value":67009},{"type":21,"tag":22,"props":67020,"children":67021},{},[67022,67024,67031],{"type":26,"value":67023},"What else? My friend had a shelf full of encyclopedias, but it didn't occur to either of us to consult them when the answer was a 3-second search away. We've come to take that near-instantaneous access to information for granted in most contexts, and we feel annoyed or confused when we don't have access to it. Many well-designed, content-heavy sites will have similar search functionality to help users quickly navigate to whatever they're looking for; but generally, this relies on either a 3rd-party service (like Google), or else delegates the full-text searching to the backend (the database, or a specialized search server like ",{"type":21,"tag":29,"props":67025,"children":67028},{"href":67026,"rel":67027},"http://lucene.apache.org/solr/",[93],[67029],{"type":26,"value":67030},"SOLR",{"type":26,"value":2699},{"type":21,"tag":22,"props":67033,"children":67034},{},[67035],{"type":26,"value":67036},"This is usually the best way to go about this - but what if you have an application that's expected to provide this sort of search functionality when offline (either temporarily, or intended for always-offline)?",{"type":21,"tag":22,"props":67038,"children":67039},{},[67040,67042,67049,67051,67058],{"type":26,"value":67041},"It is here that ",{"type":21,"tag":29,"props":67043,"children":67046},{"href":67044,"rel":67045},"http://reyesr.github.io/fullproof/",[93],[67047],{"type":26,"value":67048},"Fullproof",{"type":26,"value":67050}," comes into its own. I discovered this JavaScript library while working on a complex, web-based user guide that needed to be offline-only. Its contents would come from an easily-updatable (either by us or by the client) XML file, which we would transform into HTML via ",{"type":21,"tag":29,"props":67052,"children":67055},{"href":67053,"rel":67054},"http://www.w3.org/TR/xslt",[93],[67056],{"type":26,"value":67057},"XSLT",{"type":26,"value":67059}," (the subject of a future post, perhaps), and then style and interact programmatically with via CSS and JavaScript, as per usual.",{"type":21,"tag":22,"props":67061,"children":67062},{},[67063,67065,67070],{"type":26,"value":67064},"One requirement was that we be able to perform full-text searching on the user guide. The ugly-hack approach to this might involve regex's or all sorts of data- ",{"type":21,"tag":1084,"props":67066,"children":67067},{},[67068],{"type":26,"value":67069},"tags strewn throughout the document. Neither of these would be good solutions under most circumstances - even a complicated regex (and they can get very complicated, very quickly) isn't going to offer you results for mild mispellings or near-matches, and will potentially make supporting unicode a nightmare; and sprinkling data-",{"type":26,"value":67071}," tags throughout your markup to indicate areas of interest is highly limited and clutters your markup.",{"type":21,"tag":22,"props":67073,"children":67074},{},[67075],{"type":26,"value":67076},"We needed a real search engine - one that can parse and normalize our text, and offer us scoring engines that can catch misspellings and near-matches. Consider the following example (from fullproof's home page):",{"type":21,"tag":22,"props":67078,"children":67079},{},[67080],{"type":21,"tag":8920,"props":67081,"children":67084},{"alt":67082,"src":67083,"title":67082},"Software screen capture","assets/images/sc-mame.png",[],{"type":21,"tag":22,"props":67086,"children":67087},{},[67088],{"type":26,"value":67089},"Searching MAME Roms with match scoring - we get our results in a ranked order that can be controlled to a degree via what indexes we instantiate.",{"type":21,"tag":22,"props":67091,"children":67092},{},[67093,67095,67102,67104,67111,67112,67119],{"type":26,"value":67094},"The Fullproof github page includes a ",{"type":21,"tag":29,"props":67096,"children":67099},{"href":67097,"rel":67098},"http://reyesr.github.io/fullproof/tutorial.html",[93],[67100],{"type":26,"value":67101},"capable tutorial",{"type":26,"value":67103},", the contents of which we won't duplicate here - I suggest you go give it a look, along with the ",{"type":21,"tag":29,"props":67105,"children":67108},{"href":67106,"rel":67107},"https://github.com/reyesr/fullproof/wiki/_pages",[93],[67109],{"type":26,"value":67110},"supporting",{"type":26,"value":12776},{"type":21,"tag":29,"props":67113,"children":67116},{"href":67114,"rel":67115},"http://reyesr.github.io/fullproof/jsdocs/index.html",[93],[67117],{"type":26,"value":67118},"documentation",{"type":26,"value":67120},". Instead, let's look at some specifics regarding setup, and pitfalls encountered when trying to employ fullproof.",{"type":21,"tag":193,"props":67122,"children":67124},{"id":67123},"where-is-the-data-coming-from",[67125],{"type":26,"value":67126},"Where is the data coming from?",{"type":21,"tag":22,"props":67128,"children":67129},{},[67130],{"type":26,"value":67131},"One of the first hurdles for one expecting the full-suite treatment performing fulltext searches on a database is that fullproof isn't a document management system (as it notes at the top of its github page). It ONLY searches - you'll need to figure out how to feed it the data you want it to work with. My suggestion is that you have precomposed data available in some form, rather than scraping your page(s) at runtime. In our case, because we're pulling data from XML in the first place, we can restructure that content into JSON and slap it into our page as static data in a script element, to be pulled back out and fed to Fullproof when appropriate. Something like:",{"type":21,"tag":200,"props":67133,"children":67135},{"className":9044,"code":67134,"language":9046,"meta":8,"style":8},"this.gContent = \n    $('script[type=\"text/JSON\"]')\n[0].innerHTML(); // Our guide content\n",[67136],{"type":21,"tag":63,"props":67137,"children":67138},{"__ignoreMap":8},[67139,67159,67179],{"type":21,"tag":209,"props":67140,"children":67141},{"class":211,"line":212},[67142,67146,67151,67155],{"type":21,"tag":209,"props":67143,"children":67144},{"style":263},[67145],{"type":26,"value":2508},{"type":21,"tag":209,"props":67147,"children":67148},{"style":222},[67149],{"type":26,"value":67150},".gContent ",{"type":21,"tag":209,"props":67152,"children":67153},{"style":216},[67154],{"type":26,"value":1432},{"type":21,"tag":209,"props":67156,"children":67157},{"style":222},[67158],{"type":26,"value":25950},{"type":21,"tag":209,"props":67160,"children":67161},{"class":211,"line":244},[67162,67166,67170,67175],{"type":21,"tag":209,"props":67163,"children":67164},{"style":360},[67165],{"type":26,"value":52882},{"type":21,"tag":209,"props":67167,"children":67168},{"style":222},[67169],{"type":26,"value":368},{"type":21,"tag":209,"props":67171,"children":67172},{"style":233},[67173],{"type":26,"value":67174},"'script[type=\"text/JSON\"]'",{"type":21,"tag":209,"props":67176,"children":67177},{"style":222},[67178],{"type":26,"value":10112},{"type":21,"tag":209,"props":67180,"children":67181},{"class":211,"line":254},[67182,67186,67190,67194,67199,67203],{"type":21,"tag":209,"props":67183,"children":67184},{"style":222},[67185],{"type":26,"value":29977},{"type":21,"tag":209,"props":67187,"children":67188},{"style":263},[67189],{"type":26,"value":6048},{"type":21,"tag":209,"props":67191,"children":67192},{"style":222},[67193],{"type":26,"value":54820},{"type":21,"tag":209,"props":67195,"children":67196},{"style":360},[67197],{"type":26,"value":67198},"innerHTML",{"type":21,"tag":209,"props":67200,"children":67201},{"style":222},[67202],{"type":26,"value":38473},{"type":21,"tag":209,"props":67204,"children":67205},{"style":448},[67206],{"type":26,"value":67207},"// Our guide content\n",{"type":21,"tag":3549,"props":67209,"children":67211},{"id":67210},"start-the-engine",[67212],{"type":26,"value":67213},"Start the Engine",{"type":21,"tag":22,"props":67215,"children":67216},{},[67217],{"type":26,"value":67218},"We'll then initialize our engine and its indexes. This was the major stumbling block at first, particularly because we're opening a file on the local file system (which leads to all sort of security complications). We need to eschew the HTML5 options fullproof supports and make do with memory-based storage.",{"type":21,"tag":200,"props":67220,"children":67222},{"className":9044,"code":67221,"language":9046,"meta":8,"style":8},"this.engine = new fullproof.ScoringEngine(\n        [new fullproof.StoreDescriptor(\"memorystore\", fullproof.store.MemoryStore)]);\n",[67223],{"type":21,"tag":63,"props":67224,"children":67225},{"__ignoreMap":8},[67226,67260],{"type":21,"tag":209,"props":67227,"children":67228},{"class":211,"line":212},[67229,67233,67238,67242,67246,67251,67256],{"type":21,"tag":209,"props":67230,"children":67231},{"style":263},[67232],{"type":26,"value":2508},{"type":21,"tag":209,"props":67234,"children":67235},{"style":222},[67236],{"type":26,"value":67237},".engine ",{"type":21,"tag":209,"props":67239,"children":67240},{"style":216},[67241],{"type":26,"value":1432},{"type":21,"tag":209,"props":67243,"children":67244},{"style":216},[67245],{"type":26,"value":4667},{"type":21,"tag":209,"props":67247,"children":67248},{"style":222},[67249],{"type":26,"value":67250}," fullproof.",{"type":21,"tag":209,"props":67252,"children":67253},{"style":360},[67254],{"type":26,"value":67255},"ScoringEngine",{"type":21,"tag":209,"props":67257,"children":67258},{"style":222},[67259],{"type":26,"value":11597},{"type":21,"tag":209,"props":67261,"children":67262},{"class":211,"line":244},[67263,67267,67271,67275,67280,67284,67289],{"type":21,"tag":209,"props":67264,"children":67265},{"style":222},[67266],{"type":26,"value":2275},{"type":21,"tag":209,"props":67268,"children":67269},{"style":216},[67270],{"type":26,"value":21569},{"type":21,"tag":209,"props":67272,"children":67273},{"style":222},[67274],{"type":26,"value":67250},{"type":21,"tag":209,"props":67276,"children":67277},{"style":360},[67278],{"type":26,"value":67279},"StoreDescriptor",{"type":21,"tag":209,"props":67281,"children":67282},{"style":222},[67283],{"type":26,"value":368},{"type":21,"tag":209,"props":67285,"children":67286},{"style":233},[67287],{"type":26,"value":67288},"\"memorystore\"",{"type":21,"tag":209,"props":67290,"children":67291},{"style":222},[67292],{"type":26,"value":67293},", fullproof.store.MemoryStore)]);\n",{"type":21,"tag":22,"props":67295,"children":67296},{},[67297],{"type":26,"value":67298},"If we try to use WebSQL (which isn't supported by IE or Firefox), we'll run into a security exception in Chrome (possibly other webkit-based browsers as well, although I didn't have opportunity to test them). Same story for indexedDB for Firefox and Chrome (Chrome will complain about same domain problems when loading our xsl as well, which is why we have to statically compile our html output of the XSLT transform for that browser - as noted, a topic for another post).",{"type":21,"tag":22,"props":67300,"children":67301},{},[67302],{"type":26,"value":67303},"Now, we can instantiate our indexes. The fullproof tutorial notes that any number of indexes are specifiable, and the search engine will fall back through them in the specified order when attempting to fulfill a search. Thus, we specify the least altered/aggresive index first (just removing diacriticals and repeated letters), and then make a stemmed index (metaphone).",{"type":21,"tag":200,"props":67305,"children":67307},{"className":9044,"code":67306,"language":9046,"meta":8,"style":8},"this.indexes = [\n        {\n            name:\"normalIndex\",\n            analyzer:new fullproof.ScoringAnalyzer(fullproof.normalizer.to_lowercase_nomark,\n                fullproof.normalizer.remove_duplicate_letters),\n            capabilities:new fullproof.Capabilities().setStoreObjects(false).setUseScores(true)\n                .setDbName(this.dbName).setComparatorObject(fullproof.ScoredEntry.comparatorObject),\n            initializer:function(injector, callback){that.initIndexes(injector, callback, that.gContent);}\n        },\n        {\n            name:\"stemmedIndex\",\n            analyzer:new fullproof.ScoringAnalyzer(fullproof.normalizer.to_lowercase_nomark,\n                fullproof.english.metaphone),\n            capabilities:new fullproof.Capabilities().setStoreObjects(false).setUseScores(true)\n                .setDbName(this.dbName).setComparatorObject(fullproof.ScoredEntry.comparatorObject),\n            initializer:function(injector, callback){that.initIndexes(injector, callback, that.gContent);}\n        }\n    ];\n",[67308],{"type":21,"tag":63,"props":67309,"children":67310},{"__ignoreMap":8},[67311,67331,67338,67355,67381,67389,67448,67484,67532,67539,67546,67562,67585,67593,67648,67679,67722,67729],{"type":21,"tag":209,"props":67312,"children":67313},{"class":211,"line":212},[67314,67318,67323,67327],{"type":21,"tag":209,"props":67315,"children":67316},{"style":263},[67317],{"type":26,"value":2508},{"type":21,"tag":209,"props":67319,"children":67320},{"style":222},[67321],{"type":26,"value":67322},".indexes ",{"type":21,"tag":209,"props":67324,"children":67325},{"style":216},[67326],{"type":26,"value":1432},{"type":21,"tag":209,"props":67328,"children":67329},{"style":222},[67330],{"type":26,"value":10170},{"type":21,"tag":209,"props":67332,"children":67333},{"class":211,"line":244},[67334],{"type":21,"tag":209,"props":67335,"children":67336},{"style":222},[67337],{"type":26,"value":7561},{"type":21,"tag":209,"props":67339,"children":67340},{"class":211,"line":254},[67341,67346,67351],{"type":21,"tag":209,"props":67342,"children":67343},{"style":222},[67344],{"type":26,"value":67345},"            name:",{"type":21,"tag":209,"props":67347,"children":67348},{"style":233},[67349],{"type":26,"value":67350},"\"normalIndex\"",{"type":21,"tag":209,"props":67352,"children":67353},{"style":222},[67354],{"type":26,"value":304},{"type":21,"tag":209,"props":67356,"children":67357},{"class":211,"line":279},[67358,67363,67367,67371,67376],{"type":21,"tag":209,"props":67359,"children":67360},{"style":222},[67361],{"type":26,"value":67362},"            analyzer:",{"type":21,"tag":209,"props":67364,"children":67365},{"style":216},[67366],{"type":26,"value":21569},{"type":21,"tag":209,"props":67368,"children":67369},{"style":222},[67370],{"type":26,"value":67250},{"type":21,"tag":209,"props":67372,"children":67373},{"style":360},[67374],{"type":26,"value":67375},"ScoringAnalyzer",{"type":21,"tag":209,"props":67377,"children":67378},{"style":222},[67379],{"type":26,"value":67380},"(fullproof.normalizer.to_lowercase_nomark,\n",{"type":21,"tag":209,"props":67382,"children":67383},{"class":211,"line":288},[67384],{"type":21,"tag":209,"props":67385,"children":67386},{"style":222},[67387],{"type":26,"value":67388},"                fullproof.normalizer.remove_duplicate_letters),\n",{"type":21,"tag":209,"props":67390,"children":67391},{"class":211,"line":307},[67392,67397,67401,67405,67410,67414,67419,67423,67427,67431,67436,67440,67444],{"type":21,"tag":209,"props":67393,"children":67394},{"style":222},[67395],{"type":26,"value":67396},"            capabilities:",{"type":21,"tag":209,"props":67398,"children":67399},{"style":216},[67400],{"type":26,"value":21569},{"type":21,"tag":209,"props":67402,"children":67403},{"style":222},[67404],{"type":26,"value":67250},{"type":21,"tag":209,"props":67406,"children":67407},{"style":360},[67408],{"type":26,"value":67409},"Capabilities",{"type":21,"tag":209,"props":67411,"children":67412},{"style":222},[67413],{"type":26,"value":11910},{"type":21,"tag":209,"props":67415,"children":67416},{"style":360},[67417],{"type":26,"value":67418},"setStoreObjects",{"type":21,"tag":209,"props":67420,"children":67421},{"style":222},[67422],{"type":26,"value":368},{"type":21,"tag":209,"props":67424,"children":67425},{"style":263},[67426],{"type":26,"value":27598},{"type":21,"tag":209,"props":67428,"children":67429},{"style":222},[67430],{"type":26,"value":2699},{"type":21,"tag":209,"props":67432,"children":67433},{"style":360},[67434],{"type":26,"value":67435},"setUseScores",{"type":21,"tag":209,"props":67437,"children":67438},{"style":222},[67439],{"type":26,"value":368},{"type":21,"tag":209,"props":67441,"children":67442},{"style":263},[67443],{"type":26,"value":2223},{"type":21,"tag":209,"props":67445,"children":67446},{"style":222},[67447],{"type":26,"value":10112},{"type":21,"tag":209,"props":67449,"children":67450},{"class":211,"line":325},[67451,67456,67461,67465,67469,67474,67479],{"type":21,"tag":209,"props":67452,"children":67453},{"style":222},[67454],{"type":26,"value":67455},"                .",{"type":21,"tag":209,"props":67457,"children":67458},{"style":360},[67459],{"type":26,"value":67460},"setDbName",{"type":21,"tag":209,"props":67462,"children":67463},{"style":222},[67464],{"type":26,"value":368},{"type":21,"tag":209,"props":67466,"children":67467},{"style":263},[67468],{"type":26,"value":2508},{"type":21,"tag":209,"props":67470,"children":67471},{"style":222},[67472],{"type":26,"value":67473},".dbName).",{"type":21,"tag":209,"props":67475,"children":67476},{"style":360},[67477],{"type":26,"value":67478},"setComparatorObject",{"type":21,"tag":209,"props":67480,"children":67481},{"style":222},[67482],{"type":26,"value":67483},"(fullproof.ScoredEntry.comparatorObject),\n",{"type":21,"tag":209,"props":67485,"children":67486},{"class":211,"line":334},[67487,67492,67496,67500,67504,67509,67513,67517,67522,67527],{"type":21,"tag":209,"props":67488,"children":67489},{"style":360},[67490],{"type":26,"value":67491},"            initializer",{"type":21,"tag":209,"props":67493,"children":67494},{"style":222},[67495],{"type":26,"value":191},{"type":21,"tag":209,"props":67497,"children":67498},{"style":216},[67499],{"type":26,"value":5370},{"type":21,"tag":209,"props":67501,"children":67502},{"style":222},[67503],{"type":26,"value":368},{"type":21,"tag":209,"props":67505,"children":67506},{"style":400},[67507],{"type":26,"value":67508},"injector",{"type":21,"tag":209,"props":67510,"children":67511},{"style":222},[67512],{"type":26,"value":408},{"type":21,"tag":209,"props":67514,"children":67515},{"style":400},[67516],{"type":26,"value":36323},{"type":21,"tag":209,"props":67518,"children":67519},{"style":222},[67520],{"type":26,"value":67521},"){that.",{"type":21,"tag":209,"props":67523,"children":67524},{"style":360},[67525],{"type":26,"value":67526},"initIndexes",{"type":21,"tag":209,"props":67528,"children":67529},{"style":222},[67530],{"type":26,"value":67531},"(injector, callback, that.gContent);}\n",{"type":21,"tag":209,"props":67533,"children":67534},{"class":211,"line":343},[67535],{"type":21,"tag":209,"props":67536,"children":67537},{"style":222},[67538],{"type":26,"value":2522},{"type":21,"tag":209,"props":67540,"children":67541},{"class":211,"line":351},[67542],{"type":21,"tag":209,"props":67543,"children":67544},{"style":222},[67545],{"type":26,"value":7561},{"type":21,"tag":209,"props":67547,"children":67548},{"class":211,"line":444},[67549,67553,67558],{"type":21,"tag":209,"props":67550,"children":67551},{"style":222},[67552],{"type":26,"value":67345},{"type":21,"tag":209,"props":67554,"children":67555},{"style":233},[67556],{"type":26,"value":67557},"\"stemmedIndex\"",{"type":21,"tag":209,"props":67559,"children":67560},{"style":222},[67561],{"type":26,"value":304},{"type":21,"tag":209,"props":67563,"children":67564},{"class":211,"line":454},[67565,67569,67573,67577,67581],{"type":21,"tag":209,"props":67566,"children":67567},{"style":222},[67568],{"type":26,"value":67362},{"type":21,"tag":209,"props":67570,"children":67571},{"style":216},[67572],{"type":26,"value":21569},{"type":21,"tag":209,"props":67574,"children":67575},{"style":222},[67576],{"type":26,"value":67250},{"type":21,"tag":209,"props":67578,"children":67579},{"style":360},[67580],{"type":26,"value":67375},{"type":21,"tag":209,"props":67582,"children":67583},{"style":222},[67584],{"type":26,"value":67380},{"type":21,"tag":209,"props":67586,"children":67587},{"class":211,"line":463},[67588],{"type":21,"tag":209,"props":67589,"children":67590},{"style":222},[67591],{"type":26,"value":67592},"                fullproof.english.metaphone),\n",{"type":21,"tag":209,"props":67594,"children":67595},{"class":211,"line":472},[67596,67600,67604,67608,67612,67616,67620,67624,67628,67632,67636,67640,67644],{"type":21,"tag":209,"props":67597,"children":67598},{"style":222},[67599],{"type":26,"value":67396},{"type":21,"tag":209,"props":67601,"children":67602},{"style":216},[67603],{"type":26,"value":21569},{"type":21,"tag":209,"props":67605,"children":67606},{"style":222},[67607],{"type":26,"value":67250},{"type":21,"tag":209,"props":67609,"children":67610},{"style":360},[67611],{"type":26,"value":67409},{"type":21,"tag":209,"props":67613,"children":67614},{"style":222},[67615],{"type":26,"value":11910},{"type":21,"tag":209,"props":67617,"children":67618},{"style":360},[67619],{"type":26,"value":67418},{"type":21,"tag":209,"props":67621,"children":67622},{"style":222},[67623],{"type":26,"value":368},{"type":21,"tag":209,"props":67625,"children":67626},{"style":263},[67627],{"type":26,"value":27598},{"type":21,"tag":209,"props":67629,"children":67630},{"style":222},[67631],{"type":26,"value":2699},{"type":21,"tag":209,"props":67633,"children":67634},{"style":360},[67635],{"type":26,"value":67435},{"type":21,"tag":209,"props":67637,"children":67638},{"style":222},[67639],{"type":26,"value":368},{"type":21,"tag":209,"props":67641,"children":67642},{"style":263},[67643],{"type":26,"value":2223},{"type":21,"tag":209,"props":67645,"children":67646},{"style":222},[67647],{"type":26,"value":10112},{"type":21,"tag":209,"props":67649,"children":67650},{"class":211,"line":480},[67651,67655,67659,67663,67667,67671,67675],{"type":21,"tag":209,"props":67652,"children":67653},{"style":222},[67654],{"type":26,"value":67455},{"type":21,"tag":209,"props":67656,"children":67657},{"style":360},[67658],{"type":26,"value":67460},{"type":21,"tag":209,"props":67660,"children":67661},{"style":222},[67662],{"type":26,"value":368},{"type":21,"tag":209,"props":67664,"children":67665},{"style":263},[67666],{"type":26,"value":2508},{"type":21,"tag":209,"props":67668,"children":67669},{"style":222},[67670],{"type":26,"value":67473},{"type":21,"tag":209,"props":67672,"children":67673},{"style":360},[67674],{"type":26,"value":67478},{"type":21,"tag":209,"props":67676,"children":67677},{"style":222},[67678],{"type":26,"value":67483},{"type":21,"tag":209,"props":67680,"children":67681},{"class":211,"line":489},[67682,67686,67690,67694,67698,67702,67706,67710,67714,67718],{"type":21,"tag":209,"props":67683,"children":67684},{"style":360},[67685],{"type":26,"value":67491},{"type":21,"tag":209,"props":67687,"children":67688},{"style":222},[67689],{"type":26,"value":191},{"type":21,"tag":209,"props":67691,"children":67692},{"style":216},[67693],{"type":26,"value":5370},{"type":21,"tag":209,"props":67695,"children":67696},{"style":222},[67697],{"type":26,"value":368},{"type":21,"tag":209,"props":67699,"children":67700},{"style":400},[67701],{"type":26,"value":67508},{"type":21,"tag":209,"props":67703,"children":67704},{"style":222},[67705],{"type":26,"value":408},{"type":21,"tag":209,"props":67707,"children":67708},{"style":400},[67709],{"type":26,"value":36323},{"type":21,"tag":209,"props":67711,"children":67712},{"style":222},[67713],{"type":26,"value":67521},{"type":21,"tag":209,"props":67715,"children":67716},{"style":360},[67717],{"type":26,"value":67526},{"type":21,"tag":209,"props":67719,"children":67720},{"style":222},[67721],{"type":26,"value":67531},{"type":21,"tag":209,"props":67723,"children":67724},{"class":211,"line":847},[67725],{"type":21,"tag":209,"props":67726,"children":67727},{"style":222},[67728],{"type":26,"value":2235},{"type":21,"tag":209,"props":67730,"children":67731},{"class":211,"line":860},[67732],{"type":21,"tag":209,"props":67733,"children":67734},{"style":222},[67735],{"type":26,"value":11461},{"type":21,"tag":22,"props":67737,"children":67738},{},[67739,67741,67747],{"type":26,"value":67740},"You'll notice the calls to ",{"type":21,"tag":63,"props":67742,"children":67744},{"className":67743},[],[67745],{"type":26,"value":67746},"that.initIndexes",{"type":26,"value":67748}," this is our initializer function that actually 'injects' our data into the search engine index.",{"type":21,"tag":200,"props":67750,"children":67752},{"className":9044,"code":67751,"language":9046,"meta":8,"style":8},"/**\n * Initialize index(es).\n * @method initIndexes\n * @param {Object} injector Provided by index.\n * @param {Function} callback Function to call when indexes are finished initializing.\n * @param {Object} gContent Guide content to inject.\n * @param {Number} indexLength Number of indexes we're initializing.\n */\nASearch.prototype.initIndexes = function(injector, callback, gContent){\n    var that = this;\n    var synchro = fullproof.make_synchro_point(callback, gContent.length);\n    for (var i=0, len = gContent.length; i < len; i++)\n    {\n        injector.inject(gContent[i].text, i, synchro);\n    }\n\n};\n",[67753],{"type":21,"tag":63,"props":67754,"children":67755},{"__ignoreMap":8},[67756,67763,67771,67787,67813,67839,67864,67889,67896,67957,67980,68018,68082,68089,68107,68114,68121],{"type":21,"tag":209,"props":67757,"children":67758},{"class":211,"line":212},[67759],{"type":21,"tag":209,"props":67760,"children":67761},{"style":448},[67762],{"type":26,"value":731},{"type":21,"tag":209,"props":67764,"children":67765},{"class":211,"line":244},[67766],{"type":21,"tag":209,"props":67767,"children":67768},{"style":448},[67769],{"type":26,"value":67770}," * Initialize index(es).\n",{"type":21,"tag":209,"props":67772,"children":67773},{"class":211,"line":254},[67774,67778,67782],{"type":21,"tag":209,"props":67775,"children":67776},{"style":448},[67777],{"type":26,"value":11233},{"type":21,"tag":209,"props":67779,"children":67780},{"style":216},[67781],{"type":26,"value":31083},{"type":21,"tag":209,"props":67783,"children":67784},{"style":360},[67785],{"type":26,"value":67786}," initIndexes\n",{"type":21,"tag":209,"props":67788,"children":67789},{"class":211,"line":279},[67790,67794,67798,67803,67808],{"type":21,"tag":209,"props":67791,"children":67792},{"style":448},[67793],{"type":26,"value":11233},{"type":21,"tag":209,"props":67795,"children":67796},{"style":216},[67797],{"type":26,"value":4718},{"type":21,"tag":209,"props":67799,"children":67800},{"style":360},[67801],{"type":26,"value":67802}," {Object}",{"type":21,"tag":209,"props":67804,"children":67805},{"style":222},[67806],{"type":26,"value":67807}," injector",{"type":21,"tag":209,"props":67809,"children":67810},{"style":448},[67811],{"type":26,"value":67812}," Provided by index.\n",{"type":21,"tag":209,"props":67814,"children":67815},{"class":211,"line":288},[67816,67820,67824,67829,67834],{"type":21,"tag":209,"props":67817,"children":67818},{"style":448},[67819],{"type":26,"value":11233},{"type":21,"tag":209,"props":67821,"children":67822},{"style":216},[67823],{"type":26,"value":4718},{"type":21,"tag":209,"props":67825,"children":67826},{"style":360},[67827],{"type":26,"value":67828}," {Function}",{"type":21,"tag":209,"props":67830,"children":67831},{"style":222},[67832],{"type":26,"value":67833}," callback",{"type":21,"tag":209,"props":67835,"children":67836},{"style":448},[67837],{"type":26,"value":67838}," Function to call when indexes are finished initializing.\n",{"type":21,"tag":209,"props":67840,"children":67841},{"class":211,"line":307},[67842,67846,67850,67854,67859],{"type":21,"tag":209,"props":67843,"children":67844},{"style":448},[67845],{"type":26,"value":11233},{"type":21,"tag":209,"props":67847,"children":67848},{"style":216},[67849],{"type":26,"value":4718},{"type":21,"tag":209,"props":67851,"children":67852},{"style":360},[67853],{"type":26,"value":67802},{"type":21,"tag":209,"props":67855,"children":67856},{"style":222},[67857],{"type":26,"value":67858}," gContent",{"type":21,"tag":209,"props":67860,"children":67861},{"style":448},[67862],{"type":26,"value":67863}," Guide content to inject.\n",{"type":21,"tag":209,"props":67865,"children":67866},{"class":211,"line":325},[67867,67871,67875,67879,67884],{"type":21,"tag":209,"props":67868,"children":67869},{"style":448},[67870],{"type":26,"value":11233},{"type":21,"tag":209,"props":67872,"children":67873},{"style":216},[67874],{"type":26,"value":4718},{"type":21,"tag":209,"props":67876,"children":67877},{"style":360},[67878],{"type":26,"value":14089},{"type":21,"tag":209,"props":67880,"children":67881},{"style":222},[67882],{"type":26,"value":67883}," indexLength",{"type":21,"tag":209,"props":67885,"children":67886},{"style":448},[67887],{"type":26,"value":67888}," Number of indexes we're initializing.\n",{"type":21,"tag":209,"props":67890,"children":67891},{"class":211,"line":334},[67892],{"type":21,"tag":209,"props":67893,"children":67894},{"style":448},[67895],{"type":26,"value":755},{"type":21,"tag":209,"props":67897,"children":67898},{"class":211,"line":343},[67899,67904,67908,67912,67916,67920,67924,67928,67932,67936,67940,67944,67948,67953],{"type":21,"tag":209,"props":67900,"children":67901},{"style":263},[67902],{"type":26,"value":67903},"ASearch",{"type":21,"tag":209,"props":67905,"children":67906},{"style":222},[67907],{"type":26,"value":378},{"type":21,"tag":209,"props":67909,"children":67910},{"style":263},[67911],{"type":26,"value":37016},{"type":21,"tag":209,"props":67913,"children":67914},{"style":222},[67915],{"type":26,"value":378},{"type":21,"tag":209,"props":67917,"children":67918},{"style":360},[67919],{"type":26,"value":67526},{"type":21,"tag":209,"props":67921,"children":67922},{"style":216},[67923],{"type":26,"value":271},{"type":21,"tag":209,"props":67925,"children":67926},{"style":216},[67927],{"type":26,"value":4766},{"type":21,"tag":209,"props":67929,"children":67930},{"style":222},[67931],{"type":26,"value":368},{"type":21,"tag":209,"props":67933,"children":67934},{"style":400},[67935],{"type":26,"value":67508},{"type":21,"tag":209,"props":67937,"children":67938},{"style":222},[67939],{"type":26,"value":408},{"type":21,"tag":209,"props":67941,"children":67942},{"style":400},[67943],{"type":26,"value":36323},{"type":21,"tag":209,"props":67945,"children":67946},{"style":222},[67947],{"type":26,"value":408},{"type":21,"tag":209,"props":67949,"children":67950},{"style":400},[67951],{"type":26,"value":67952},"gContent",{"type":21,"tag":209,"props":67954,"children":67955},{"style":222},[67956],{"type":26,"value":2369},{"type":21,"tag":209,"props":67958,"children":67959},{"class":211,"line":351},[67960,67964,67968,67972,67976],{"type":21,"tag":209,"props":67961,"children":67962},{"style":216},[67963],{"type":26,"value":10405},{"type":21,"tag":209,"props":67965,"children":67966},{"style":222},[67967],{"type":26,"value":57248},{"type":21,"tag":209,"props":67969,"children":67970},{"style":216},[67971],{"type":26,"value":1432},{"type":21,"tag":209,"props":67973,"children":67974},{"style":263},[67975],{"type":26,"value":17698},{"type":21,"tag":209,"props":67977,"children":67978},{"style":222},[67979],{"type":26,"value":241},{"type":21,"tag":209,"props":67981,"children":67982},{"class":211,"line":444},[67983,67987,67992,67996,68000,68005,68010,68014],{"type":21,"tag":209,"props":67984,"children":67985},{"style":216},[67986],{"type":26,"value":10405},{"type":21,"tag":209,"props":67988,"children":67989},{"style":222},[67990],{"type":26,"value":67991}," synchro ",{"type":21,"tag":209,"props":67993,"children":67994},{"style":216},[67995],{"type":26,"value":1432},{"type":21,"tag":209,"props":67997,"children":67998},{"style":222},[67999],{"type":26,"value":67250},{"type":21,"tag":209,"props":68001,"children":68002},{"style":360},[68003],{"type":26,"value":68004},"make_synchro_point",{"type":21,"tag":209,"props":68006,"children":68007},{"style":222},[68008],{"type":26,"value":68009},"(callback, gContent.",{"type":21,"tag":209,"props":68011,"children":68012},{"style":263},[68013],{"type":26,"value":36467},{"type":21,"tag":209,"props":68015,"children":68016},{"style":222},[68017],{"type":26,"value":2608},{"type":21,"tag":209,"props":68019,"children":68020},{"class":211,"line":454},[68021,68025,68029,68033,68037,68041,68045,68049,68053,68058,68062,68066,68070,68074,68078],{"type":21,"tag":209,"props":68022,"children":68023},{"style":216},[68024],{"type":26,"value":55989},{"type":21,"tag":209,"props":68026,"children":68027},{"style":222},[68028],{"type":26,"value":4776},{"type":21,"tag":209,"props":68030,"children":68031},{"style":216},[68032],{"type":26,"value":8996},{"type":21,"tag":209,"props":68034,"children":68035},{"style":222},[68036],{"type":26,"value":36621},{"type":21,"tag":209,"props":68038,"children":68039},{"style":216},[68040],{"type":26,"value":1432},{"type":21,"tag":209,"props":68042,"children":68043},{"style":263},[68044],{"type":26,"value":6048},{"type":21,"tag":209,"props":68046,"children":68047},{"style":222},[68048],{"type":26,"value":56664},{"type":21,"tag":209,"props":68050,"children":68051},{"style":216},[68052],{"type":26,"value":1432},{"type":21,"tag":209,"props":68054,"children":68055},{"style":222},[68056],{"type":26,"value":68057}," gContent.",{"type":21,"tag":209,"props":68059,"children":68060},{"style":263},[68061],{"type":26,"value":36467},{"type":21,"tag":209,"props":68063,"children":68064},{"style":222},[68065],{"type":26,"value":36647},{"type":21,"tag":209,"props":68067,"children":68068},{"style":216},[68069],{"type":26,"value":36584},{"type":21,"tag":209,"props":68071,"children":68072},{"style":222},[68073],{"type":26,"value":57413},{"type":21,"tag":209,"props":68075,"children":68076},{"style":216},[68077],{"type":26,"value":36661},{"type":21,"tag":209,"props":68079,"children":68080},{"style":222},[68081],{"type":26,"value":10112},{"type":21,"tag":209,"props":68083,"children":68084},{"class":211,"line":463},[68085],{"type":21,"tag":209,"props":68086,"children":68087},{"style":222},[68088],{"type":26,"value":37029},{"type":21,"tag":209,"props":68090,"children":68091},{"class":211,"line":472},[68092,68097,68102],{"type":21,"tag":209,"props":68093,"children":68094},{"style":222},[68095],{"type":26,"value":68096},"        injector.",{"type":21,"tag":209,"props":68098,"children":68099},{"style":360},[68100],{"type":26,"value":68101},"inject",{"type":21,"tag":209,"props":68103,"children":68104},{"style":222},[68105],{"type":26,"value":68106},"(gContent[i].text, i, synchro);\n",{"type":21,"tag":209,"props":68108,"children":68109},{"class":211,"line":480},[68110],{"type":21,"tag":209,"props":68111,"children":68112},{"style":222},[68113],{"type":26,"value":331},{"type":21,"tag":209,"props":68115,"children":68116},{"class":211,"line":489},[68117],{"type":21,"tag":209,"props":68118,"children":68119},{"emptyLinePlaceholder":248},[68120],{"type":26,"value":251},{"type":21,"tag":209,"props":68122,"children":68123},{"class":211,"line":847},[68124],{"type":21,"tag":209,"props":68125,"children":68126},{"style":222},[68127],{"type":26,"value":340},{"type":21,"tag":22,"props":68129,"children":68130},{},[68131],{"type":26,"value":68132},"These injectors are, as noted, provided by the index in question, and are called when open the engine with the specified indexes, as below:",{"type":21,"tag":200,"props":68134,"children":68136},{"className":9044,"code":68135,"language":9046,"meta":8,"style":8},"try{\n    this.engine.open(this.indexes,\n        fullproof.make_callback(this.ready, true), fullproof.make_callback(this.ready, false));\n}catch(e)\n{\n    progress.find('.bar').addClass('bar-danger');\n    progress.find('p').text('Failed to open search indexes. Search not available.');\n    this.debug && console.log(e);\n}\n",[68137],{"type":21,"tag":63,"props":68138,"children":68139},{"__ignoreMap":8},[68140,68152,68181,68240,68257,68264,68307,68348,68384],{"type":21,"tag":209,"props":68141,"children":68142},{"class":211,"line":212},[68143,68148],{"type":21,"tag":209,"props":68144,"children":68145},{"style":216},[68146],{"type":26,"value":68147},"try",{"type":21,"tag":209,"props":68149,"children":68150},{"style":222},[68151],{"type":26,"value":7414},{"type":21,"tag":209,"props":68153,"children":68154},{"class":211,"line":244},[68155,68159,68164,68168,68172,68176],{"type":21,"tag":209,"props":68156,"children":68157},{"style":263},[68158],{"type":26,"value":51112},{"type":21,"tag":209,"props":68160,"children":68161},{"style":222},[68162],{"type":26,"value":68163},".engine.",{"type":21,"tag":209,"props":68165,"children":68166},{"style":360},[68167],{"type":26,"value":11610},{"type":21,"tag":209,"props":68169,"children":68170},{"style":222},[68171],{"type":26,"value":368},{"type":21,"tag":209,"props":68173,"children":68174},{"style":263},[68175],{"type":26,"value":2508},{"type":21,"tag":209,"props":68177,"children":68178},{"style":222},[68179],{"type":26,"value":68180},".indexes,\n",{"type":21,"tag":209,"props":68182,"children":68183},{"class":211,"line":254},[68184,68189,68194,68198,68202,68207,68211,68216,68220,68224,68228,68232,68236],{"type":21,"tag":209,"props":68185,"children":68186},{"style":222},[68187],{"type":26,"value":68188},"        fullproof.",{"type":21,"tag":209,"props":68190,"children":68191},{"style":360},[68192],{"type":26,"value":68193},"make_callback",{"type":21,"tag":209,"props":68195,"children":68196},{"style":222},[68197],{"type":26,"value":368},{"type":21,"tag":209,"props":68199,"children":68200},{"style":263},[68201],{"type":26,"value":2508},{"type":21,"tag":209,"props":68203,"children":68204},{"style":222},[68205],{"type":26,"value":68206},".ready, ",{"type":21,"tag":209,"props":68208,"children":68209},{"style":263},[68210],{"type":26,"value":2223},{"type":21,"tag":209,"props":68212,"children":68213},{"style":222},[68214],{"type":26,"value":68215},"), fullproof.",{"type":21,"tag":209,"props":68217,"children":68218},{"style":360},[68219],{"type":26,"value":68193},{"type":21,"tag":209,"props":68221,"children":68222},{"style":222},[68223],{"type":26,"value":368},{"type":21,"tag":209,"props":68225,"children":68226},{"style":263},[68227],{"type":26,"value":2508},{"type":21,"tag":209,"props":68229,"children":68230},{"style":222},[68231],{"type":26,"value":68206},{"type":21,"tag":209,"props":68233,"children":68234},{"style":263},[68235],{"type":26,"value":27598},{"type":21,"tag":209,"props":68237,"children":68238},{"style":222},[68239],{"type":26,"value":46554},{"type":21,"tag":209,"props":68241,"children":68242},{"class":211,"line":279},[68243,68248,68252],{"type":21,"tag":209,"props":68244,"children":68245},{"style":222},[68246],{"type":26,"value":68247},"}",{"type":21,"tag":209,"props":68249,"children":68250},{"style":216},[68251],{"type":26,"value":6823},{"type":21,"tag":209,"props":68253,"children":68254},{"style":222},[68255],{"type":26,"value":68256},"(e)\n",{"type":21,"tag":209,"props":68258,"children":68259},{"class":211,"line":288},[68260],{"type":21,"tag":209,"props":68261,"children":68262},{"style":222},[68263],{"type":26,"value":7414},{"type":21,"tag":209,"props":68265,"children":68266},{"class":211,"line":307},[68267,68272,68276,68280,68285,68289,68294,68298,68303],{"type":21,"tag":209,"props":68268,"children":68269},{"style":222},[68270],{"type":26,"value":68271},"    progress.",{"type":21,"tag":209,"props":68273,"children":68274},{"style":360},[68275],{"type":26,"value":50121},{"type":21,"tag":209,"props":68277,"children":68278},{"style":222},[68279],{"type":26,"value":368},{"type":21,"tag":209,"props":68281,"children":68282},{"style":233},[68283],{"type":26,"value":68284},"'.bar'",{"type":21,"tag":209,"props":68286,"children":68287},{"style":222},[68288],{"type":26,"value":2699},{"type":21,"tag":209,"props":68290,"children":68291},{"style":360},[68292],{"type":26,"value":68293},"addClass",{"type":21,"tag":209,"props":68295,"children":68296},{"style":222},[68297],{"type":26,"value":368},{"type":21,"tag":209,"props":68299,"children":68300},{"style":233},[68301],{"type":26,"value":68302},"'bar-danger'",{"type":21,"tag":209,"props":68304,"children":68305},{"style":222},[68306],{"type":26,"value":2608},{"type":21,"tag":209,"props":68308,"children":68309},{"class":211,"line":325},[68310,68314,68318,68322,68327,68331,68335,68339,68344],{"type":21,"tag":209,"props":68311,"children":68312},{"style":222},[68313],{"type":26,"value":68271},{"type":21,"tag":209,"props":68315,"children":68316},{"style":360},[68317],{"type":26,"value":50121},{"type":21,"tag":209,"props":68319,"children":68320},{"style":222},[68321],{"type":26,"value":368},{"type":21,"tag":209,"props":68323,"children":68324},{"style":233},[68325],{"type":26,"value":68326},"'p'",{"type":21,"tag":209,"props":68328,"children":68329},{"style":222},[68330],{"type":26,"value":2699},{"type":21,"tag":209,"props":68332,"children":68333},{"style":360},[68334],{"type":26,"value":26},{"type":21,"tag":209,"props":68336,"children":68337},{"style":222},[68338],{"type":26,"value":368},{"type":21,"tag":209,"props":68340,"children":68341},{"style":233},[68342],{"type":26,"value":68343},"'Failed to open search indexes. Search not available.'",{"type":21,"tag":209,"props":68345,"children":68346},{"style":222},[68347],{"type":26,"value":2608},{"type":21,"tag":209,"props":68349,"children":68350},{"class":211,"line":334},[68351,68355,68359,68363,68367,68371,68376,68380],{"type":21,"tag":209,"props":68352,"children":68353},{"style":263},[68354],{"type":26,"value":51112},{"type":21,"tag":209,"props":68356,"children":68357},{"style":222},[68358],{"type":26,"value":64916},{"type":21,"tag":209,"props":68360,"children":68361},{"style":216},[68362],{"type":26,"value":36584},{"type":21,"tag":209,"props":68364,"children":68365},{"style":222},[68366],{"type":26,"value":57809},{"type":21,"tag":209,"props":68368,"children":68369},{"style":216},[68370],{"type":26,"value":36584},{"type":21,"tag":209,"props":68372,"children":68373},{"style":222},[68374],{"type":26,"value":68375},"amp; console.",{"type":21,"tag":209,"props":68377,"children":68378},{"style":360},[68379],{"type":26,"value":1059},{"type":21,"tag":209,"props":68381,"children":68382},{"style":222},[68383],{"type":26,"value":30925},{"type":21,"tag":209,"props":68385,"children":68386},{"class":211,"line":343},[68387],{"type":21,"tag":209,"props":68388,"children":68389},{"style":222},[68390],{"type":26,"value":7798},{"type":21,"tag":22,"props":68392,"children":68393},{},[68394],{"type":26,"value":68395},"You'll notice we have this set up in a try-catch block - fullproof with throw an exception if the engine fails to open, which we can then (hopefully) use to debug the problem, or provide some meaningful error message for the user.",{"type":21,"tag":4462,"props":68397,"children":68398},{},[68399],{"type":21,"tag":22,"props":68400,"children":68401},{},[68402,68404,68410,68412,68418],{"type":26,"value":68403},"An aside: If you're curious about ",{"type":21,"tag":63,"props":68405,"children":68407},{"className":68406},[],[68408],{"type":26,"value":68409},"this.debug && console.log(e);",{"type":26,"value":68411},", this is simply a convenient way of toggling logging on and off at a single point, without needing to go through your code and route all of the console.log calls out. Instead, you simply set ",{"type":21,"tag":63,"props":68413,"children":68415},{"className":68414},[],[68416],{"type":26,"value":68417},"this.debug",{"type":26,"value":68419}," to false, and those console.log calls will never be made.",{"type":21,"tag":22,"props":68421,"children":68422},{},[68423,68425,68431],{"type":26,"value":68424},"You'll notice we've specified two callbacks, each to the same function (",{"type":21,"tag":63,"props":68426,"children":68428},{"className":68427},[],[68429],{"type":26,"value":68430},"this.ready",{"type":26,"value":68432},") passing true in the case of success, and false in the case of failure. In our code, this simply sets the search side panel to available, and enables the search button and field if true is passed, or displays a user-friendly error message otherwise. It would be in this callback function that you'd do whatever is needed to mark for your app that search is now ready to go.",{"type":21,"tag":193,"props":68434,"children":68436},{"id":68435},"things-are-looking-up",[68437],{"type":26,"value":68438},"Things are looking up",{"type":21,"tag":22,"props":68440,"children":68441},{},[68442],{"type":26,"value":68443},"Finally, for the sake of completeness, let's take a quick look at what a (stripped-down) version of the actual lookup is like.",{"type":21,"tag":200,"props":68445,"children":68447},{"className":9044,"code":68446,"language":9046,"meta":8,"style":8},"this.engine.lookup(value, function(resultSet){\n    if (!resultSet || !resultSet.getSize())\n    {\n        that.debug && console.log("No Results Found.");\n        return;\n    }\n// Higher scoring items should be displayed first\nresultSet.setComparatorObject({\n    lower_than: function(a,b) {\n        return a.score > b.score;\n    },\n    equals: function(a,b) {\n        return a.score === b.score;\n    }\n});\n// Filter for unique values in resultSet\nvar values = [],\n    len = resultSet.data.length;\nwhile(len--)\n{\n    (values.indexOf(resultSet.data[len].value) !== -1) ? resultSet.data.splice(len, 1) :\n        values.push(resultSet.data[len].value);\n}\n// For each result in the resultSet, create a direct link to the appropriate section, and\n// display a collapsible div showing context.\nresultSet.forEach(function(entry){\n    var result = that.gContent[entry.value];\n    // Create links, etc. here\n    that.debug && console.log(that.gContent[entry.value]);\n});\n\n});\n",[68448],{"type":21,"tag":63,"props":68449,"children":68450},{"__ignoreMap":8},[68451,68489,68532,68539,68589,68600,68607,68615,68630,68667,68688,68695,68731,68751,68758,68765,68773,68794,68819,68840,68847,68910,68927,68934,68942,68950,68982,69003,69011,69046,69053,69060],{"type":21,"tag":209,"props":68452,"children":68453},{"class":211,"line":212},[68454,68458,68462,68467,68472,68476,68480,68485],{"type":21,"tag":209,"props":68455,"children":68456},{"style":263},[68457],{"type":26,"value":2508},{"type":21,"tag":209,"props":68459,"children":68460},{"style":222},[68461],{"type":26,"value":68163},{"type":21,"tag":209,"props":68463,"children":68464},{"style":360},[68465],{"type":26,"value":68466},"lookup",{"type":21,"tag":209,"props":68468,"children":68469},{"style":222},[68470],{"type":26,"value":68471},"(value, ",{"type":21,"tag":209,"props":68473,"children":68474},{"style":216},[68475],{"type":26,"value":5370},{"type":21,"tag":209,"props":68477,"children":68478},{"style":222},[68479],{"type":26,"value":368},{"type":21,"tag":209,"props":68481,"children":68482},{"style":400},[68483],{"type":26,"value":68484},"resultSet",{"type":21,"tag":209,"props":68486,"children":68487},{"style":222},[68488],{"type":26,"value":2369},{"type":21,"tag":209,"props":68490,"children":68491},{"class":211,"line":244},[68492,68496,68500,68504,68509,68513,68517,68522,68527],{"type":21,"tag":209,"props":68493,"children":68494},{"style":216},[68495],{"type":26,"value":10853},{"type":21,"tag":209,"props":68497,"children":68498},{"style":222},[68499],{"type":26,"value":4776},{"type":21,"tag":209,"props":68501,"children":68502},{"style":216},[68503],{"type":26,"value":15052},{"type":21,"tag":209,"props":68505,"children":68506},{"style":222},[68507],{"type":26,"value":68508},"resultSet ",{"type":21,"tag":209,"props":68510,"children":68511},{"style":216},[68512],{"type":26,"value":4677},{"type":21,"tag":209,"props":68514,"children":68515},{"style":216},[68516],{"type":26,"value":17157},{"type":21,"tag":209,"props":68518,"children":68519},{"style":222},[68520],{"type":26,"value":68521},"resultSet.",{"type":21,"tag":209,"props":68523,"children":68524},{"style":360},[68525],{"type":26,"value":68526},"getSize",{"type":21,"tag":209,"props":68528,"children":68529},{"style":222},[68530],{"type":26,"value":68531},"())\n",{"type":21,"tag":209,"props":68533,"children":68534},{"class":211,"line":254},[68535],{"type":21,"tag":209,"props":68536,"children":68537},{"style":222},[68538],{"type":26,"value":37029},{"type":21,"tag":209,"props":68540,"children":68541},{"class":211,"line":279},[68542,68547,68551,68555,68559,68563,68567,68571,68575,68580,68584],{"type":21,"tag":209,"props":68543,"children":68544},{"style":222},[68545],{"type":26,"value":68546},"        that.debug ",{"type":21,"tag":209,"props":68548,"children":68549},{"style":216},[68550],{"type":26,"value":36584},{"type":21,"tag":209,"props":68552,"children":68553},{"style":222},[68554],{"type":26,"value":57809},{"type":21,"tag":209,"props":68556,"children":68557},{"style":216},[68558],{"type":26,"value":36584},{"type":21,"tag":209,"props":68560,"children":68561},{"style":222},[68562],{"type":26,"value":68375},{"type":21,"tag":209,"props":68564,"children":68565},{"style":360},[68566],{"type":26,"value":1059},{"type":21,"tag":209,"props":68568,"children":68569},{"style":222},[68570],{"type":26,"value":368},{"type":21,"tag":209,"props":68572,"children":68573},{"style":216},[68574],{"type":26,"value":36584},{"type":21,"tag":209,"props":68576,"children":68577},{"style":222},[68578],{"type":26,"value":68579},"quot;No Results Found.",{"type":21,"tag":209,"props":68581,"children":68582},{"style":216},[68583],{"type":26,"value":36584},{"type":21,"tag":209,"props":68585,"children":68586},{"style":222},[68587],{"type":26,"value":68588},"quot;);\n",{"type":21,"tag":209,"props":68590,"children":68591},{"class":211,"line":288},[68592,68596],{"type":21,"tag":209,"props":68593,"children":68594},{"style":216},[68595],{"type":26,"value":3069},{"type":21,"tag":209,"props":68597,"children":68598},{"style":222},[68599],{"type":26,"value":241},{"type":21,"tag":209,"props":68601,"children":68602},{"class":211,"line":307},[68603],{"type":21,"tag":209,"props":68604,"children":68605},{"style":222},[68606],{"type":26,"value":331},{"type":21,"tag":209,"props":68608,"children":68609},{"class":211,"line":325},[68610],{"type":21,"tag":209,"props":68611,"children":68612},{"style":448},[68613],{"type":26,"value":68614},"// Higher scoring items should be displayed first\n",{"type":21,"tag":209,"props":68616,"children":68617},{"class":211,"line":334},[68618,68622,68626],{"type":21,"tag":209,"props":68619,"children":68620},{"style":222},[68621],{"type":26,"value":68521},{"type":21,"tag":209,"props":68623,"children":68624},{"style":360},[68625],{"type":26,"value":67478},{"type":21,"tag":209,"props":68627,"children":68628},{"style":222},[68629],{"type":26,"value":17983},{"type":21,"tag":209,"props":68631,"children":68632},{"class":211,"line":343},[68633,68638,68642,68646,68650,68654,68658,68663],{"type":21,"tag":209,"props":68634,"children":68635},{"style":360},[68636],{"type":26,"value":68637},"    lower_than",{"type":21,"tag":209,"props":68639,"children":68640},{"style":222},[68641],{"type":26,"value":7427},{"type":21,"tag":209,"props":68643,"children":68644},{"style":216},[68645],{"type":26,"value":5370},{"type":21,"tag":209,"props":68647,"children":68648},{"style":222},[68649],{"type":26,"value":368},{"type":21,"tag":209,"props":68651,"children":68652},{"style":400},[68653],{"type":26,"value":29},{"type":21,"tag":209,"props":68655,"children":68656},{"style":222},[68657],{"type":26,"value":55957},{"type":21,"tag":209,"props":68659,"children":68660},{"style":400},[68661],{"type":26,"value":68662},"b",{"type":21,"tag":209,"props":68664,"children":68665},{"style":222},[68666],{"type":26,"value":4786},{"type":21,"tag":209,"props":68668,"children":68669},{"class":211,"line":351},[68670,68674,68679,68683],{"type":21,"tag":209,"props":68671,"children":68672},{"style":216},[68673],{"type":26,"value":3069},{"type":21,"tag":209,"props":68675,"children":68676},{"style":222},[68677],{"type":26,"value":68678}," a.score ",{"type":21,"tag":209,"props":68680,"children":68681},{"style":216},[68682],{"type":26,"value":36584},{"type":21,"tag":209,"props":68684,"children":68685},{"style":222},[68686],{"type":26,"value":68687},"amp;gt; b.score;\n",{"type":21,"tag":209,"props":68689,"children":68690},{"class":211,"line":444},[68691],{"type":21,"tag":209,"props":68692,"children":68693},{"style":222},[68694],{"type":26,"value":2251},{"type":21,"tag":209,"props":68696,"children":68697},{"class":211,"line":454},[68698,68703,68707,68711,68715,68719,68723,68727],{"type":21,"tag":209,"props":68699,"children":68700},{"style":360},[68701],{"type":26,"value":68702},"    equals",{"type":21,"tag":209,"props":68704,"children":68705},{"style":222},[68706],{"type":26,"value":7427},{"type":21,"tag":209,"props":68708,"children":68709},{"style":216},[68710],{"type":26,"value":5370},{"type":21,"tag":209,"props":68712,"children":68713},{"style":222},[68714],{"type":26,"value":368},{"type":21,"tag":209,"props":68716,"children":68717},{"style":400},[68718],{"type":26,"value":29},{"type":21,"tag":209,"props":68720,"children":68721},{"style":222},[68722],{"type":26,"value":55957},{"type":21,"tag":209,"props":68724,"children":68725},{"style":400},[68726],{"type":26,"value":68662},{"type":21,"tag":209,"props":68728,"children":68729},{"style":222},[68730],{"type":26,"value":4786},{"type":21,"tag":209,"props":68732,"children":68733},{"class":211,"line":463},[68734,68738,68742,68746],{"type":21,"tag":209,"props":68735,"children":68736},{"style":216},[68737],{"type":26,"value":3069},{"type":21,"tag":209,"props":68739,"children":68740},{"style":222},[68741],{"type":26,"value":68678},{"type":21,"tag":209,"props":68743,"children":68744},{"style":216},[68745],{"type":26,"value":6102},{"type":21,"tag":209,"props":68747,"children":68748},{"style":222},[68749],{"type":26,"value":68750}," b.score;\n",{"type":21,"tag":209,"props":68752,"children":68753},{"class":211,"line":472},[68754],{"type":21,"tag":209,"props":68755,"children":68756},{"style":222},[68757],{"type":26,"value":331},{"type":21,"tag":209,"props":68759,"children":68760},{"class":211,"line":480},[68761],{"type":21,"tag":209,"props":68762,"children":68763},{"style":222},[68764],{"type":26,"value":469},{"type":21,"tag":209,"props":68766,"children":68767},{"class":211,"line":489},[68768],{"type":21,"tag":209,"props":68769,"children":68770},{"style":448},[68771],{"type":26,"value":68772},"// Filter for unique values in resultSet\n",{"type":21,"tag":209,"props":68774,"children":68775},{"class":211,"line":847},[68776,68780,68785,68789],{"type":21,"tag":209,"props":68777,"children":68778},{"style":216},[68779],{"type":26,"value":8996},{"type":21,"tag":209,"props":68781,"children":68782},{"style":222},[68783],{"type":26,"value":68784}," values ",{"type":21,"tag":209,"props":68786,"children":68787},{"style":216},[68788],{"type":26,"value":1432},{"type":21,"tag":209,"props":68790,"children":68791},{"style":222},[68792],{"type":26,"value":68793}," [],\n",{"type":21,"tag":209,"props":68795,"children":68796},{"class":211,"line":860},[68797,68802,68806,68811,68815],{"type":21,"tag":209,"props":68798,"children":68799},{"style":222},[68800],{"type":26,"value":68801},"    len ",{"type":21,"tag":209,"props":68803,"children":68804},{"style":216},[68805],{"type":26,"value":1432},{"type":21,"tag":209,"props":68807,"children":68808},{"style":222},[68809],{"type":26,"value":68810}," resultSet.data.",{"type":21,"tag":209,"props":68812,"children":68813},{"style":263},[68814],{"type":26,"value":36467},{"type":21,"tag":209,"props":68816,"children":68817},{"style":222},[68818],{"type":26,"value":241},{"type":21,"tag":209,"props":68820,"children":68821},{"class":211,"line":877},[68822,68827,68832,68836],{"type":21,"tag":209,"props":68823,"children":68824},{"style":216},[68825],{"type":26,"value":68826},"while",{"type":21,"tag":209,"props":68828,"children":68829},{"style":222},[68830],{"type":26,"value":68831},"(len",{"type":21,"tag":209,"props":68833,"children":68834},{"style":216},[68835],{"type":26,"value":36854},{"type":21,"tag":209,"props":68837,"children":68838},{"style":222},[68839],{"type":26,"value":10112},{"type":21,"tag":209,"props":68841,"children":68842},{"class":211,"line":889},[68843],{"type":21,"tag":209,"props":68844,"children":68845},{"style":222},[68846],{"type":26,"value":7414},{"type":21,"tag":209,"props":68848,"children":68849},{"class":211,"line":902},[68850,68855,68859,68864,68868,68872,68876,68880,68884,68888,68893,68898,68902,68906],{"type":21,"tag":209,"props":68851,"children":68852},{"style":222},[68853],{"type":26,"value":68854},"    (values.",{"type":21,"tag":209,"props":68856,"children":68857},{"style":360},[68858],{"type":26,"value":12392},{"type":21,"tag":209,"props":68860,"children":68861},{"style":222},[68862],{"type":26,"value":68863},"(resultSet.data[len].value) ",{"type":21,"tag":209,"props":68865,"children":68866},{"style":216},[68867],{"type":26,"value":12011},{"type":21,"tag":209,"props":68869,"children":68870},{"style":216},[68871],{"type":26,"value":12414},{"type":21,"tag":209,"props":68873,"children":68874},{"style":263},[68875],{"type":26,"value":3224},{"type":21,"tag":209,"props":68877,"children":68878},{"style":222},[68879],{"type":26,"value":432},{"type":21,"tag":209,"props":68881,"children":68882},{"style":216},[68883],{"type":26,"value":15218},{"type":21,"tag":209,"props":68885,"children":68886},{"style":222},[68887],{"type":26,"value":68810},{"type":21,"tag":209,"props":68889,"children":68890},{"style":360},[68891],{"type":26,"value":68892},"splice",{"type":21,"tag":209,"props":68894,"children":68895},{"style":222},[68896],{"type":26,"value":68897},"(len, ",{"type":21,"tag":209,"props":68899,"children":68900},{"style":263},[68901],{"type":26,"value":3224},{"type":21,"tag":209,"props":68903,"children":68904},{"style":222},[68905],{"type":26,"value":432},{"type":21,"tag":209,"props":68907,"children":68908},{"style":216},[68909],{"type":26,"value":844},{"type":21,"tag":209,"props":68911,"children":68912},{"class":211,"line":914},[68913,68918,68922],{"type":21,"tag":209,"props":68914,"children":68915},{"style":222},[68916],{"type":26,"value":68917},"        values.",{"type":21,"tag":209,"props":68919,"children":68920},{"style":360},[68921],{"type":26,"value":56072},{"type":21,"tag":209,"props":68923,"children":68924},{"style":222},[68925],{"type":26,"value":68926},"(resultSet.data[len].value);\n",{"type":21,"tag":209,"props":68928,"children":68929},{"class":211,"line":922},[68930],{"type":21,"tag":209,"props":68931,"children":68932},{"style":222},[68933],{"type":26,"value":7798},{"type":21,"tag":209,"props":68935,"children":68936},{"class":211,"line":2312},[68937],{"type":21,"tag":209,"props":68938,"children":68939},{"style":448},[68940],{"type":26,"value":68941},"// For each result in the resultSet, create a direct link to the appropriate section, and\n",{"type":21,"tag":209,"props":68943,"children":68944},{"class":211,"line":2321},[68945],{"type":21,"tag":209,"props":68946,"children":68947},{"style":448},[68948],{"type":26,"value":68949},"// display a collapsible div showing context.\n",{"type":21,"tag":209,"props":68951,"children":68952},{"class":211,"line":2372},[68953,68957,68961,68965,68969,68973,68978],{"type":21,"tag":209,"props":68954,"children":68955},{"style":222},[68956],{"type":26,"value":68521},{"type":21,"tag":209,"props":68958,"children":68959},{"style":360},[68960],{"type":26,"value":11022},{"type":21,"tag":209,"props":68962,"children":68963},{"style":222},[68964],{"type":26,"value":368},{"type":21,"tag":209,"props":68966,"children":68967},{"style":216},[68968],{"type":26,"value":5370},{"type":21,"tag":209,"props":68970,"children":68971},{"style":222},[68972],{"type":26,"value":368},{"type":21,"tag":209,"props":68974,"children":68975},{"style":400},[68976],{"type":26,"value":68977},"entry",{"type":21,"tag":209,"props":68979,"children":68980},{"style":222},[68981],{"type":26,"value":2369},{"type":21,"tag":209,"props":68983,"children":68984},{"class":211,"line":2381},[68985,68989,68994,68998],{"type":21,"tag":209,"props":68986,"children":68987},{"style":216},[68988],{"type":26,"value":10405},{"type":21,"tag":209,"props":68990,"children":68991},{"style":222},[68992],{"type":26,"value":68993}," result ",{"type":21,"tag":209,"props":68995,"children":68996},{"style":216},[68997],{"type":26,"value":1432},{"type":21,"tag":209,"props":68999,"children":69000},{"style":222},[69001],{"type":26,"value":69002}," that.gContent[entry.value];\n",{"type":21,"tag":209,"props":69004,"children":69005},{"class":211,"line":2389},[69006],{"type":21,"tag":209,"props":69007,"children":69008},{"style":448},[69009],{"type":26,"value":69010},"    // Create links, etc. here\n",{"type":21,"tag":209,"props":69012,"children":69013},{"class":211,"line":2397},[69014,69019,69023,69028,69032,69037,69041],{"type":21,"tag":209,"props":69015,"children":69016},{"style":222},[69017],{"type":26,"value":69018},"    that.debug ",{"type":21,"tag":209,"props":69020,"children":69021},{"style":216},[69022],{"type":26,"value":36584},{"type":21,"tag":209,"props":69024,"children":69025},{"style":222},[69026],{"type":26,"value":69027},"amp;amp;",{"type":21,"tag":209,"props":69029,"children":69030},{"style":216},[69031],{"type":26,"value":36584},{"type":21,"tag":209,"props":69033,"children":69034},{"style":222},[69035],{"type":26,"value":69036},"amp;amp; console.",{"type":21,"tag":209,"props":69038,"children":69039},{"style":360},[69040],{"type":26,"value":1059},{"type":21,"tag":209,"props":69042,"children":69043},{"style":222},[69044],{"type":26,"value":69045},"(that.gContent[entry.value]);\n",{"type":21,"tag":209,"props":69047,"children":69048},{"class":211,"line":2406},[69049],{"type":21,"tag":209,"props":69050,"children":69051},{"style":222},[69052],{"type":26,"value":469},{"type":21,"tag":209,"props":69054,"children":69055},{"class":211,"line":2415},[69056],{"type":21,"tag":209,"props":69057,"children":69058},{"emptyLinePlaceholder":248},[69059],{"type":26,"value":251},{"type":21,"tag":209,"props":69061,"children":69062},{"class":211,"line":2424},[69063],{"type":21,"tag":209,"props":69064,"children":69065},{"style":222},[69066],{"type":26,"value":469},{"type":21,"tag":22,"props":69068,"children":69069},{},[69070,69072,69078],{"type":26,"value":69071},"So, we call ",{"type":21,"tag":63,"props":69073,"children":69075},{"className":69074},[],[69076],{"type":26,"value":69077},"this.engine.lookup",{"type":26,"value":69079}," with the value we want to search for, receving a resultSet (an object of type fullproof.ResultSet), which we then proceed to set a comparator on (in order to get the order we desire), filter to make sure only unique entries are returned, and for each, create some element to represent the result.",{"type":21,"tag":22,"props":69081,"children":69082},{},[69083],{"type":26,"value":69084},"Besides the UI elements involved, that's about all there is to it! It works quite well (surprisingly so, for an entirely client-side solution to search). If you happen to be involved in a project that can't rely on a server-side solution to search, fullproof might well be the answer you've been looking for.",{"type":21,"tag":3490,"props":69086,"children":69087},{},[69088],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":69090},[69091,69092],{"id":67123,"depth":279,"text":67126},{"id":67210,"depth":244,"text":67213,"children":69093},[69094],{"id":68435,"depth":279,"text":68438},"content:ckeefer:2013-08:fullproof-fulltext-search.md","ckeefer/2013-08/fullproof-fulltext-search.md","ckeefer/2013-08/fullproof-fulltext-search",{"user":3518,"name":3519},{"_path":69100,"_dir":69101,"_draft":7,"_partial":7,"_locale":8,"title":69102,"description":69103,"publishDate":69104,"tags":69105,"excerpt":69103,"body":69106,"_type":3511,"_id":69887,"_source":3513,"_file":69888,"_stem":69889,"_extension":3516,"author":69890},"/ckeefer/2013-07/anchors-hash","2013-07","Anchors, Hash Sign, javascript:void(0)","So, you've got a link that, in reality, is just a click target for performing some javascript function. You want the appearance of a standard anchor link, but if it's not performing the intended function, should it really be an anchor? And if so, what should we fill that 'href' attribute in with?","2013-07-29",[12],{"type":18,"children":69107,"toc":69882},[69108,69112,69118,69185,69191,69196,69215,69249,69254,69306,69372,69377,69382,69438,69443,69448,69469,69474,69529,69542,69547,69581,69586,69668,69852,69868,69873,69878],{"type":21,"tag":22,"props":69109,"children":69110},{},[69111],{"type":26,"value":69103},{"type":21,"tag":3549,"props":69113,"children":69115},{"id":69114},"lets-begin-with-a-nasty-anti-pattern",[69116],{"type":26,"value":69117},"Let's begin with a nasty anti-pattern:",{"type":21,"tag":200,"props":69119,"children":69121},{"className":7947,"code":69120,"language":7949,"meta":8,"style":8},"\u003Ca onclick=\"alert('Obtrusive!'); return false;\">Click Me\u003C/a>\n",[69122],{"type":21,"tag":63,"props":69123,"children":69124},{"__ignoreMap":8},[69125],{"type":21,"tag":209,"props":69126,"children":69127},{"class":211,"line":212},[69128,69132,69136,69141,69145,69149,69154,69159,69163,69167,69172,69177,69181],{"type":21,"tag":209,"props":69129,"children":69130},{"style":222},[69131],{"type":26,"value":1985},{"type":21,"tag":209,"props":69133,"children":69134},{"style":1988},[69135],{"type":26,"value":29},{"type":21,"tag":209,"props":69137,"children":69138},{"style":360},[69139],{"type":26,"value":69140}," onclick",{"type":21,"tag":209,"props":69142,"children":69143},{"style":222},[69144],{"type":26,"value":1432},{"type":21,"tag":209,"props":69146,"children":69147},{"style":233},[69148],{"type":26,"value":10018},{"type":21,"tag":209,"props":69150,"children":69151},{"style":360},[69152],{"type":26,"value":69153},"alert",{"type":21,"tag":209,"props":69155,"children":69156},{"style":233},[69157],{"type":26,"value":69158},"('Obtrusive!'); ",{"type":21,"tag":209,"props":69160,"children":69161},{"style":216},[69162],{"type":26,"value":5813},{"type":21,"tag":209,"props":69164,"children":69165},{"style":263},[69166],{"type":26,"value":5455},{"type":21,"tag":209,"props":69168,"children":69169},{"style":233},[69170],{"type":26,"value":69171},";\"",{"type":21,"tag":209,"props":69173,"children":69174},{"style":222},[69175],{"type":26,"value":69176},">Click Me\u003C/",{"type":21,"tag":209,"props":69178,"children":69179},{"style":1988},[69180],{"type":26,"value":29},{"type":21,"tag":209,"props":69182,"children":69183},{"style":222},[69184],{"type":26,"value":1996},{"type":21,"tag":193,"props":69186,"children":69188},{"id":69187},"boo-hiss",[69189],{"type":26,"value":69190},"Boo, hiss!",{"type":21,"tag":22,"props":69192,"children":69193},{},[69194],{"type":26,"value":69195},"Why is this so bad?",{"type":21,"tag":22,"props":69197,"children":69198},{},[69199,69204,69206,69213],{"type":21,"tag":5270,"props":69200,"children":69201},{},[69202],{"type":26,"value":69203},"First",{"type":26,"value":69205},", the onclick handler is a clear violation of ",{"type":21,"tag":29,"props":69207,"children":69210},{"href":69208,"rel":69209},"http://en.wikipedia.org/wiki/Unobtrusive_JavaScript",[93],[69211],{"type":26,"value":69212},"unobtrusive javascript",{"type":26,"value":69214},". The wikipedia article covers in reasonable detail why using this sort of handler is highly discouraged, but in a nutshell, behaviour and structure should be as separate as structure and presentation (ie. html and css).",{"type":21,"tag":22,"props":69216,"children":69217},{},[69218,69223,69225,69231,69233,69239,69241,69247],{"type":21,"tag":5270,"props":69219,"children":69220},{},[69221],{"type":26,"value":69222},"Secondly",{"type":26,"value":69224},", the lack of ",{"type":21,"tag":63,"props":69226,"children":69228},{"className":69227},[],[69229],{"type":26,"value":69230},"href",{"type":26,"value":69232}," attribute would normally indicate this is an anchor element (as opposed to a link) - functionally speaking, it should have an ",{"type":21,"tag":63,"props":69234,"children":69236},{"className":69235},[],[69237],{"type":26,"value":69238},"id",{"type":26,"value":69240}," which corresponds to a ",{"type":21,"tag":63,"props":69242,"children":69244},{"className":69243},[],[69245],{"type":26,"value":69246},"href=\"#id\"",{"type":26,"value":69248}," somewhere on the page. It probably won't break anything (unless you have code or styling that's looking for said attribute), but it won't gain the pointer cursor when you hover over it, and it shoehorns the element into performing a function it was never really intended for.",{"type":21,"tag":22,"props":69250,"children":69251},{},[69252],{"type":26,"value":69253},"This isn't really any better:",{"type":21,"tag":200,"props":69255,"children":69257},{"className":7947,"code":69256,"language":7949,"meta":8,"style":8},"\u003Ca onclick=\"jsfunc();\">Click Me\u003C/a>\n",[69258],{"type":21,"tag":63,"props":69259,"children":69260},{"__ignoreMap":8},[69261],{"type":21,"tag":209,"props":69262,"children":69263},{"class":211,"line":212},[69264,69268,69272,69276,69280,69284,69289,69294,69298,69302],{"type":21,"tag":209,"props":69265,"children":69266},{"style":222},[69267],{"type":26,"value":1985},{"type":21,"tag":209,"props":69269,"children":69270},{"style":1988},[69271],{"type":26,"value":29},{"type":21,"tag":209,"props":69273,"children":69274},{"style":360},[69275],{"type":26,"value":69140},{"type":21,"tag":209,"props":69277,"children":69278},{"style":222},[69279],{"type":26,"value":1432},{"type":21,"tag":209,"props":69281,"children":69282},{"style":233},[69283],{"type":26,"value":10018},{"type":21,"tag":209,"props":69285,"children":69286},{"style":360},[69287],{"type":26,"value":69288},"jsfunc",{"type":21,"tag":209,"props":69290,"children":69291},{"style":233},[69292],{"type":26,"value":69293},"();\"",{"type":21,"tag":209,"props":69295,"children":69296},{"style":222},[69297],{"type":26,"value":69176},{"type":21,"tag":209,"props":69299,"children":69300},{"style":1988},[69301],{"type":26,"value":29},{"type":21,"tag":209,"props":69303,"children":69304},{"style":222},[69305],{"type":26,"value":1996},{"type":21,"tag":200,"props":69307,"children":69309},{"className":9044,"code":69308,"language":9046,"meta":8,"style":8},"function jsfunc(){\n    alert('Still obtrusive');\n    return false;\n}\n",[69310],{"type":21,"tag":63,"props":69311,"children":69312},{"__ignoreMap":8},[69313,69329,69350,69365],{"type":21,"tag":209,"props":69314,"children":69315},{"class":211,"line":212},[69316,69320,69325],{"type":21,"tag":209,"props":69317,"children":69318},{"style":216},[69319],{"type":26,"value":5370},{"type":21,"tag":209,"props":69321,"children":69322},{"style":360},[69323],{"type":26,"value":69324}," jsfunc",{"type":21,"tag":209,"props":69326,"children":69327},{"style":222},[69328],{"type":26,"value":2561},{"type":21,"tag":209,"props":69330,"children":69331},{"class":211,"line":244},[69332,69337,69341,69346],{"type":21,"tag":209,"props":69333,"children":69334},{"style":360},[69335],{"type":26,"value":69336},"    alert",{"type":21,"tag":209,"props":69338,"children":69339},{"style":222},[69340],{"type":26,"value":368},{"type":21,"tag":209,"props":69342,"children":69343},{"style":233},[69344],{"type":26,"value":69345},"'Still obtrusive'",{"type":21,"tag":209,"props":69347,"children":69348},{"style":222},[69349],{"type":26,"value":2608},{"type":21,"tag":209,"props":69351,"children":69352},{"class":211,"line":254},[69353,69357,69361],{"type":21,"tag":209,"props":69354,"children":69355},{"style":216},[69356],{"type":26,"value":1298},{"type":21,"tag":209,"props":69358,"children":69359},{"style":263},[69360],{"type":26,"value":5455},{"type":21,"tag":209,"props":69362,"children":69363},{"style":222},[69364],{"type":26,"value":241},{"type":21,"tag":209,"props":69366,"children":69367},{"class":211,"line":279},[69368],{"type":21,"tag":209,"props":69369,"children":69370},{"style":222},[69371],{"type":26,"value":7798},{"type":21,"tag":22,"props":69373,"children":69374},{},[69375],{"type":26,"value":69376},"We still have the obtrusive onclick handler - the fact that we've shoved the logic into a function doesn't really improve the situation.",{"type":21,"tag":22,"props":69378,"children":69379},{},[69380],{"type":26,"value":69381},"Here's a better example:",{"type":21,"tag":200,"props":69383,"children":69385},{"className":7947,"code":69384,"language":7949,"meta":8,"style":8},"\u003Ca id=\"click_target\" href=\"#\">Click Me\u003C/a>\n",[69386],{"type":21,"tag":63,"props":69387,"children":69388},{"__ignoreMap":8},[69389],{"type":21,"tag":209,"props":69390,"children":69391},{"class":211,"line":212},[69392,69396,69400,69404,69408,69413,69417,69421,69426,69430,69434],{"type":21,"tag":209,"props":69393,"children":69394},{"style":222},[69395],{"type":26,"value":1985},{"type":21,"tag":209,"props":69397,"children":69398},{"style":1988},[69399],{"type":26,"value":29},{"type":21,"tag":209,"props":69401,"children":69402},{"style":360},[69403],{"type":26,"value":24498},{"type":21,"tag":209,"props":69405,"children":69406},{"style":222},[69407],{"type":26,"value":1432},{"type":21,"tag":209,"props":69409,"children":69410},{"style":233},[69411],{"type":26,"value":69412},"\"click_target\"",{"type":21,"tag":209,"props":69414,"children":69415},{"style":360},[69416],{"type":26,"value":7992},{"type":21,"tag":209,"props":69418,"children":69419},{"style":222},[69420],{"type":26,"value":1432},{"type":21,"tag":209,"props":69422,"children":69423},{"style":233},[69424],{"type":26,"value":69425},"\"#\"",{"type":21,"tag":209,"props":69427,"children":69428},{"style":222},[69429],{"type":26,"value":69176},{"type":21,"tag":209,"props":69431,"children":69432},{"style":1988},[69433],{"type":26,"value":29},{"type":21,"tag":209,"props":69435,"children":69436},{"style":222},[69437],{"type":26,"value":1996},{"type":21,"tag":22,"props":69439,"children":69440},{},[69441],{"type":26,"value":69442},"We've added an id to the anchor, along with a simple hash in the href. Now, the mouse will gain the expected pointer cursor on hover, and we can look up the element by its id and attach behaviours to it unobtrusively.",{"type":21,"tag":22,"props":69444,"children":69445},{},[69446],{"type":26,"value":69447},"However, we now have a href that doesn't really point anywhere. If something goes wrong - javascript is disabled, fails to init due to an error, etc. - clicking it will take us back to the top of the page and alter the url. This isn't generally terrible, but it's certainly not desirable either. And what if we're using hash fragements for maintaining state, or routing (such as in Backbone)? Changing the hash could be problematic.",{"type":21,"tag":22,"props":69449,"children":69450},{},[69451,69453,69459,69461,69467],{"type":26,"value":69452},"Moreover, we now need to cancel the default action in our javascript. We could ",{"type":21,"tag":63,"props":69454,"children":69456},{"className":69455},[],[69457],{"type":26,"value":69458},"return false;",{"type":26,"value":69460},", but this is a misuse of the return, which should offer a value to other calling functions, not be used to cancel actions. We can, of course, ",{"type":21,"tag":63,"props":69462,"children":69464},{"className":69463},[],[69465],{"type":26,"value":69466},"preventDefault()",{"type":26,"value":69468}," on the event, and this is the best way to handle this situation, but maybe we want to avoid having to handle a default action altogether?",{"type":21,"tag":22,"props":69470,"children":69471},{},[69472],{"type":26,"value":69473},"A common solution looks like:",{"type":21,"tag":200,"props":69475,"children":69477},{"className":7947,"code":69476,"language":7949,"meta":8,"style":8},"\u003Ca id=\"click_target\" href=\"javascript:void(0);\">Click Me\u003C/a>\n",[69478],{"type":21,"tag":63,"props":69479,"children":69480},{"__ignoreMap":8},[69481],{"type":21,"tag":209,"props":69482,"children":69483},{"class":211,"line":212},[69484,69488,69492,69496,69500,69504,69508,69512,69517,69521,69525],{"type":21,"tag":209,"props":69485,"children":69486},{"style":222},[69487],{"type":26,"value":1985},{"type":21,"tag":209,"props":69489,"children":69490},{"style":1988},[69491],{"type":26,"value":29},{"type":21,"tag":209,"props":69493,"children":69494},{"style":360},[69495],{"type":26,"value":24498},{"type":21,"tag":209,"props":69497,"children":69498},{"style":222},[69499],{"type":26,"value":1432},{"type":21,"tag":209,"props":69501,"children":69502},{"style":233},[69503],{"type":26,"value":69412},{"type":21,"tag":209,"props":69505,"children":69506},{"style":360},[69507],{"type":26,"value":7992},{"type":21,"tag":209,"props":69509,"children":69510},{"style":222},[69511],{"type":26,"value":1432},{"type":21,"tag":209,"props":69513,"children":69514},{"style":233},[69515],{"type":26,"value":69516},"\"javascript:void(0);\"",{"type":21,"tag":209,"props":69518,"children":69519},{"style":222},[69520],{"type":26,"value":69176},{"type":21,"tag":209,"props":69522,"children":69523},{"style":1988},[69524],{"type":26,"value":29},{"type":21,"tag":209,"props":69526,"children":69527},{"style":222},[69528],{"type":26,"value":1996},{"type":21,"tag":22,"props":69530,"children":69531},{},[69532,69534,69540],{"type":26,"value":69533},"Personally, I don't really like this solution, or its cousin ",{"type":21,"tag":63,"props":69535,"children":69537},{"className":69536},[],[69538],{"type":26,"value":69539},"href=\"javascript:;\"",{"type":26,"value":69541}," but it does work well. We now have a click target that will present itself in the expected way, and perform no default action we need to cancel. But use of the javascript psuedo-protocol is a bit messy - it looks a lot less neat than the simple hash.",{"type":21,"tag":22,"props":69543,"children":69544},{},[69545],{"type":26,"value":69546},"Maybe the best solution, then, is not to use a link at all. A button element can be styled to look and function like a link, and performing an arbitrary behaviour is really what a button is all about.",{"type":21,"tag":22,"props":69548,"children":69549},{},[69550,69552,69557,69559,69565,69567,69572,69574,69580],{"type":26,"value":69551},"As an aside, ",{"type":21,"tag":63,"props":69553,"children":69555},{"className":69554},[],[69556],{"type":26,"value":32385},{"type":26,"value":69558}," - even if I don't recommend using it this way - is extremely handy, as its guaranteed to return ",{"type":21,"tag":63,"props":69560,"children":69562},{"className":69561},[],[69563],{"type":26,"value":69564},"undefined",{"type":26,"value":69566},". void 0, void(0), void 'whatever', will all return ",{"type":21,"tag":63,"props":69568,"children":69570},{"className":69569},[],[69571],{"type":26,"value":69564},{"type":26,"value":69573},". This is a great way to avoid testing against the mutable undefined global variable, or needing to use the longer ",{"type":21,"tag":63,"props":69575,"children":69577},{"className":69576},[],[69578],{"type":26,"value":69579},"typeof variable == 'undefined'",{"type":26,"value":378},{"type":21,"tag":22,"props":69582,"children":69583},{},[69584],{"type":26,"value":69585},"Consider this:",{"type":21,"tag":200,"props":69587,"children":69589},{"className":7947,"code":69588,"language":7949,"meta":8,"style":8},"\u003Cbutton id=\"click_target\" type=\"button\" tabindex=\"0\" class=\"link_alike\">Click Me\u003C/button>\n",[69590],{"type":21,"tag":63,"props":69591,"children":69592},{"__ignoreMap":8},[69593],{"type":21,"tag":209,"props":69594,"children":69595},{"class":211,"line":212},[69596,69600,69604,69608,69612,69616,69620,69624,69629,69634,69638,69643,69647,69651,69656,69660,69664],{"type":21,"tag":209,"props":69597,"children":69598},{"style":222},[69599],{"type":26,"value":1985},{"type":21,"tag":209,"props":69601,"children":69602},{"style":1988},[69603],{"type":26,"value":24539},{"type":21,"tag":209,"props":69605,"children":69606},{"style":360},[69607],{"type":26,"value":24498},{"type":21,"tag":209,"props":69609,"children":69610},{"style":222},[69611],{"type":26,"value":1432},{"type":21,"tag":209,"props":69613,"children":69614},{"style":233},[69615],{"type":26,"value":69412},{"type":21,"tag":209,"props":69617,"children":69618},{"style":360},[69619],{"type":26,"value":24544},{"type":21,"tag":209,"props":69621,"children":69622},{"style":222},[69623],{"type":26,"value":1432},{"type":21,"tag":209,"props":69625,"children":69626},{"style":233},[69627],{"type":26,"value":69628},"\"button\"",{"type":21,"tag":209,"props":69630,"children":69631},{"style":360},[69632],{"type":26,"value":69633}," tabindex",{"type":21,"tag":209,"props":69635,"children":69636},{"style":222},[69637],{"type":26,"value":1432},{"type":21,"tag":209,"props":69639,"children":69640},{"style":233},[69641],{"type":26,"value":69642},"\"0\"",{"type":21,"tag":209,"props":69644,"children":69645},{"style":360},[69646],{"type":26,"value":33949},{"type":21,"tag":209,"props":69648,"children":69649},{"style":222},[69650],{"type":26,"value":1432},{"type":21,"tag":209,"props":69652,"children":69653},{"style":233},[69654],{"type":26,"value":69655},"\"link_alike\"",{"type":21,"tag":209,"props":69657,"children":69658},{"style":222},[69659],{"type":26,"value":69176},{"type":21,"tag":209,"props":69661,"children":69662},{"style":1988},[69663],{"type":26,"value":24539},{"type":21,"tag":209,"props":69665,"children":69666},{"style":222},[69667],{"type":26,"value":1996},{"type":21,"tag":200,"props":69669,"children":69671},{"className":49405,"code":69670,"language":49407,"meta":8,"style":8},".link_alike{\n    background:transparent;\n    border-color:transparent;\n    border-radius:0;\n    color:#0088CC;\n    cursor:pointer;\n}\n.link_alike:hover{\n    text-decoration:underline;\n    color:#005580;\n}\n",[69672],{"type":21,"tag":63,"props":69673,"children":69674},{"__ignoreMap":8},[69675,69687,69707,69727,69746,69766,69785,69792,69804,69825,69845],{"type":21,"tag":209,"props":69676,"children":69677},{"class":211,"line":212},[69678,69683],{"type":21,"tag":209,"props":69679,"children":69680},{"style":360},[69681],{"type":26,"value":69682},".link_alike",{"type":21,"tag":209,"props":69684,"children":69685},{"style":222},[69686],{"type":26,"value":7414},{"type":21,"tag":209,"props":69688,"children":69689},{"class":211,"line":244},[69690,69694,69698,69703],{"type":21,"tag":209,"props":69691,"children":69692},{"style":263},[69693],{"type":26,"value":53498},{"type":21,"tag":209,"props":69695,"children":69696},{"style":222},[69697],{"type":26,"value":191},{"type":21,"tag":209,"props":69699,"children":69700},{"style":263},[69701],{"type":26,"value":69702},"transparent",{"type":21,"tag":209,"props":69704,"children":69705},{"style":222},[69706],{"type":26,"value":241},{"type":21,"tag":209,"props":69708,"children":69709},{"class":211,"line":254},[69710,69715,69719,69723],{"type":21,"tag":209,"props":69711,"children":69712},{"style":263},[69713],{"type":26,"value":69714},"    border-color",{"type":21,"tag":209,"props":69716,"children":69717},{"style":222},[69718],{"type":26,"value":191},{"type":21,"tag":209,"props":69720,"children":69721},{"style":263},[69722],{"type":26,"value":69702},{"type":21,"tag":209,"props":69724,"children":69725},{"style":222},[69726],{"type":26,"value":241},{"type":21,"tag":209,"props":69728,"children":69729},{"class":211,"line":279},[69730,69734,69738,69742],{"type":21,"tag":209,"props":69731,"children":69732},{"style":263},[69733],{"type":26,"value":53519},{"type":21,"tag":209,"props":69735,"children":69736},{"style":222},[69737],{"type":26,"value":191},{"type":21,"tag":209,"props":69739,"children":69740},{"style":263},[69741],{"type":26,"value":6048},{"type":21,"tag":209,"props":69743,"children":69744},{"style":222},[69745],{"type":26,"value":241},{"type":21,"tag":209,"props":69747,"children":69748},{"class":211,"line":288},[69749,69753,69757,69762],{"type":21,"tag":209,"props":69750,"children":69751},{"style":263},[69752],{"type":26,"value":53591},{"type":21,"tag":209,"props":69754,"children":69755},{"style":222},[69756],{"type":26,"value":191},{"type":21,"tag":209,"props":69758,"children":69759},{"style":263},[69760],{"type":26,"value":69761},"#0088CC",{"type":21,"tag":209,"props":69763,"children":69764},{"style":222},[69765],{"type":26,"value":241},{"type":21,"tag":209,"props":69767,"children":69768},{"class":211,"line":307},[69769,69773,69777,69781],{"type":21,"tag":209,"props":69770,"children":69771},{"style":263},[69772],{"type":26,"value":53447},{"type":21,"tag":209,"props":69774,"children":69775},{"style":222},[69776],{"type":26,"value":191},{"type":21,"tag":209,"props":69778,"children":69779},{"style":263},[69780],{"type":26,"value":53456},{"type":21,"tag":209,"props":69782,"children":69783},{"style":222},[69784],{"type":26,"value":241},{"type":21,"tag":209,"props":69786,"children":69787},{"class":211,"line":325},[69788],{"type":21,"tag":209,"props":69789,"children":69790},{"style":222},[69791],{"type":26,"value":7798},{"type":21,"tag":209,"props":69793,"children":69794},{"class":211,"line":334},[69795,69800],{"type":21,"tag":209,"props":69796,"children":69797},{"style":360},[69798],{"type":26,"value":69799},".link_alike:hover",{"type":21,"tag":209,"props":69801,"children":69802},{"style":222},[69803],{"type":26,"value":7414},{"type":21,"tag":209,"props":69805,"children":69806},{"class":211,"line":343},[69807,69812,69816,69821],{"type":21,"tag":209,"props":69808,"children":69809},{"style":263},[69810],{"type":26,"value":69811},"    text-decoration",{"type":21,"tag":209,"props":69813,"children":69814},{"style":222},[69815],{"type":26,"value":191},{"type":21,"tag":209,"props":69817,"children":69818},{"style":263},[69819],{"type":26,"value":69820},"underline",{"type":21,"tag":209,"props":69822,"children":69823},{"style":222},[69824],{"type":26,"value":241},{"type":21,"tag":209,"props":69826,"children":69827},{"class":211,"line":351},[69828,69832,69836,69841],{"type":21,"tag":209,"props":69829,"children":69830},{"style":263},[69831],{"type":26,"value":53591},{"type":21,"tag":209,"props":69833,"children":69834},{"style":222},[69835],{"type":26,"value":191},{"type":21,"tag":209,"props":69837,"children":69838},{"style":263},[69839],{"type":26,"value":69840},"#005580",{"type":21,"tag":209,"props":69842,"children":69843},{"style":222},[69844],{"type":26,"value":241},{"type":21,"tag":209,"props":69846,"children":69847},{"class":211,"line":444},[69848],{"type":21,"tag":209,"props":69849,"children":69850},{"style":222},[69851],{"type":26,"value":7798},{"type":21,"tag":22,"props":69853,"children":69854},{},[69855,69857,69861,69862,69866],{"type":26,"value":69856},"You'll likely want to add ",{"type":21,"tag":69858,"props":69859,"children":69860},"focus",{},[],{"type":26,"value":7274},{"type":21,"tag":69863,"props":69864,"children":69865},"active",{},[],{"type":26,"value":69867}," states as well, but the above gives you the basics of a click target with no default behaviour beyond looking and acting like a link - perfect for attaching your javascript to while still presenting your user with a familiar target.",{"type":21,"tag":22,"props":69869,"children":69870},{},[69871],{"type":26,"value":69872},"Now, I won't claim this is my goto solution - I tend to use link's with a simple hash and just cancel the default action. There are some advantages to this approach - the markup is a bit simpler, tabbing via the keyboard is supported without the 'tabindex' attribute, and no additional styling is needed.",{"type":21,"tag":22,"props":69874,"children":69875},{},[69876],{"type":26,"value":69877},"On consideration, though, maybe I've developed a bad habit in doing so - perhaps one that needs to be replaced with a button-based solution. What do you think?",{"type":21,"tag":3490,"props":69879,"children":69880},{},[69881],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":69883},[69884],{"id":69114,"depth":244,"text":69117,"children":69885},[69886],{"id":69187,"depth":279,"text":69190},"content:ckeefer:2013-07:anchors-hash.md","ckeefer/2013-07/anchors-hash.md","ckeefer/2013-07/anchors-hash",{"user":3518,"name":3519},{"_path":69892,"_dir":69101,"_draft":7,"_partial":7,"_locale":8,"title":69893,"description":69894,"publishDate":69895,"excerpt":69894,"body":69896,"_type":3511,"_id":70538,"_source":3513,"_file":70539,"_stem":70540,"_extension":3516,"author":70541},"/ckeefer/2013-07/static-vmware-host","Static Hosting with VMWare","Virtualization is one of the many benefits of the excess (metaphorical) horsepower available to us with modern hardware. Need to test against (Windows XP/7/8/NT || Fedora || Mint || Ubuntu || FreeBSD || MacOSX || etc)? Fire up the VM. Need a Linux environment for the packages your server relies on, but need to test in the iPad simulator? VM's to the rescue.","2013-07-26",{"type":18,"children":69897,"toc":70536},[69898,69902,69907,69921,69926,69937,69957,69986,69991,70191,70204,70209,70338,70343,70408,70427,70432,70473,70486,70527,70532],{"type":21,"tag":22,"props":69899,"children":69900},{},[69901],{"type":26,"value":69894},{"type":21,"tag":22,"props":69903,"children":69904},{},[69905],{"type":26,"value":69906},"But let's look closer at that last example - how do we get at the server running in one VM from the host, or another VM? We might want to test in a specfic OS, or we just might not have any browser's installed/installable in the VM serving us; and we want a predictable point of access. We want a static ip address.",{"type":21,"tag":22,"props":69908,"children":69909},{},[69910,69912,69919],{"type":26,"value":69911},"The following concerns itself with VMWare (particularly VMWare workstation) - I expect you can do something similar with ",{"type":21,"tag":29,"props":69913,"children":69916},{"href":69914,"rel":69915},"http://www.virtualbox.org/manual/ch06.html",[93],[69917],{"type":26,"value":69918},"Virtualbox",{"type":26,"value":69920},", but I've never used it myself - please feel free to hit the comments and contribute if you have!",{"type":21,"tag":22,"props":69922,"children":69923},{},[69924],{"type":26,"value":69925},"So, for our example, let's assume the following: Host OS: Windows 7 Guest OS: Ubuntu 11.10 (named Ubuntu 11.10 in the vmx configuration file - ie. 'Ubuntu 11.10.vmx')",{"type":21,"tag":22,"props":69927,"children":69928},{},[69929,69931],{"type":26,"value":69930},"First, head into the VM and determine the MAC of the virtual machine's ethernet adapter. If you're running linux, head into the terminal and type: ",{"type":21,"tag":63,"props":69932,"children":69934},{"className":69933},[],[69935],{"type":26,"value":69936},"ifconfig",{"type":21,"tag":22,"props":69938,"children":69939},{},[69940,69942,69948,69950,69956],{"type":26,"value":69941},"Look for the ",{"type":21,"tag":63,"props":69943,"children":69945},{"className":69944},[],[69946],{"type":26,"value":69947},"HWAddr",{"type":26,"value":69949}," field in the output from that command, and copy what you see there. It should something like ",{"type":21,"tag":63,"props":69951,"children":69953},{"className":69952},[],[69954],{"type":26,"value":69955},"00:0c:29:c1:90:02",{"type":26,"value":378},{"type":21,"tag":22,"props":69958,"children":69959},{},[69960,69962,69968,69970,69976,69978,69984],{"type":26,"value":69961},"Now, shut down the guest machine completely, and head to the host machine and find your ",{"type":21,"tag":63,"props":69963,"children":69965},{"className":69964},[],[69966],{"type":26,"value":69967},"vmnetdhcp.conf",{"type":26,"value":69969}," file (on Windows 7, this will likely be in your ",{"type":21,"tag":63,"props":69971,"children":69973},{"className":69972},[],[69974],{"type":26,"value":69975},"/programdata/vmware/",{"type":26,"value":69977}," directory). On linux, this file will likely be named ",{"type":21,"tag":63,"props":69979,"children":69981},{"className":69980},[],[69982],{"type":26,"value":69983},"dhcp.conf",{"type":26,"value":69985},", and there may be more than one (one for each virtual ethernet segment). Open it in a text editor.",{"type":21,"tag":22,"props":69987,"children":69988},{},[69989],{"type":26,"value":69990},"You should see some blocks that define virtual ethernet segments used by vmware. These will give you an idea of what ip address block to use for the static address. For instance, if you have an ethernet segment defined as:",{"type":21,"tag":200,"props":69992,"children":69994},{"className":21844,"code":69993,"language":21846,"meta":8,"style":8},"subnet 192.168.152.0 netmask 255.255.255.0 {\nrange 192.168.152.128 192.168.152.254;\noption broadcast-address 192.168.152.255;\noption domain-name-servers 192.168.152.2;\noption domain-name \"localdomain\";\noption netbios-name-servers 192.168.152.2;\noption routers 192.168.152.2;\ndefault-lease-time 1800;\nmax-lease-time 7200;\n}\n",[69995],{"type":21,"tag":63,"props":69996,"children":69997},{"__ignoreMap":8},[69998,70025,70047,70068,70089,70110,70130,70150,70167,70184],{"type":21,"tag":209,"props":69999,"children":70000},{"class":211,"line":212},[70001,70006,70011,70016,70021],{"type":21,"tag":209,"props":70002,"children":70003},{"style":360},[70004],{"type":26,"value":70005},"subnet",{"type":21,"tag":209,"props":70007,"children":70008},{"style":263},[70009],{"type":26,"value":70010}," 192.168.152.0",{"type":21,"tag":209,"props":70012,"children":70013},{"style":233},[70014],{"type":26,"value":70015}," netmask",{"type":21,"tag":209,"props":70017,"children":70018},{"style":263},[70019],{"type":26,"value":70020}," 255.255.255.0",{"type":21,"tag":209,"props":70022,"children":70023},{"style":233},[70024],{"type":26,"value":276},{"type":21,"tag":209,"props":70026,"children":70027},{"class":211,"line":244},[70028,70033,70038,70043],{"type":21,"tag":209,"props":70029,"children":70030},{"style":360},[70031],{"type":26,"value":70032},"range",{"type":21,"tag":209,"props":70034,"children":70035},{"style":263},[70036],{"type":26,"value":70037}," 192.168.152.128",{"type":21,"tag":209,"props":70039,"children":70040},{"style":263},[70041],{"type":26,"value":70042}," 192.168.152.254",{"type":21,"tag":209,"props":70044,"children":70045},{"style":222},[70046],{"type":26,"value":241},{"type":21,"tag":209,"props":70048,"children":70049},{"class":211,"line":254},[70050,70054,70059,70064],{"type":21,"tag":209,"props":70051,"children":70052},{"style":360},[70053],{"type":26,"value":49419},{"type":21,"tag":209,"props":70055,"children":70056},{"style":233},[70057],{"type":26,"value":70058}," broadcast-address",{"type":21,"tag":209,"props":70060,"children":70061},{"style":263},[70062],{"type":26,"value":70063}," 192.168.152.255",{"type":21,"tag":209,"props":70065,"children":70066},{"style":222},[70067],{"type":26,"value":241},{"type":21,"tag":209,"props":70069,"children":70070},{"class":211,"line":279},[70071,70075,70080,70085],{"type":21,"tag":209,"props":70072,"children":70073},{"style":360},[70074],{"type":26,"value":49419},{"type":21,"tag":209,"props":70076,"children":70077},{"style":233},[70078],{"type":26,"value":70079}," domain-name-servers",{"type":21,"tag":209,"props":70081,"children":70082},{"style":263},[70083],{"type":26,"value":70084}," 192.168.152.2",{"type":21,"tag":209,"props":70086,"children":70087},{"style":222},[70088],{"type":26,"value":241},{"type":21,"tag":209,"props":70090,"children":70091},{"class":211,"line":288},[70092,70096,70101,70106],{"type":21,"tag":209,"props":70093,"children":70094},{"style":360},[70095],{"type":26,"value":49419},{"type":21,"tag":209,"props":70097,"children":70098},{"style":233},[70099],{"type":26,"value":70100}," domain-name",{"type":21,"tag":209,"props":70102,"children":70103},{"style":233},[70104],{"type":26,"value":70105}," \"localdomain\"",{"type":21,"tag":209,"props":70107,"children":70108},{"style":222},[70109],{"type":26,"value":241},{"type":21,"tag":209,"props":70111,"children":70112},{"class":211,"line":307},[70113,70117,70122,70126],{"type":21,"tag":209,"props":70114,"children":70115},{"style":360},[70116],{"type":26,"value":49419},{"type":21,"tag":209,"props":70118,"children":70119},{"style":233},[70120],{"type":26,"value":70121}," netbios-name-servers",{"type":21,"tag":209,"props":70123,"children":70124},{"style":263},[70125],{"type":26,"value":70084},{"type":21,"tag":209,"props":70127,"children":70128},{"style":222},[70129],{"type":26,"value":241},{"type":21,"tag":209,"props":70131,"children":70132},{"class":211,"line":325},[70133,70137,70142,70146],{"type":21,"tag":209,"props":70134,"children":70135},{"style":360},[70136],{"type":26,"value":49419},{"type":21,"tag":209,"props":70138,"children":70139},{"style":233},[70140],{"type":26,"value":70141}," routers",{"type":21,"tag":209,"props":70143,"children":70144},{"style":263},[70145],{"type":26,"value":70084},{"type":21,"tag":209,"props":70147,"children":70148},{"style":222},[70149],{"type":26,"value":241},{"type":21,"tag":209,"props":70151,"children":70152},{"class":211,"line":334},[70153,70158,70163],{"type":21,"tag":209,"props":70154,"children":70155},{"style":360},[70156],{"type":26,"value":70157},"default-lease-time",{"type":21,"tag":209,"props":70159,"children":70160},{"style":263},[70161],{"type":26,"value":70162}," 1800",{"type":21,"tag":209,"props":70164,"children":70165},{"style":222},[70166],{"type":26,"value":241},{"type":21,"tag":209,"props":70168,"children":70169},{"class":211,"line":343},[70170,70175,70180],{"type":21,"tag":209,"props":70171,"children":70172},{"style":360},[70173],{"type":26,"value":70174},"max-lease-time",{"type":21,"tag":209,"props":70176,"children":70177},{"style":263},[70178],{"type":26,"value":70179}," 7200",{"type":21,"tag":209,"props":70181,"children":70182},{"style":222},[70183],{"type":26,"value":241},{"type":21,"tag":209,"props":70185,"children":70186},{"class":211,"line":351},[70187],{"type":21,"tag":209,"props":70188,"children":70189},{"style":222},[70190],{"type":26,"value":7798},{"type":21,"tag":22,"props":70192,"children":70193},{},[70194,70196,70202],{"type":26,"value":70195},"Then the first three octets of your address will be ",{"type":21,"tag":63,"props":70197,"children":70199},{"className":70198},[],[70200],{"type":26,"value":70201},"192.168.152",{"type":26,"value":70203},". You'll notice this block reserves .2 for name-servers, and defines the range .128 - .254 for automatic assignation. .1 is also reserved for the host machine. So, we'll want to specify a static address for the guest machine somewhere between .2 and .127.",{"type":21,"tag":22,"props":70205,"children":70206},{},[70207],{"type":26,"value":70208},"Below the ethernet segment declaration block, you should see another block that reserves the .1 address for the host machine. It should look something like:",{"type":21,"tag":200,"props":70210,"children":70212},{"className":21844,"code":70211,"language":21846,"meta":8,"style":8},"host VMnet8 {\nhardware ethernet 00:0c:29:c1:90:02;\nfixed-address 192.168.152.1;\noption domain-name-servers 0.0.0.0;\noption domain-name \"\";\noption routers 0.0.0.0;\n}\n",[70213],{"type":21,"tag":63,"props":70214,"children":70215},{"__ignoreMap":8},[70216,70233,70255,70272,70292,70312,70331],{"type":21,"tag":209,"props":70217,"children":70218},{"class":211,"line":212},[70219,70224,70229],{"type":21,"tag":209,"props":70220,"children":70221},{"style":360},[70222],{"type":26,"value":70223},"host",{"type":21,"tag":209,"props":70225,"children":70226},{"style":233},[70227],{"type":26,"value":70228}," VMnet8",{"type":21,"tag":209,"props":70230,"children":70231},{"style":233},[70232],{"type":26,"value":276},{"type":21,"tag":209,"props":70234,"children":70235},{"class":211,"line":244},[70236,70241,70246,70251],{"type":21,"tag":209,"props":70237,"children":70238},{"style":360},[70239],{"type":26,"value":70240},"hardware",{"type":21,"tag":209,"props":70242,"children":70243},{"style":233},[70244],{"type":26,"value":70245}," ethernet",{"type":21,"tag":209,"props":70247,"children":70248},{"style":233},[70249],{"type":26,"value":70250}," 00:0c:29:c1:90:02",{"type":21,"tag":209,"props":70252,"children":70253},{"style":222},[70254],{"type":26,"value":241},{"type":21,"tag":209,"props":70256,"children":70257},{"class":211,"line":254},[70258,70263,70268],{"type":21,"tag":209,"props":70259,"children":70260},{"style":360},[70261],{"type":26,"value":70262},"fixed-address",{"type":21,"tag":209,"props":70264,"children":70265},{"style":263},[70266],{"type":26,"value":70267}," 192.168.152.1",{"type":21,"tag":209,"props":70269,"children":70270},{"style":222},[70271],{"type":26,"value":241},{"type":21,"tag":209,"props":70273,"children":70274},{"class":211,"line":279},[70275,70279,70283,70288],{"type":21,"tag":209,"props":70276,"children":70277},{"style":360},[70278],{"type":26,"value":49419},{"type":21,"tag":209,"props":70280,"children":70281},{"style":233},[70282],{"type":26,"value":70079},{"type":21,"tag":209,"props":70284,"children":70285},{"style":263},[70286],{"type":26,"value":70287}," 0.0.0.0",{"type":21,"tag":209,"props":70289,"children":70290},{"style":222},[70291],{"type":26,"value":241},{"type":21,"tag":209,"props":70293,"children":70294},{"class":211,"line":288},[70295,70299,70303,70308],{"type":21,"tag":209,"props":70296,"children":70297},{"style":360},[70298],{"type":26,"value":49419},{"type":21,"tag":209,"props":70300,"children":70301},{"style":233},[70302],{"type":26,"value":70100},{"type":21,"tag":209,"props":70304,"children":70305},{"style":233},[70306],{"type":26,"value":70307}," \"\"",{"type":21,"tag":209,"props":70309,"children":70310},{"style":222},[70311],{"type":26,"value":241},{"type":21,"tag":209,"props":70313,"children":70314},{"class":211,"line":307},[70315,70319,70323,70327],{"type":21,"tag":209,"props":70316,"children":70317},{"style":360},[70318],{"type":26,"value":49419},{"type":21,"tag":209,"props":70320,"children":70321},{"style":233},[70322],{"type":26,"value":70141},{"type":21,"tag":209,"props":70324,"children":70325},{"style":263},[70326],{"type":26,"value":70287},{"type":21,"tag":209,"props":70328,"children":70329},{"style":222},[70330],{"type":26,"value":241},{"type":21,"tag":209,"props":70332,"children":70333},{"class":211,"line":325},[70334],{"type":21,"tag":209,"props":70335,"children":70336},{"style":222},[70337],{"type":26,"value":7798},{"type":21,"tag":22,"props":70339,"children":70340},{},[70341],{"type":26,"value":70342},"We'll add our static block beneath that, following the same format. The host name must NOT have any spaces in it - thus, if our virtual machine's name is Ubuntu 11.10, our block will look like:",{"type":21,"tag":200,"props":70344,"children":70346},{"className":21844,"code":70345,"language":21846,"meta":8,"style":8},"host Ubuntu11.10 {\nhardware ethernet 00:0c:29:c1:90:02;\nfixed-address 192.168.152.70;\n}\n",[70347],{"type":21,"tag":63,"props":70348,"children":70349},{"__ignoreMap":8},[70350,70366,70385,70401],{"type":21,"tag":209,"props":70351,"children":70352},{"class":211,"line":212},[70353,70357,70362],{"type":21,"tag":209,"props":70354,"children":70355},{"style":360},[70356],{"type":26,"value":70223},{"type":21,"tag":209,"props":70358,"children":70359},{"style":233},[70360],{"type":26,"value":70361}," Ubuntu11.10",{"type":21,"tag":209,"props":70363,"children":70364},{"style":233},[70365],{"type":26,"value":276},{"type":21,"tag":209,"props":70367,"children":70368},{"class":211,"line":244},[70369,70373,70377,70381],{"type":21,"tag":209,"props":70370,"children":70371},{"style":360},[70372],{"type":26,"value":70240},{"type":21,"tag":209,"props":70374,"children":70375},{"style":233},[70376],{"type":26,"value":70245},{"type":21,"tag":209,"props":70378,"children":70379},{"style":233},[70380],{"type":26,"value":70250},{"type":21,"tag":209,"props":70382,"children":70383},{"style":222},[70384],{"type":26,"value":241},{"type":21,"tag":209,"props":70386,"children":70387},{"class":211,"line":254},[70388,70392,70397],{"type":21,"tag":209,"props":70389,"children":70390},{"style":360},[70391],{"type":26,"value":70262},{"type":21,"tag":209,"props":70393,"children":70394},{"style":263},[70395],{"type":26,"value":70396}," 192.168.152.70",{"type":21,"tag":209,"props":70398,"children":70399},{"style":222},[70400],{"type":26,"value":241},{"type":21,"tag":209,"props":70402,"children":70403},{"class":211,"line":279},[70404],{"type":21,"tag":209,"props":70405,"children":70406},{"style":222},[70407],{"type":26,"value":7798},{"type":21,"tag":22,"props":70409,"children":70410},{},[70411,70412,70418,70420,70425],{"type":26,"value":108},{"type":21,"tag":63,"props":70413,"children":70415},{"className":70414},[],[70416],{"type":26,"value":70417},"hardware ethernet",{"type":26,"value":70419}," field is where you should fill in the HWAddr you copied earlier, and ",{"type":21,"tag":63,"props":70421,"children":70423},{"className":70422},[],[70424],{"type":26,"value":70262},{"type":26,"value":70426}," is where you should enter your desired static ip.",{"type":21,"tag":22,"props":70428,"children":70429},{},[70430],{"type":26,"value":70431},"Now, if you're host machine is windows, open up a cmd window and type:",{"type":21,"tag":200,"props":70433,"children":70435},{"className":21844,"code":70434,"language":21846,"meta":8,"style":8},"net stop VMnetDHCP\nnet start VMnetDHCP\n",[70436],{"type":21,"tag":63,"props":70437,"children":70438},{"__ignoreMap":8},[70439,70457],{"type":21,"tag":209,"props":70440,"children":70441},{"class":211,"line":212},[70442,70447,70452],{"type":21,"tag":209,"props":70443,"children":70444},{"style":360},[70445],{"type":26,"value":70446},"net",{"type":21,"tag":209,"props":70448,"children":70449},{"style":233},[70450],{"type":26,"value":70451}," stop",{"type":21,"tag":209,"props":70453,"children":70454},{"style":233},[70455],{"type":26,"value":70456}," VMnetDHCP\n",{"type":21,"tag":209,"props":70458,"children":70459},{"class":211,"line":244},[70460,70464,70469],{"type":21,"tag":209,"props":70461,"children":70462},{"style":360},[70463],{"type":26,"value":70446},{"type":21,"tag":209,"props":70465,"children":70466},{"style":233},[70467],{"type":26,"value":70468}," start",{"type":21,"tag":209,"props":70470,"children":70471},{"style":233},[70472],{"type":26,"value":70456},{"type":21,"tag":22,"props":70474,"children":70475},{},[70476,70478,70484],{"type":26,"value":70477},"Restarting this service will cause our changes to take effect. All done! If you'd like, you can alter your ",{"type":21,"tag":63,"props":70479,"children":70481},{"className":70480},[],[70482],{"type":26,"value":70483},"hosts",{"type":26,"value":70485}," file to give this static ip a name. Add a line to make it look similar to the following:",{"type":21,"tag":200,"props":70487,"children":70489},{"className":18972,"code":70488,"language":18974,"meta":8,"style":8},"# localhost name resolution is handled within DNS itself.\n127.0.0.1 localhost\n192.168.152.70 name.lan\n",[70490],{"type":21,"tag":63,"props":70491,"children":70492},{"__ignoreMap":8},[70493,70501,70514],{"type":21,"tag":209,"props":70494,"children":70495},{"class":211,"line":212},[70496],{"type":21,"tag":209,"props":70497,"children":70498},{"style":448},[70499],{"type":26,"value":70500},"# localhost name resolution is handled within DNS itself.\n",{"type":21,"tag":209,"props":70502,"children":70503},{"class":211,"line":244},[70504,70509],{"type":21,"tag":209,"props":70505,"children":70506},{"style":360},[70507],{"type":26,"value":70508},"127.0.0.1",{"type":21,"tag":209,"props":70510,"children":70511},{"style":233},[70512],{"type":26,"value":70513}," localhost\n",{"type":21,"tag":209,"props":70515,"children":70516},{"class":211,"line":254},[70517,70522],{"type":21,"tag":209,"props":70518,"children":70519},{"style":360},[70520],{"type":26,"value":70521},"192.168.152.70",{"type":21,"tag":209,"props":70523,"children":70524},{"style":233},[70525],{"type":26,"value":70526}," name.lan\n",{"type":21,"tag":22,"props":70528,"children":70529},{},[70530],{"type":26,"value":70531},"That should do it! Being able to host a linux machine in one VM, and test in another has come in handy more times than I can count. Hope you find it helpful too.",{"type":21,"tag":3490,"props":70533,"children":70534},{},[70535],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":70537},[],"content:ckeefer:2013-07:static-vmware-host.md","ckeefer/2013-07/static-vmware-host.md","ckeefer/2013-07/static-vmware-host",{"user":3518,"name":3519},{"_path":70543,"_dir":70544,"_draft":7,"_partial":7,"_locale":8,"title":70545,"description":70546,"publishDate":70547,"tags":70548,"image":70549,"excerpt":70546,"body":70550,"_type":3511,"_id":80635,"_source":3513,"_file":80636,"_stem":80637,"_extension":3516,"author":80638},"/ckeefer/2014-2/ajax-upload-2","2014-2","Ajax Upload Part II: XHR2 (and FileReader)","So, the client has told you their users should be able to upload their drunken party pictures for all the internet to see. \"We want the very best experience possible,\" they tell you. \"Simple, seamless - maybe using that new html5 thing I've heard so much about.\"","2013-04-09",[12,17599],"/ckeefer/2014-2/img/html5.jpg",{"type":18,"children":70551,"toc":80629},[70552,70556,70561,70575,70581,70601,70679,70684,70727,70732,70744,71065,71070,71076,71089,72291,72303,72308,72314,72337,72342,72347,72352,73425,73430,73443,73448,73452,73457,73469,73483,73488,80625],{"type":21,"tag":22,"props":70553,"children":70554},{},[70555],{"type":26,"value":70546},{"type":21,"tag":22,"props":70557,"children":70558},{},[70559],{"type":26,"value":70560},"You choke back a little bit of hope. You've been disappointed so often. Trying hard to sound non-chalant, you say \"only modern browsers, right?\" You hold your breath. They nod, and on the outside, you nod back. On the inside, you giggle. No flash, no iframe hacks - just ajax, as God (well, the W3C) intended. Ah, beautiful.",{"type":21,"tag":22,"props":70562,"children":70563},{},[70564,70566,70573],{"type":26,"value":70565},"As promised in ",{"type":21,"tag":29,"props":70567,"children":70570},{"href":70568,"rel":70569},"http://blog.artlogic.com/2013/03/20/ajax-upload-part-i-framed-and-jquery-deferred/",[93],[70571],{"type":26,"value":70572},"part I",{"type":26,"value":70574},", we're going take a quick walk through what it takes to upload a file with ajax. We're also going to take a look at reading a file into memory to play with in your app.",{"type":21,"tag":3549,"props":70576,"children":70578},{"id":70577},"inputs-and-drop-targets",[70579],{"type":26,"value":70580},"Inputs and Drop Targets",{"type":21,"tag":22,"props":70582,"children":70583},{},[70584,70586,70592,70593,70599],{"type":26,"value":70585},"So, let's say we have two images of some hip twenty-somethings having a good time, ",{"type":21,"tag":63,"props":70587,"children":70589},{"className":70588},[],[70590],{"type":26,"value":70591},"drunk1.png",{"type":26,"value":7274},{"type":21,"tag":63,"props":70594,"children":70596},{"className":70595},[],[70597],{"type":26,"value":70598},"drunk2.jpg",{"type":26,"value":70600},". Our job is to get these files from the user's computer to our server as simply as possible. The standard input is a familiar way of doing this, but we might also want to take advantage of the new drag and drop capabilities in modern browsers. So, we could have something like:",{"type":21,"tag":200,"props":70602,"children":70604},{"className":7947,"code":70603,"language":7949,"meta":8,"style":8},"\u003Cform>\n\u003Cinput id=\"hupinput\" type=\"file\" />\n\u003C/form>\n",[70605],{"type":21,"tag":63,"props":70606,"children":70607},{"__ignoreMap":8},[70608,70623,70664],{"type":21,"tag":209,"props":70609,"children":70610},{"class":211,"line":212},[70611,70615,70619],{"type":21,"tag":209,"props":70612,"children":70613},{"style":222},[70614],{"type":26,"value":1985},{"type":21,"tag":209,"props":70616,"children":70617},{"style":1988},[70618],{"type":26,"value":24477},{"type":21,"tag":209,"props":70620,"children":70621},{"style":222},[70622],{"type":26,"value":1996},{"type":21,"tag":209,"props":70624,"children":70625},{"class":211,"line":244},[70626,70630,70634,70638,70642,70647,70651,70655,70660],{"type":21,"tag":209,"props":70627,"children":70628},{"style":222},[70629],{"type":26,"value":1985},{"type":21,"tag":209,"props":70631,"children":70632},{"style":1988},[70633],{"type":26,"value":34026},{"type":21,"tag":209,"props":70635,"children":70636},{"style":360},[70637],{"type":26,"value":24498},{"type":21,"tag":209,"props":70639,"children":70640},{"style":222},[70641],{"type":26,"value":1432},{"type":21,"tag":209,"props":70643,"children":70644},{"style":233},[70645],{"type":26,"value":70646},"\"hupinput\"",{"type":21,"tag":209,"props":70648,"children":70649},{"style":360},[70650],{"type":26,"value":24544},{"type":21,"tag":209,"props":70652,"children":70653},{"style":222},[70654],{"type":26,"value":1432},{"type":21,"tag":209,"props":70656,"children":70657},{"style":233},[70658],{"type":26,"value":70659},"\"file\"",{"type":21,"tag":209,"props":70661,"children":70662},{"style":222},[70663],{"type":26,"value":8127},{"type":21,"tag":209,"props":70665,"children":70666},{"class":211,"line":254},[70667,70671,70675],{"type":21,"tag":209,"props":70668,"children":70669},{"style":222},[70670],{"type":26,"value":2024},{"type":21,"tag":209,"props":70672,"children":70673},{"style":1988},[70674],{"type":26,"value":24477},{"type":21,"tag":209,"props":70676,"children":70677},{"style":222},[70678],{"type":26,"value":1996},{"type":21,"tag":22,"props":70680,"children":70681},{},[70682],{"type":26,"value":70683},"or:",{"type":21,"tag":200,"props":70685,"children":70687},{"className":7947,"code":70686,"language":7949,"meta":8,"style":8},"\u003Cdiv id=\"hupdiv\">\u003C/div>\n",[70688],{"type":21,"tag":63,"props":70689,"children":70690},{"__ignoreMap":8},[70691],{"type":21,"tag":209,"props":70692,"children":70693},{"class":211,"line":212},[70694,70698,70702,70706,70710,70715,70719,70723],{"type":21,"tag":209,"props":70695,"children":70696},{"style":222},[70697],{"type":26,"value":1985},{"type":21,"tag":209,"props":70699,"children":70700},{"style":1988},[70701],{"type":26,"value":2009},{"type":21,"tag":209,"props":70703,"children":70704},{"style":360},[70705],{"type":26,"value":24498},{"type":21,"tag":209,"props":70707,"children":70708},{"style":222},[70709],{"type":26,"value":1432},{"type":21,"tag":209,"props":70711,"children":70712},{"style":233},[70713],{"type":26,"value":70714},"\"hupdiv\"",{"type":21,"tag":209,"props":70716,"children":70717},{"style":222},[70718],{"type":26,"value":24512},{"type":21,"tag":209,"props":70720,"children":70721},{"style":1988},[70722],{"type":26,"value":2009},{"type":21,"tag":209,"props":70724,"children":70725},{"style":222},[70726],{"type":26,"value":1996},{"type":21,"tag":22,"props":70728,"children":70729},{},[70730],{"type":26,"value":70731},"and then just define some styles that will give us a properly sized drop target.",{"type":21,"tag":22,"props":70733,"children":70734},{},[70735,70737,70742],{"type":26,"value":70736},"Now, the drag and drop api in html5 is a little strange. We need to ",{"type":21,"tag":5270,"props":70738,"children":70739},{},[70740],{"type":26,"value":70741},"cancel",{"type":26,"value":70743}," the default action and stop propagation for dragover and drop in order to allow something to be drag and dropped. The idea seems to be that the default action is to not allow anything to be dragged and dropped. You'll just have to swing with it.",{"type":21,"tag":200,"props":70745,"children":70747},{"className":9044,"code":70746,"language":9046,"meta":8,"style":8},"$('inputname').off('dragover').on('dragover', function(event){\n    event = event.originalEvent;\n    event.preventDefault();\n    event.stopPropagation();\n});\n\nvar files;\n$('inputname').off('drop change').on('drop change', function(event){\n    event = event.originalEvent;\n    event.preventDefault();\n    event.stopPropagation();\n    // if drop and drag target\n    files = event.dataTransfer.files;\n    // or if an input\n    files = event.target.files;\n});\n\n",[70748],{"type":21,"tag":63,"props":70749,"children":70750},{"__ignoreMap":8},[70751,70821,70838,70854,70870,70877,70884,70896,70964,70979,70994,71009,71017,71034,71042,71058],{"type":21,"tag":209,"props":70752,"children":70753},{"class":211,"line":212},[70754,70758,70762,70767,70771,70776,70780,70785,70789,70793,70797,70801,70805,70809,70813,70817],{"type":21,"tag":209,"props":70755,"children":70756},{"style":360},[70757],{"type":26,"value":10250},{"type":21,"tag":209,"props":70759,"children":70760},{"style":222},[70761],{"type":26,"value":368},{"type":21,"tag":209,"props":70763,"children":70764},{"style":233},[70765],{"type":26,"value":70766},"'inputname'",{"type":21,"tag":209,"props":70768,"children":70769},{"style":222},[70770],{"type":26,"value":2699},{"type":21,"tag":209,"props":70772,"children":70773},{"style":360},[70774],{"type":26,"value":70775},"off",{"type":21,"tag":209,"props":70777,"children":70778},{"style":222},[70779],{"type":26,"value":368},{"type":21,"tag":209,"props":70781,"children":70782},{"style":233},[70783],{"type":26,"value":70784},"'dragover'",{"type":21,"tag":209,"props":70786,"children":70787},{"style":222},[70788],{"type":26,"value":2699},{"type":21,"tag":209,"props":70790,"children":70791},{"style":360},[70792],{"type":26,"value":363},{"type":21,"tag":209,"props":70794,"children":70795},{"style":222},[70796],{"type":26,"value":368},{"type":21,"tag":209,"props":70798,"children":70799},{"style":233},[70800],{"type":26,"value":70784},{"type":21,"tag":209,"props":70802,"children":70803},{"style":222},[70804],{"type":26,"value":408},{"type":21,"tag":209,"props":70806,"children":70807},{"style":216},[70808],{"type":26,"value":5370},{"type":21,"tag":209,"props":70810,"children":70811},{"style":222},[70812],{"type":26,"value":368},{"type":21,"tag":209,"props":70814,"children":70815},{"style":400},[70816],{"type":26,"value":10794},{"type":21,"tag":209,"props":70818,"children":70819},{"style":222},[70820],{"type":26,"value":2369},{"type":21,"tag":209,"props":70822,"children":70823},{"class":211,"line":244},[70824,70829,70833],{"type":21,"tag":209,"props":70825,"children":70826},{"style":222},[70827],{"type":26,"value":70828},"    event ",{"type":21,"tag":209,"props":70830,"children":70831},{"style":216},[70832],{"type":26,"value":1432},{"type":21,"tag":209,"props":70834,"children":70835},{"style":222},[70836],{"type":26,"value":70837}," event.originalEvent;\n",{"type":21,"tag":209,"props":70839,"children":70840},{"class":211,"line":254},[70841,70845,70850],{"type":21,"tag":209,"props":70842,"children":70843},{"style":222},[70844],{"type":26,"value":11587},{"type":21,"tag":209,"props":70846,"children":70847},{"style":360},[70848],{"type":26,"value":70849},"preventDefault",{"type":21,"tag":209,"props":70851,"children":70852},{"style":222},[70853],{"type":26,"value":4842},{"type":21,"tag":209,"props":70855,"children":70856},{"class":211,"line":279},[70857,70861,70866],{"type":21,"tag":209,"props":70858,"children":70859},{"style":222},[70860],{"type":26,"value":11587},{"type":21,"tag":209,"props":70862,"children":70863},{"style":360},[70864],{"type":26,"value":70865},"stopPropagation",{"type":21,"tag":209,"props":70867,"children":70868},{"style":222},[70869],{"type":26,"value":4842},{"type":21,"tag":209,"props":70871,"children":70872},{"class":211,"line":288},[70873],{"type":21,"tag":209,"props":70874,"children":70875},{"style":222},[70876],{"type":26,"value":469},{"type":21,"tag":209,"props":70878,"children":70879},{"class":211,"line":307},[70880],{"type":21,"tag":209,"props":70881,"children":70882},{"emptyLinePlaceholder":248},[70883],{"type":26,"value":251},{"type":21,"tag":209,"props":70885,"children":70886},{"class":211,"line":325},[70887,70891],{"type":21,"tag":209,"props":70888,"children":70889},{"style":216},[70890],{"type":26,"value":8996},{"type":21,"tag":209,"props":70892,"children":70893},{"style":222},[70894],{"type":26,"value":70895}," files;\n",{"type":21,"tag":209,"props":70897,"children":70898},{"class":211,"line":334},[70899,70903,70907,70911,70915,70919,70923,70928,70932,70936,70940,70944,70948,70952,70956,70960],{"type":21,"tag":209,"props":70900,"children":70901},{"style":360},[70902],{"type":26,"value":10250},{"type":21,"tag":209,"props":70904,"children":70905},{"style":222},[70906],{"type":26,"value":368},{"type":21,"tag":209,"props":70908,"children":70909},{"style":233},[70910],{"type":26,"value":70766},{"type":21,"tag":209,"props":70912,"children":70913},{"style":222},[70914],{"type":26,"value":2699},{"type":21,"tag":209,"props":70916,"children":70917},{"style":360},[70918],{"type":26,"value":70775},{"type":21,"tag":209,"props":70920,"children":70921},{"style":222},[70922],{"type":26,"value":368},{"type":21,"tag":209,"props":70924,"children":70925},{"style":233},[70926],{"type":26,"value":70927},"'drop change'",{"type":21,"tag":209,"props":70929,"children":70930},{"style":222},[70931],{"type":26,"value":2699},{"type":21,"tag":209,"props":70933,"children":70934},{"style":360},[70935],{"type":26,"value":363},{"type":21,"tag":209,"props":70937,"children":70938},{"style":222},[70939],{"type":26,"value":368},{"type":21,"tag":209,"props":70941,"children":70942},{"style":233},[70943],{"type":26,"value":70927},{"type":21,"tag":209,"props":70945,"children":70946},{"style":222},[70947],{"type":26,"value":408},{"type":21,"tag":209,"props":70949,"children":70950},{"style":216},[70951],{"type":26,"value":5370},{"type":21,"tag":209,"props":70953,"children":70954},{"style":222},[70955],{"type":26,"value":368},{"type":21,"tag":209,"props":70957,"children":70958},{"style":400},[70959],{"type":26,"value":10794},{"type":21,"tag":209,"props":70961,"children":70962},{"style":222},[70963],{"type":26,"value":2369},{"type":21,"tag":209,"props":70965,"children":70966},{"class":211,"line":343},[70967,70971,70975],{"type":21,"tag":209,"props":70968,"children":70969},{"style":222},[70970],{"type":26,"value":70828},{"type":21,"tag":209,"props":70972,"children":70973},{"style":216},[70974],{"type":26,"value":1432},{"type":21,"tag":209,"props":70976,"children":70977},{"style":222},[70978],{"type":26,"value":70837},{"type":21,"tag":209,"props":70980,"children":70981},{"class":211,"line":351},[70982,70986,70990],{"type":21,"tag":209,"props":70983,"children":70984},{"style":222},[70985],{"type":26,"value":11587},{"type":21,"tag":209,"props":70987,"children":70988},{"style":360},[70989],{"type":26,"value":70849},{"type":21,"tag":209,"props":70991,"children":70992},{"style":222},[70993],{"type":26,"value":4842},{"type":21,"tag":209,"props":70995,"children":70996},{"class":211,"line":444},[70997,71001,71005],{"type":21,"tag":209,"props":70998,"children":70999},{"style":222},[71000],{"type":26,"value":11587},{"type":21,"tag":209,"props":71002,"children":71003},{"style":360},[71004],{"type":26,"value":70865},{"type":21,"tag":209,"props":71006,"children":71007},{"style":222},[71008],{"type":26,"value":4842},{"type":21,"tag":209,"props":71010,"children":71011},{"class":211,"line":454},[71012],{"type":21,"tag":209,"props":71013,"children":71014},{"style":448},[71015],{"type":26,"value":71016},"    // if drop and drag target\n",{"type":21,"tag":209,"props":71018,"children":71019},{"class":211,"line":463},[71020,71025,71029],{"type":21,"tag":209,"props":71021,"children":71022},{"style":222},[71023],{"type":26,"value":71024},"    files ",{"type":21,"tag":209,"props":71026,"children":71027},{"style":216},[71028],{"type":26,"value":1432},{"type":21,"tag":209,"props":71030,"children":71031},{"style":222},[71032],{"type":26,"value":71033}," event.dataTransfer.files;\n",{"type":21,"tag":209,"props":71035,"children":71036},{"class":211,"line":472},[71037],{"type":21,"tag":209,"props":71038,"children":71039},{"style":448},[71040],{"type":26,"value":71041},"    // or if an input\n",{"type":21,"tag":209,"props":71043,"children":71044},{"class":211,"line":480},[71045,71049,71053],{"type":21,"tag":209,"props":71046,"children":71047},{"style":222},[71048],{"type":26,"value":71024},{"type":21,"tag":209,"props":71050,"children":71051},{"style":216},[71052],{"type":26,"value":1432},{"type":21,"tag":209,"props":71054,"children":71055},{"style":222},[71056],{"type":26,"value":71057}," event.target.files;\n",{"type":21,"tag":209,"props":71059,"children":71060},{"class":211,"line":489},[71061],{"type":21,"tag":209,"props":71062,"children":71063},{"style":222},[71064],{"type":26,"value":469},{"type":21,"tag":22,"props":71066,"children":71067},{},[71068],{"type":26,"value":71069},"End result of this is that we'll end up with a FileList object that acts like an array, with each element being a reference to a file. We can then iterate through it to upload or read our files.",{"type":21,"tag":3549,"props":71071,"children":71073},{"id":71072},"uploading",[71074],{"type":26,"value":71075},"Uploading",{"type":21,"tag":22,"props":71077,"children":71078},{},[71079,71081,71087],{"type":26,"value":71080},"XHR2 introduces some new features, with the ones of interest being the new ",{"type":21,"tag":29,"props":71082,"children":71084},{"href":71083},"www.w3.org/TR/XMLHttpRequest/",[71085],{"type":26,"value":71086},"upload attribute on xhr",{"type":26,"value":71088},", which returns an XMLHttpRequestUpload object. This exposes the progress of an upload to us. Otherwise, we'll be using the standard send() call with an ArrayBuffer of the file to upload it. Here's what part of the setup and upload looks like in the plugin we'll be discussing shortly:",{"type":21,"tag":200,"props":71090,"children":71092},{"className":9044,"code":71091,"language":9046,"meta":8,"style":8},"    /**\n     * Deferred wrapper for xhr upload.\n     * @param options\n     * @param file\n     * @returns {Object} promise The deferred promise object.\n     * @constructor\n     */\n    function DeferXhr(options, file){\n        var that = this;\n\n    this.defer = $.Deferred();\n    this.file = file;\n    this.options = options;\n    this.paused = false;\n    this.progress = 0;\n    this.xhr = new XMLHttpRequest();\n\n    if (this.options.chunked)\n    {\n        this.start = 0;\n        this.end = Math.min(this.start+this.options.chunk_size, this.file.size);\n    }\n\n    this.xhr.addEventListener('load', function(){that.complete();}, false);\n    this.xhr.upload.addEventListener('progress', function(event){that.uploadProgress(event);}, false);\n    this.xhr.upload.addEventListener('error', function(event){that.uploadError(event);}, false);\n\n    this.upload();\n\n    return this.defer.promise();\n}\n\n/**\n * Carry out the xhr upload, optionally chunked.\n */\nDeferXhr.prototype.upload = function(){\n\n    this.xhr.open(this.options.type, this.options.url, this.options.async);\n    this.xhr.setRequestHeader('Accept', 'application/json');\n    this.xhr.setRequestHeader('X-File-Name', this.file.name);\n    this.xhr.setRequestHeader('X-File-Type', this.file.type);\n\n    if (this.options.chunked)\n    {\n        this.xhr.overrideMimeType('application/octet-stream');\n        this.xhr.setRequestHeader('Content-Range', 'bytes '+this.start+\"-\"+this.end+'/'+this.file.size);\n        this.xhr.send(this.file.slice(this.start, this.end));\n    }\n    else\n    {\n        this.xhr.overrideMimeType((this.file.type || 'application/octet-stream'));\n        this.xhr.send(this.file);\n    }\n}\n",[71093],{"type":21,"tag":63,"props":71094,"children":71095},{"__ignoreMap":8},[71096,71103,71111,71127,71143,71163,71174,71181,71212,71235,71242,71270,71291,71312,71336,71359,71387,71394,71413,71420,71444,71504,71511,71518,71573,71635,71695,71702,71721,71728,71751,71758,71765,71772,71780,71787,71822,71829,71875,71911,71948,71985,71992,72011,72018,72046,72132,72186,72193,72201,72208,72249,72277,72284],{"type":21,"tag":209,"props":71097,"children":71098},{"class":211,"line":212},[71099],{"type":21,"tag":209,"props":71100,"children":71101},{"style":448},[71102],{"type":26,"value":4697},{"type":21,"tag":209,"props":71104,"children":71105},{"class":211,"line":244},[71106],{"type":21,"tag":209,"props":71107,"children":71108},{"style":448},[71109],{"type":26,"value":71110},"     * Deferred wrapper for xhr upload.\n",{"type":21,"tag":209,"props":71112,"children":71113},{"class":211,"line":254},[71114,71118,71122],{"type":21,"tag":209,"props":71115,"children":71116},{"style":448},[71117],{"type":26,"value":4713},{"type":21,"tag":209,"props":71119,"children":71120},{"style":216},[71121],{"type":26,"value":4718},{"type":21,"tag":209,"props":71123,"children":71124},{"style":222},[71125],{"type":26,"value":71126}," options\n",{"type":21,"tag":209,"props":71128,"children":71129},{"class":211,"line":279},[71130,71134,71138],{"type":21,"tag":209,"props":71131,"children":71132},{"style":448},[71133],{"type":26,"value":4713},{"type":21,"tag":209,"props":71135,"children":71136},{"style":216},[71137],{"type":26,"value":4718},{"type":21,"tag":209,"props":71139,"children":71140},{"style":222},[71141],{"type":26,"value":71142}," file\n",{"type":21,"tag":209,"props":71144,"children":71145},{"class":211,"line":288},[71146,71150,71154,71158],{"type":21,"tag":209,"props":71147,"children":71148},{"style":448},[71149],{"type":26,"value":4713},{"type":21,"tag":209,"props":71151,"children":71152},{"style":216},[71153],{"type":26,"value":4740},{"type":21,"tag":209,"props":71155,"children":71156},{"style":360},[71157],{"type":26,"value":67802},{"type":21,"tag":209,"props":71159,"children":71160},{"style":448},[71161],{"type":26,"value":71162}," promise The deferred promise object.\n",{"type":21,"tag":209,"props":71164,"children":71165},{"class":211,"line":307},[71166,71170],{"type":21,"tag":209,"props":71167,"children":71168},{"style":448},[71169],{"type":26,"value":4713},{"type":21,"tag":209,"props":71171,"children":71172},{"style":216},[71173],{"type":26,"value":46286},{"type":21,"tag":209,"props":71175,"children":71176},{"class":211,"line":325},[71177],{"type":21,"tag":209,"props":71178,"children":71179},{"style":448},[71180],{"type":26,"value":4753},{"type":21,"tag":209,"props":71182,"children":71183},{"class":211,"line":334},[71184,71188,71192,71196,71200,71204,71208],{"type":21,"tag":209,"props":71185,"children":71186},{"style":216},[71187],{"type":26,"value":2981},{"type":21,"tag":209,"props":71189,"children":71190},{"style":360},[71191],{"type":26,"value":57995},{"type":21,"tag":209,"props":71193,"children":71194},{"style":222},[71195],{"type":26,"value":368},{"type":21,"tag":209,"props":71197,"children":71198},{"style":400},[71199],{"type":26,"value":29825},{"type":21,"tag":209,"props":71201,"children":71202},{"style":222},[71203],{"type":26,"value":408},{"type":21,"tag":209,"props":71205,"children":71206},{"style":400},[71207],{"type":26,"value":19799},{"type":21,"tag":209,"props":71209,"children":71210},{"style":222},[71211],{"type":26,"value":2369},{"type":21,"tag":209,"props":71213,"children":71214},{"class":211,"line":343},[71215,71219,71223,71227,71231],{"type":21,"tag":209,"props":71216,"children":71217},{"style":216},[71218],{"type":26,"value":5925},{"type":21,"tag":209,"props":71220,"children":71221},{"style":222},[71222],{"type":26,"value":57248},{"type":21,"tag":209,"props":71224,"children":71225},{"style":216},[71226],{"type":26,"value":1432},{"type":21,"tag":209,"props":71228,"children":71229},{"style":263},[71230],{"type":26,"value":17698},{"type":21,"tag":209,"props":71232,"children":71233},{"style":222},[71234],{"type":26,"value":241},{"type":21,"tag":209,"props":71236,"children":71237},{"class":211,"line":351},[71238],{"type":21,"tag":209,"props":71239,"children":71240},{"emptyLinePlaceholder":248},[71241],{"type":26,"value":251},{"type":21,"tag":209,"props":71243,"children":71244},{"class":211,"line":444},[71245,71249,71254,71258,71262,71266],{"type":21,"tag":209,"props":71246,"children":71247},{"style":263},[71248],{"type":26,"value":51112},{"type":21,"tag":209,"props":71250,"children":71251},{"style":222},[71252],{"type":26,"value":71253},".defer ",{"type":21,"tag":209,"props":71255,"children":71256},{"style":216},[71257],{"type":26,"value":1432},{"type":21,"tag":209,"props":71259,"children":71260},{"style":222},[71261],{"type":26,"value":26905},{"type":21,"tag":209,"props":71263,"children":71264},{"style":360},[71265],{"type":26,"value":26910},{"type":21,"tag":209,"props":71267,"children":71268},{"style":222},[71269],{"type":26,"value":4842},{"type":21,"tag":209,"props":71271,"children":71272},{"class":211,"line":454},[71273,71277,71282,71286],{"type":21,"tag":209,"props":71274,"children":71275},{"style":263},[71276],{"type":26,"value":51112},{"type":21,"tag":209,"props":71278,"children":71279},{"style":222},[71280],{"type":26,"value":71281},".file ",{"type":21,"tag":209,"props":71283,"children":71284},{"style":216},[71285],{"type":26,"value":1432},{"type":21,"tag":209,"props":71287,"children":71288},{"style":222},[71289],{"type":26,"value":71290}," file;\n",{"type":21,"tag":209,"props":71292,"children":71293},{"class":211,"line":463},[71294,71298,71303,71307],{"type":21,"tag":209,"props":71295,"children":71296},{"style":263},[71297],{"type":26,"value":51112},{"type":21,"tag":209,"props":71299,"children":71300},{"style":222},[71301],{"type":26,"value":71302},".options ",{"type":21,"tag":209,"props":71304,"children":71305},{"style":216},[71306],{"type":26,"value":1432},{"type":21,"tag":209,"props":71308,"children":71309},{"style":222},[71310],{"type":26,"value":71311}," options;\n",{"type":21,"tag":209,"props":71313,"children":71314},{"class":211,"line":472},[71315,71319,71324,71328,71332],{"type":21,"tag":209,"props":71316,"children":71317},{"style":263},[71318],{"type":26,"value":51112},{"type":21,"tag":209,"props":71320,"children":71321},{"style":222},[71322],{"type":26,"value":71323},".paused ",{"type":21,"tag":209,"props":71325,"children":71326},{"style":216},[71327],{"type":26,"value":1432},{"type":21,"tag":209,"props":71329,"children":71330},{"style":263},[71331],{"type":26,"value":5455},{"type":21,"tag":209,"props":71333,"children":71334},{"style":222},[71335],{"type":26,"value":241},{"type":21,"tag":209,"props":71337,"children":71338},{"class":211,"line":480},[71339,71343,71347,71351,71355],{"type":21,"tag":209,"props":71340,"children":71341},{"style":263},[71342],{"type":26,"value":51112},{"type":21,"tag":209,"props":71344,"children":71345},{"style":222},[71346],{"type":26,"value":61248},{"type":21,"tag":209,"props":71348,"children":71349},{"style":216},[71350],{"type":26,"value":1432},{"type":21,"tag":209,"props":71352,"children":71353},{"style":263},[71354],{"type":26,"value":17197},{"type":21,"tag":209,"props":71356,"children":71357},{"style":222},[71358],{"type":26,"value":241},{"type":21,"tag":209,"props":71360,"children":71361},{"class":211,"line":489},[71362,71366,71371,71375,71379,71383],{"type":21,"tag":209,"props":71363,"children":71364},{"style":263},[71365],{"type":26,"value":51112},{"type":21,"tag":209,"props":71367,"children":71368},{"style":222},[71369],{"type":26,"value":71370},".xhr ",{"type":21,"tag":209,"props":71372,"children":71373},{"style":216},[71374],{"type":26,"value":1432},{"type":21,"tag":209,"props":71376,"children":71377},{"style":216},[71378],{"type":26,"value":4667},{"type":21,"tag":209,"props":71380,"children":71381},{"style":360},[71382],{"type":26,"value":17634},{"type":21,"tag":209,"props":71384,"children":71385},{"style":222},[71386],{"type":26,"value":4842},{"type":21,"tag":209,"props":71388,"children":71389},{"class":211,"line":847},[71390],{"type":21,"tag":209,"props":71391,"children":71392},{"emptyLinePlaceholder":248},[71393],{"type":26,"value":251},{"type":21,"tag":209,"props":71395,"children":71396},{"class":211,"line":860},[71397,71401,71405,71409],{"type":21,"tag":209,"props":71398,"children":71399},{"style":216},[71400],{"type":26,"value":10853},{"type":21,"tag":209,"props":71402,"children":71403},{"style":222},[71404],{"type":26,"value":4776},{"type":21,"tag":209,"props":71406,"children":71407},{"style":263},[71408],{"type":26,"value":2508},{"type":21,"tag":209,"props":71410,"children":71411},{"style":222},[71412],{"type":26,"value":61286},{"type":21,"tag":209,"props":71414,"children":71415},{"class":211,"line":877},[71416],{"type":21,"tag":209,"props":71417,"children":71418},{"style":222},[71419],{"type":26,"value":37029},{"type":21,"tag":209,"props":71421,"children":71422},{"class":211,"line":889},[71423,71427,71432,71436,71440],{"type":21,"tag":209,"props":71424,"children":71425},{"style":263},[71426],{"type":26,"value":51473},{"type":21,"tag":209,"props":71428,"children":71429},{"style":222},[71430],{"type":26,"value":71431},".start ",{"type":21,"tag":209,"props":71433,"children":71434},{"style":216},[71435],{"type":26,"value":1432},{"type":21,"tag":209,"props":71437,"children":71438},{"style":263},[71439],{"type":26,"value":17197},{"type":21,"tag":209,"props":71441,"children":71442},{"style":222},[71443],{"type":26,"value":241},{"type":21,"tag":209,"props":71445,"children":71446},{"class":211,"line":902},[71447,71451,71456,71460,71465,71470,71474,71478,71483,71487,71491,71496,71500],{"type":21,"tag":209,"props":71448,"children":71449},{"style":263},[71450],{"type":26,"value":51473},{"type":21,"tag":209,"props":71452,"children":71453},{"style":222},[71454],{"type":26,"value":71455},".end ",{"type":21,"tag":209,"props":71457,"children":71458},{"style":216},[71459],{"type":26,"value":1432},{"type":21,"tag":209,"props":71461,"children":71462},{"style":222},[71463],{"type":26,"value":71464}," Math.",{"type":21,"tag":209,"props":71466,"children":71467},{"style":360},[71468],{"type":26,"value":71469},"min",{"type":21,"tag":209,"props":71471,"children":71472},{"style":222},[71473],{"type":26,"value":368},{"type":21,"tag":209,"props":71475,"children":71476},{"style":263},[71477],{"type":26,"value":2508},{"type":21,"tag":209,"props":71479,"children":71480},{"style":222},[71481],{"type":26,"value":71482},".start",{"type":21,"tag":209,"props":71484,"children":71485},{"style":216},[71486],{"type":26,"value":10237},{"type":21,"tag":209,"props":71488,"children":71489},{"style":263},[71490],{"type":26,"value":2508},{"type":21,"tag":209,"props":71492,"children":71493},{"style":222},[71494],{"type":26,"value":71495},".options.chunk_size, ",{"type":21,"tag":209,"props":71497,"children":71498},{"style":263},[71499],{"type":26,"value":2508},{"type":21,"tag":209,"props":71501,"children":71502},{"style":222},[71503],{"type":26,"value":61336},{"type":21,"tag":209,"props":71505,"children":71506},{"class":211,"line":914},[71507],{"type":21,"tag":209,"props":71508,"children":71509},{"style":222},[71510],{"type":26,"value":331},{"type":21,"tag":209,"props":71512,"children":71513},{"class":211,"line":922},[71514],{"type":21,"tag":209,"props":71515,"children":71516},{"emptyLinePlaceholder":248},[71517],{"type":26,"value":251},{"type":21,"tag":209,"props":71519,"children":71520},{"class":211,"line":2312},[71521,71525,71530,71534,71538,71542,71546,71550,71555,71560,71565,71569],{"type":21,"tag":209,"props":71522,"children":71523},{"style":263},[71524],{"type":26,"value":51112},{"type":21,"tag":209,"props":71526,"children":71527},{"style":222},[71528],{"type":26,"value":71529},".xhr.",{"type":21,"tag":209,"props":71531,"children":71532},{"style":360},[71533],{"type":26,"value":6424},{"type":21,"tag":209,"props":71535,"children":71536},{"style":222},[71537],{"type":26,"value":368},{"type":21,"tag":209,"props":71539,"children":71540},{"style":233},[71541],{"type":26,"value":11055},{"type":21,"tag":209,"props":71543,"children":71544},{"style":222},[71545],{"type":26,"value":408},{"type":21,"tag":209,"props":71547,"children":71548},{"style":216},[71549],{"type":26,"value":5370},{"type":21,"tag":209,"props":71551,"children":71552},{"style":222},[71553],{"type":26,"value":71554},"(){that.",{"type":21,"tag":209,"props":71556,"children":71557},{"style":360},[71558],{"type":26,"value":71559},"complete",{"type":21,"tag":209,"props":71561,"children":71562},{"style":222},[71563],{"type":26,"value":71564},"();}, ",{"type":21,"tag":209,"props":71566,"children":71567},{"style":263},[71568],{"type":26,"value":27598},{"type":21,"tag":209,"props":71570,"children":71571},{"style":222},[71572],{"type":26,"value":2608},{"type":21,"tag":209,"props":71574,"children":71575},{"class":211,"line":2321},[71576,71580,71585,71589,71593,71598,71602,71606,71610,71614,71618,71622,71627,71631],{"type":21,"tag":209,"props":71577,"children":71578},{"style":263},[71579],{"type":26,"value":51112},{"type":21,"tag":209,"props":71581,"children":71582},{"style":222},[71583],{"type":26,"value":71584},".xhr.upload.",{"type":21,"tag":209,"props":71586,"children":71587},{"style":360},[71588],{"type":26,"value":6424},{"type":21,"tag":209,"props":71590,"children":71591},{"style":222},[71592],{"type":26,"value":368},{"type":21,"tag":209,"props":71594,"children":71595},{"style":233},[71596],{"type":26,"value":71597},"'progress'",{"type":21,"tag":209,"props":71599,"children":71600},{"style":222},[71601],{"type":26,"value":408},{"type":21,"tag":209,"props":71603,"children":71604},{"style":216},[71605],{"type":26,"value":5370},{"type":21,"tag":209,"props":71607,"children":71608},{"style":222},[71609],{"type":26,"value":368},{"type":21,"tag":209,"props":71611,"children":71612},{"style":400},[71613],{"type":26,"value":10794},{"type":21,"tag":209,"props":71615,"children":71616},{"style":222},[71617],{"type":26,"value":67521},{"type":21,"tag":209,"props":71619,"children":71620},{"style":360},[71621],{"type":26,"value":61197},{"type":21,"tag":209,"props":71623,"children":71624},{"style":222},[71625],{"type":26,"value":71626},"(event);}, ",{"type":21,"tag":209,"props":71628,"children":71629},{"style":263},[71630],{"type":26,"value":27598},{"type":21,"tag":209,"props":71632,"children":71633},{"style":222},[71634],{"type":26,"value":2608},{"type":21,"tag":209,"props":71636,"children":71637},{"class":211,"line":2372},[71638,71642,71646,71650,71654,71658,71662,71666,71670,71674,71678,71683,71687,71691],{"type":21,"tag":209,"props":71639,"children":71640},{"style":263},[71641],{"type":26,"value":51112},{"type":21,"tag":209,"props":71643,"children":71644},{"style":222},[71645],{"type":26,"value":71584},{"type":21,"tag":209,"props":71647,"children":71648},{"style":360},[71649],{"type":26,"value":6424},{"type":21,"tag":209,"props":71651,"children":71652},{"style":222},[71653],{"type":26,"value":368},{"type":21,"tag":209,"props":71655,"children":71656},{"style":233},[71657],{"type":26,"value":17784},{"type":21,"tag":209,"props":71659,"children":71660},{"style":222},[71661],{"type":26,"value":408},{"type":21,"tag":209,"props":71663,"children":71664},{"style":216},[71665],{"type":26,"value":5370},{"type":21,"tag":209,"props":71667,"children":71668},{"style":222},[71669],{"type":26,"value":368},{"type":21,"tag":209,"props":71671,"children":71672},{"style":400},[71673],{"type":26,"value":10794},{"type":21,"tag":209,"props":71675,"children":71676},{"style":222},[71677],{"type":26,"value":67521},{"type":21,"tag":209,"props":71679,"children":71680},{"style":360},[71681],{"type":26,"value":71682},"uploadError",{"type":21,"tag":209,"props":71684,"children":71685},{"style":222},[71686],{"type":26,"value":71626},{"type":21,"tag":209,"props":71688,"children":71689},{"style":263},[71690],{"type":26,"value":27598},{"type":21,"tag":209,"props":71692,"children":71693},{"style":222},[71694],{"type":26,"value":2608},{"type":21,"tag":209,"props":71696,"children":71697},{"class":211,"line":2381},[71698],{"type":21,"tag":209,"props":71699,"children":71700},{"emptyLinePlaceholder":248},[71701],{"type":26,"value":251},{"type":21,"tag":209,"props":71703,"children":71704},{"class":211,"line":2389},[71705,71709,71713,71717],{"type":21,"tag":209,"props":71706,"children":71707},{"style":263},[71708],{"type":26,"value":51112},{"type":21,"tag":209,"props":71710,"children":71711},{"style":222},[71712],{"type":26,"value":378},{"type":21,"tag":209,"props":71714,"children":71715},{"style":360},[71716],{"type":26,"value":32649},{"type":21,"tag":209,"props":71718,"children":71719},{"style":222},[71720],{"type":26,"value":4842},{"type":21,"tag":209,"props":71722,"children":71723},{"class":211,"line":2397},[71724],{"type":21,"tag":209,"props":71725,"children":71726},{"emptyLinePlaceholder":248},[71727],{"type":26,"value":251},{"type":21,"tag":209,"props":71729,"children":71730},{"class":211,"line":2406},[71731,71735,71739,71743,71747],{"type":21,"tag":209,"props":71732,"children":71733},{"style":216},[71734],{"type":26,"value":1298},{"type":21,"tag":209,"props":71736,"children":71737},{"style":263},[71738],{"type":26,"value":17698},{"type":21,"tag":209,"props":71740,"children":71741},{"style":222},[71742],{"type":26,"value":61531},{"type":21,"tag":209,"props":71744,"children":71745},{"style":360},[71746],{"type":26,"value":27809},{"type":21,"tag":209,"props":71748,"children":71749},{"style":222},[71750],{"type":26,"value":4842},{"type":21,"tag":209,"props":71752,"children":71753},{"class":211,"line":2415},[71754],{"type":21,"tag":209,"props":71755,"children":71756},{"style":222},[71757],{"type":26,"value":7798},{"type":21,"tag":209,"props":71759,"children":71760},{"class":211,"line":2424},[71761],{"type":21,"tag":209,"props":71762,"children":71763},{"emptyLinePlaceholder":248},[71764],{"type":26,"value":251},{"type":21,"tag":209,"props":71766,"children":71767},{"class":211,"line":2433},[71768],{"type":21,"tag":209,"props":71769,"children":71770},{"style":448},[71771],{"type":26,"value":731},{"type":21,"tag":209,"props":71773,"children":71774},{"class":211,"line":2442},[71775],{"type":21,"tag":209,"props":71776,"children":71777},{"style":448},[71778],{"type":26,"value":71779}," * Carry out the xhr upload, optionally chunked.\n",{"type":21,"tag":209,"props":71781,"children":71782},{"class":211,"line":2471},[71783],{"type":21,"tag":209,"props":71784,"children":71785},{"style":448},[71786],{"type":26,"value":755},{"type":21,"tag":209,"props":71788,"children":71789},{"class":211,"line":2480},[71790,71794,71798,71802,71806,71810,71814,71818],{"type":21,"tag":209,"props":71791,"children":71792},{"style":263},[71793],{"type":26,"value":61180},{"type":21,"tag":209,"props":71795,"children":71796},{"style":222},[71797],{"type":26,"value":378},{"type":21,"tag":209,"props":71799,"children":71800},{"style":263},[71801],{"type":26,"value":37016},{"type":21,"tag":209,"props":71803,"children":71804},{"style":222},[71805],{"type":26,"value":378},{"type":21,"tag":209,"props":71807,"children":71808},{"style":360},[71809],{"type":26,"value":32649},{"type":21,"tag":209,"props":71811,"children":71812},{"style":216},[71813],{"type":26,"value":271},{"type":21,"tag":209,"props":71815,"children":71816},{"style":216},[71817],{"type":26,"value":4766},{"type":21,"tag":209,"props":71819,"children":71820},{"style":222},[71821],{"type":26,"value":2561},{"type":21,"tag":209,"props":71823,"children":71824},{"class":211,"line":2489},[71825],{"type":21,"tag":209,"props":71826,"children":71827},{"emptyLinePlaceholder":248},[71828],{"type":26,"value":251},{"type":21,"tag":209,"props":71830,"children":71831},{"class":211,"line":2516},[71832,71836,71840,71844,71848,71852,71857,71861,71866,71870],{"type":21,"tag":209,"props":71833,"children":71834},{"style":263},[71835],{"type":26,"value":51112},{"type":21,"tag":209,"props":71837,"children":71838},{"style":222},[71839],{"type":26,"value":71529},{"type":21,"tag":209,"props":71841,"children":71842},{"style":360},[71843],{"type":26,"value":11610},{"type":21,"tag":209,"props":71845,"children":71846},{"style":222},[71847],{"type":26,"value":368},{"type":21,"tag":209,"props":71849,"children":71850},{"style":263},[71851],{"type":26,"value":2508},{"type":21,"tag":209,"props":71853,"children":71854},{"style":222},[71855],{"type":26,"value":71856},".options.type, ",{"type":21,"tag":209,"props":71858,"children":71859},{"style":263},[71860],{"type":26,"value":2508},{"type":21,"tag":209,"props":71862,"children":71863},{"style":222},[71864],{"type":26,"value":71865},".options.url, ",{"type":21,"tag":209,"props":71867,"children":71868},{"style":263},[71869],{"type":26,"value":2508},{"type":21,"tag":209,"props":71871,"children":71872},{"style":222},[71873],{"type":26,"value":71874},".options.async);\n",{"type":21,"tag":209,"props":71876,"children":71877},{"class":211,"line":2525},[71878,71882,71886,71890,71894,71899,71903,71907],{"type":21,"tag":209,"props":71879,"children":71880},{"style":263},[71881],{"type":26,"value":51112},{"type":21,"tag":209,"props":71883,"children":71884},{"style":222},[71885],{"type":26,"value":71529},{"type":21,"tag":209,"props":71887,"children":71888},{"style":360},[71889],{"type":26,"value":62662},{"type":21,"tag":209,"props":71891,"children":71892},{"style":222},[71893],{"type":26,"value":368},{"type":21,"tag":209,"props":71895,"children":71896},{"style":233},[71897],{"type":26,"value":71898},"'Accept'",{"type":21,"tag":209,"props":71900,"children":71901},{"style":222},[71902],{"type":26,"value":408},{"type":21,"tag":209,"props":71904,"children":71905},{"style":233},[71906],{"type":26,"value":25032},{"type":21,"tag":209,"props":71908,"children":71909},{"style":222},[71910],{"type":26,"value":2608},{"type":21,"tag":209,"props":71912,"children":71913},{"class":211,"line":2533},[71914,71918,71922,71926,71930,71935,71939,71943],{"type":21,"tag":209,"props":71915,"children":71916},{"style":263},[71917],{"type":26,"value":51112},{"type":21,"tag":209,"props":71919,"children":71920},{"style":222},[71921],{"type":26,"value":71529},{"type":21,"tag":209,"props":71923,"children":71924},{"style":360},[71925],{"type":26,"value":62662},{"type":21,"tag":209,"props":71927,"children":71928},{"style":222},[71929],{"type":26,"value":368},{"type":21,"tag":209,"props":71931,"children":71932},{"style":233},[71933],{"type":26,"value":71934},"'X-File-Name'",{"type":21,"tag":209,"props":71936,"children":71937},{"style":222},[71938],{"type":26,"value":408},{"type":21,"tag":209,"props":71940,"children":71941},{"style":263},[71942],{"type":26,"value":2508},{"type":21,"tag":209,"props":71944,"children":71945},{"style":222},[71946],{"type":26,"value":71947},".file.name);\n",{"type":21,"tag":209,"props":71949,"children":71950},{"class":211,"line":2542},[71951,71955,71959,71963,71967,71972,71976,71980],{"type":21,"tag":209,"props":71952,"children":71953},{"style":263},[71954],{"type":26,"value":51112},{"type":21,"tag":209,"props":71956,"children":71957},{"style":222},[71958],{"type":26,"value":71529},{"type":21,"tag":209,"props":71960,"children":71961},{"style":360},[71962],{"type":26,"value":62662},{"type":21,"tag":209,"props":71964,"children":71965},{"style":222},[71966],{"type":26,"value":368},{"type":21,"tag":209,"props":71968,"children":71969},{"style":233},[71970],{"type":26,"value":71971},"'X-File-Type'",{"type":21,"tag":209,"props":71973,"children":71974},{"style":222},[71975],{"type":26,"value":408},{"type":21,"tag":209,"props":71977,"children":71978},{"style":263},[71979],{"type":26,"value":2508},{"type":21,"tag":209,"props":71981,"children":71982},{"style":222},[71983],{"type":26,"value":71984},".file.type);\n",{"type":21,"tag":209,"props":71986,"children":71987},{"class":211,"line":2550},[71988],{"type":21,"tag":209,"props":71989,"children":71990},{"emptyLinePlaceholder":248},[71991],{"type":26,"value":251},{"type":21,"tag":209,"props":71993,"children":71994},{"class":211,"line":2564},[71995,71999,72003,72007],{"type":21,"tag":209,"props":71996,"children":71997},{"style":216},[71998],{"type":26,"value":10853},{"type":21,"tag":209,"props":72000,"children":72001},{"style":222},[72002],{"type":26,"value":4776},{"type":21,"tag":209,"props":72004,"children":72005},{"style":263},[72006],{"type":26,"value":2508},{"type":21,"tag":209,"props":72008,"children":72009},{"style":222},[72010],{"type":26,"value":61286},{"type":21,"tag":209,"props":72012,"children":72013},{"class":211,"line":2611},[72014],{"type":21,"tag":209,"props":72015,"children":72016},{"style":222},[72017],{"type":26,"value":37029},{"type":21,"tag":209,"props":72019,"children":72020},{"class":211,"line":2619},[72021,72025,72029,72034,72038,72042],{"type":21,"tag":209,"props":72022,"children":72023},{"style":263},[72024],{"type":26,"value":51473},{"type":21,"tag":209,"props":72026,"children":72027},{"style":222},[72028],{"type":26,"value":71529},{"type":21,"tag":209,"props":72030,"children":72031},{"style":360},[72032],{"type":26,"value":72033},"overrideMimeType",{"type":21,"tag":209,"props":72035,"children":72036},{"style":222},[72037],{"type":26,"value":368},{"type":21,"tag":209,"props":72039,"children":72040},{"style":233},[72041],{"type":26,"value":9083},{"type":21,"tag":209,"props":72043,"children":72044},{"style":222},[72045],{"type":26,"value":2608},{"type":21,"tag":209,"props":72047,"children":72048},{"class":211,"line":2627},[72049,72053,72057,72061,72065,72070,72074,72079,72083,72087,72091,72095,72100,72104,72108,72112,72116,72120,72124,72128],{"type":21,"tag":209,"props":72050,"children":72051},{"style":263},[72052],{"type":26,"value":51473},{"type":21,"tag":209,"props":72054,"children":72055},{"style":222},[72056],{"type":26,"value":71529},{"type":21,"tag":209,"props":72058,"children":72059},{"style":360},[72060],{"type":26,"value":62662},{"type":21,"tag":209,"props":72062,"children":72063},{"style":222},[72064],{"type":26,"value":368},{"type":21,"tag":209,"props":72066,"children":72067},{"style":233},[72068],{"type":26,"value":72069},"'Content-Range'",{"type":21,"tag":209,"props":72071,"children":72072},{"style":222},[72073],{"type":26,"value":408},{"type":21,"tag":209,"props":72075,"children":72076},{"style":233},[72077],{"type":26,"value":72078},"'bytes '",{"type":21,"tag":209,"props":72080,"children":72081},{"style":216},[72082],{"type":26,"value":10237},{"type":21,"tag":209,"props":72084,"children":72085},{"style":263},[72086],{"type":26,"value":2508},{"type":21,"tag":209,"props":72088,"children":72089},{"style":222},[72090],{"type":26,"value":71482},{"type":21,"tag":209,"props":72092,"children":72093},{"style":216},[72094],{"type":26,"value":10237},{"type":21,"tag":209,"props":72096,"children":72097},{"style":233},[72098],{"type":26,"value":72099},"\"-\"",{"type":21,"tag":209,"props":72101,"children":72102},{"style":216},[72103],{"type":26,"value":10237},{"type":21,"tag":209,"props":72105,"children":72106},{"style":263},[72107],{"type":26,"value":2508},{"type":21,"tag":209,"props":72109,"children":72110},{"style":222},[72111],{"type":26,"value":61323},{"type":21,"tag":209,"props":72113,"children":72114},{"style":216},[72115],{"type":26,"value":10237},{"type":21,"tag":209,"props":72117,"children":72118},{"style":233},[72119],{"type":26,"value":42345},{"type":21,"tag":209,"props":72121,"children":72122},{"style":216},[72123],{"type":26,"value":10237},{"type":21,"tag":209,"props":72125,"children":72126},{"style":263},[72127],{"type":26,"value":2508},{"type":21,"tag":209,"props":72129,"children":72130},{"style":222},[72131],{"type":26,"value":61336},{"type":21,"tag":209,"props":72133,"children":72134},{"class":211,"line":2636},[72135,72139,72143,72147,72151,72155,72160,72164,72168,72172,72177,72181],{"type":21,"tag":209,"props":72136,"children":72137},{"style":263},[72138],{"type":26,"value":51473},{"type":21,"tag":209,"props":72140,"children":72141},{"style":222},[72142],{"type":26,"value":71529},{"type":21,"tag":209,"props":72144,"children":72145},{"style":360},[72146],{"type":26,"value":17917},{"type":21,"tag":209,"props":72148,"children":72149},{"style":222},[72150],{"type":26,"value":368},{"type":21,"tag":209,"props":72152,"children":72153},{"style":263},[72154],{"type":26,"value":2508},{"type":21,"tag":209,"props":72156,"children":72157},{"style":222},[72158],{"type":26,"value":72159},".file.",{"type":21,"tag":209,"props":72161,"children":72162},{"style":360},[72163],{"type":26,"value":46541},{"type":21,"tag":209,"props":72165,"children":72166},{"style":222},[72167],{"type":26,"value":368},{"type":21,"tag":209,"props":72169,"children":72170},{"style":263},[72171],{"type":26,"value":2508},{"type":21,"tag":209,"props":72173,"children":72174},{"style":222},[72175],{"type":26,"value":72176},".start, ",{"type":21,"tag":209,"props":72178,"children":72179},{"style":263},[72180],{"type":26,"value":2508},{"type":21,"tag":209,"props":72182,"children":72183},{"style":222},[72184],{"type":26,"value":72185},".end));\n",{"type":21,"tag":209,"props":72187,"children":72188},{"class":211,"line":2644},[72189],{"type":21,"tag":209,"props":72190,"children":72191},{"style":222},[72192],{"type":26,"value":331},{"type":21,"tag":209,"props":72194,"children":72195},{"class":211,"line":2657},[72196],{"type":21,"tag":209,"props":72197,"children":72198},{"style":216},[72199],{"type":26,"value":72200},"    else\n",{"type":21,"tag":209,"props":72202,"children":72203},{"class":211,"line":2728},[72204],{"type":21,"tag":209,"props":72205,"children":72206},{"style":222},[72207],{"type":26,"value":37029},{"type":21,"tag":209,"props":72209,"children":72210},{"class":211,"line":2758},[72211,72215,72219,72223,72227,72231,72236,72240,72245],{"type":21,"tag":209,"props":72212,"children":72213},{"style":263},[72214],{"type":26,"value":51473},{"type":21,"tag":209,"props":72216,"children":72217},{"style":222},[72218],{"type":26,"value":71529},{"type":21,"tag":209,"props":72220,"children":72221},{"style":360},[72222],{"type":26,"value":72033},{"type":21,"tag":209,"props":72224,"children":72225},{"style":222},[72226],{"type":26,"value":2709},{"type":21,"tag":209,"props":72228,"children":72229},{"style":263},[72230],{"type":26,"value":2508},{"type":21,"tag":209,"props":72232,"children":72233},{"style":222},[72234],{"type":26,"value":72235},".file.type ",{"type":21,"tag":209,"props":72237,"children":72238},{"style":216},[72239],{"type":26,"value":4677},{"type":21,"tag":209,"props":72241,"children":72242},{"style":233},[72243],{"type":26,"value":72244}," 'application/octet-stream'",{"type":21,"tag":209,"props":72246,"children":72247},{"style":222},[72248],{"type":26,"value":46554},{"type":21,"tag":209,"props":72250,"children":72251},{"class":211,"line":2776},[72252,72256,72260,72264,72268,72272],{"type":21,"tag":209,"props":72253,"children":72254},{"style":263},[72255],{"type":26,"value":51473},{"type":21,"tag":209,"props":72257,"children":72258},{"style":222},[72259],{"type":26,"value":71529},{"type":21,"tag":209,"props":72261,"children":72262},{"style":360},[72263],{"type":26,"value":17917},{"type":21,"tag":209,"props":72265,"children":72266},{"style":222},[72267],{"type":26,"value":368},{"type":21,"tag":209,"props":72269,"children":72270},{"style":263},[72271],{"type":26,"value":2508},{"type":21,"tag":209,"props":72273,"children":72274},{"style":222},[72275],{"type":26,"value":72276},".file);\n",{"type":21,"tag":209,"props":72278,"children":72279},{"class":211,"line":2785},[72280],{"type":21,"tag":209,"props":72281,"children":72282},{"style":222},[72283],{"type":26,"value":331},{"type":21,"tag":209,"props":72285,"children":72286},{"class":211,"line":2793},[72287],{"type":21,"tag":209,"props":72288,"children":72289},{"style":222},[72290],{"type":26,"value":7798},{"type":21,"tag":22,"props":72292,"children":72293},{},[72294,72296,72301],{"type":26,"value":72295},"The main things to notice are that if we're sending a file 'chunked' (that is, in pieces of a pre-determined size - this is a good way to get around, say, php upload file size limits or allow for pausing and resuming a file upload, by the way) we're using the ",{"type":21,"tag":5270,"props":72297,"children":72298},{},[72299],{"type":26,"value":72300},"slice()",{"type":26,"value":72302}," method on our file to get an ArrayBuffer of the appropriate size out of the buffer representing the whole file. This also saves us from needing to read in the whole file before sending it.",{"type":21,"tag":22,"props":72304,"children":72305},{},[72306],{"type":26,"value":72307},"In order to know what's happening with our file upload, we just need to listen (as noted above) on the load, progress and errors events of xhr and xhr.upload.",{"type":21,"tag":3549,"props":72309,"children":72311},{"id":72310},"reading",[72312],{"type":26,"value":72313},"Reading",{"type":21,"tag":22,"props":72315,"children":72316},{},[72317,72319,72326,72328,72335],{"type":26,"value":72318},"This is probably one of my favourite new things to play with in javascript - the ",{"type":21,"tag":29,"props":72320,"children":72323},{"href":72321,"rel":72322},"http://www.w3.org/TR/FileAPI/#FileReader-interface",[93],[72324],{"type":26,"value":72325},"FileReader api",{"type":26,"value":72327}," (which is a subset of the ",{"type":21,"tag":29,"props":72329,"children":72332},{"href":72330,"rel":72331},"http://www.w3.org/TR/FileAPI/",[93],[72333],{"type":26,"value":72334},"File api",{"type":26,"value":72336},"). Get a file from the local user filesystem and work with it in the browser. Yay!",{"type":21,"tag":22,"props":72338,"children":72339},{},[72340],{"type":26,"value":72341},"Its exciting, because coming from a C and Java background, getting a file from the local system wasn't ever a problem, and there's been numerous times in my web dev endeavours when it has been. Ever needed to use that ugly hack where you upload a file to a server and bounce it immediately back to the client, just so you can have access to some image or text file from the user? Yeah, good riddance to that.",{"type":21,"tag":22,"props":72343,"children":72344},{},[72345],{"type":26,"value":72346},"Anyways, our plugin is going to do that to, because the two concepts are fairly closely related - we might want the user to drag and drop those drunken party photos into the browser for manipulation in a photo booth type app (airbrush me out of there... or maybe just add some clothes) before uploading, for instance.",{"type":21,"tag":22,"props":72348,"children":72349},{},[72350],{"type":26,"value":72351},"Here's what that looks like:",{"type":21,"tag":200,"props":72353,"children":72355},{"className":9044,"code":72354,"language":9046,"meta":8,"style":8},"    /**\n     * Deferred wrapper for file reader.\n     * @param read_method\n     * @param file\n     * @returns {Object} promise The Deferred promise object\n     * @constructor\n     */\n    function DeferReader(read_method, file){\n        this.defer = $.Deferred();\n        this.reader = new FileReader();\n        this.file = file;\n        this.read_method = read_method;\n\n    this.listen();\n    this.reader[read_method](file);\n\n    return this.defer.promise();\n}\n\n/**\n * Listen for the various events of interest on the file reader, and return notification or resolution\n * to deferred as appropriate.\n */\nDeferReader.prototype.listen = function(){\n    var that = this;\n\n    this.reader.addEventListener('error', function(event){\n        var err = event.target.error,\n            errCode = event.target.error.code,\n            errMsg = 'Error attempting to read file \"'+this.file.name+'\": ';\n        switch(errCode)\n        {\n            case err.NOT_FOUND_ERR:\n                errMsg += \"File could not be found.\";\n                break;\n            case err.NOT_READABLE_ERR:\n                errMsg += \"File is not readable.\";\n                break;\n            case err.ABORT_ERR:\n                errMsg += \"File read was aborted.\";\n                break;\n            default:\n                errMsg += \"An unexpected error occurred.\";\n                break;\n        }\n        that.defer.reject({state:Hup.state.FILE_READ_ERROR, error:errMsg});\n    }, false);\n\n    this.reader.addEventListener('progress', function(event){\n        if (event.lengthComputable)\n        {\n            that.defer.notify({state:Hup.state.FILE_READ_PROGRESS, file_name:that.file.name,\n                progress:(event.loaded/event.total)});\n        }\n    });\n\n    this.reader.addEventListener('loadend', function(event){\n        if (event.target.readyState == FileReader.DONE)\n        {\n            that.defer.resolve({state:Hup.state.FILE_READ_FINISHED,\n                file_name:that.file.name, file_size:that.file.size, file_type:that.file.type,\n                read_method:that.read_method, read_result:event.target.result});\n        }\n    }, false);\n};\n",[72356],{"type":21,"tag":63,"props":72357,"children":72358},{"__ignoreMap":8},[72359,72366,72374,72390,72405,72425,72436,72443,72474,72501,72530,72549,72570,72577,72597,72609,72616,72639,72646,72653,72660,72668,72676,72683,72719,72742,72749,72793,72814,72831,72874,72887,72894,72916,72937,72949,72969,72989,73000,73020,73040,73051,73063,73083,73094,73101,73127,73143,73150,73193,73204,73211,73237,73254,73261,73268,73275,73319,73349,73356,73380,73388,73396,73403,73418],{"type":21,"tag":209,"props":72360,"children":72361},{"class":211,"line":212},[72362],{"type":21,"tag":209,"props":72363,"children":72364},{"style":448},[72365],{"type":26,"value":4697},{"type":21,"tag":209,"props":72367,"children":72368},{"class":211,"line":244},[72369],{"type":21,"tag":209,"props":72370,"children":72371},{"style":448},[72372],{"type":26,"value":72373},"     * Deferred wrapper for file reader.\n",{"type":21,"tag":209,"props":72375,"children":72376},{"class":211,"line":254},[72377,72381,72385],{"type":21,"tag":209,"props":72378,"children":72379},{"style":448},[72380],{"type":26,"value":4713},{"type":21,"tag":209,"props":72382,"children":72383},{"style":216},[72384],{"type":26,"value":4718},{"type":21,"tag":209,"props":72386,"children":72387},{"style":222},[72388],{"type":26,"value":72389}," read_method\n",{"type":21,"tag":209,"props":72391,"children":72392},{"class":211,"line":279},[72393,72397,72401],{"type":21,"tag":209,"props":72394,"children":72395},{"style":448},[72396],{"type":26,"value":4713},{"type":21,"tag":209,"props":72398,"children":72399},{"style":216},[72400],{"type":26,"value":4718},{"type":21,"tag":209,"props":72402,"children":72403},{"style":222},[72404],{"type":26,"value":71142},{"type":21,"tag":209,"props":72406,"children":72407},{"class":211,"line":288},[72408,72412,72416,72420],{"type":21,"tag":209,"props":72409,"children":72410},{"style":448},[72411],{"type":26,"value":4713},{"type":21,"tag":209,"props":72413,"children":72414},{"style":216},[72415],{"type":26,"value":4740},{"type":21,"tag":209,"props":72417,"children":72418},{"style":360},[72419],{"type":26,"value":67802},{"type":21,"tag":209,"props":72421,"children":72422},{"style":448},[72423],{"type":26,"value":72424}," promise The Deferred promise object\n",{"type":21,"tag":209,"props":72426,"children":72427},{"class":211,"line":307},[72428,72432],{"type":21,"tag":209,"props":72429,"children":72430},{"style":448},[72431],{"type":26,"value":4713},{"type":21,"tag":209,"props":72433,"children":72434},{"style":216},[72435],{"type":26,"value":46286},{"type":21,"tag":209,"props":72437,"children":72438},{"class":211,"line":325},[72439],{"type":21,"tag":209,"props":72440,"children":72441},{"style":448},[72442],{"type":26,"value":4753},{"type":21,"tag":209,"props":72444,"children":72445},{"class":211,"line":334},[72446,72450,72454,72458,72462,72466,72470],{"type":21,"tag":209,"props":72447,"children":72448},{"style":216},[72449],{"type":26,"value":2981},{"type":21,"tag":209,"props":72451,"children":72452},{"style":360},[72453],{"type":26,"value":58025},{"type":21,"tag":209,"props":72455,"children":72456},{"style":222},[72457],{"type":26,"value":368},{"type":21,"tag":209,"props":72459,"children":72460},{"style":400},[72461],{"type":26,"value":32672},{"type":21,"tag":209,"props":72463,"children":72464},{"style":222},[72465],{"type":26,"value":408},{"type":21,"tag":209,"props":72467,"children":72468},{"style":400},[72469],{"type":26,"value":19799},{"type":21,"tag":209,"props":72471,"children":72472},{"style":222},[72473],{"type":26,"value":2369},{"type":21,"tag":209,"props":72475,"children":72476},{"class":211,"line":343},[72477,72481,72485,72489,72493,72497],{"type":21,"tag":209,"props":72478,"children":72479},{"style":263},[72480],{"type":26,"value":51473},{"type":21,"tag":209,"props":72482,"children":72483},{"style":222},[72484],{"type":26,"value":71253},{"type":21,"tag":209,"props":72486,"children":72487},{"style":216},[72488],{"type":26,"value":1432},{"type":21,"tag":209,"props":72490,"children":72491},{"style":222},[72492],{"type":26,"value":26905},{"type":21,"tag":209,"props":72494,"children":72495},{"style":360},[72496],{"type":26,"value":26910},{"type":21,"tag":209,"props":72498,"children":72499},{"style":222},[72500],{"type":26,"value":4842},{"type":21,"tag":209,"props":72502,"children":72503},{"class":211,"line":351},[72504,72508,72513,72517,72521,72526],{"type":21,"tag":209,"props":72505,"children":72506},{"style":263},[72507],{"type":26,"value":51473},{"type":21,"tag":209,"props":72509,"children":72510},{"style":222},[72511],{"type":26,"value":72512},".reader ",{"type":21,"tag":209,"props":72514,"children":72515},{"style":216},[72516],{"type":26,"value":1432},{"type":21,"tag":209,"props":72518,"children":72519},{"style":216},[72520],{"type":26,"value":4667},{"type":21,"tag":209,"props":72522,"children":72523},{"style":360},[72524],{"type":26,"value":72525}," FileReader",{"type":21,"tag":209,"props":72527,"children":72528},{"style":222},[72529],{"type":26,"value":4842},{"type":21,"tag":209,"props":72531,"children":72532},{"class":211,"line":444},[72533,72537,72541,72545],{"type":21,"tag":209,"props":72534,"children":72535},{"style":263},[72536],{"type":26,"value":51473},{"type":21,"tag":209,"props":72538,"children":72539},{"style":222},[72540],{"type":26,"value":71281},{"type":21,"tag":209,"props":72542,"children":72543},{"style":216},[72544],{"type":26,"value":1432},{"type":21,"tag":209,"props":72546,"children":72547},{"style":222},[72548],{"type":26,"value":71290},{"type":21,"tag":209,"props":72550,"children":72551},{"class":211,"line":454},[72552,72556,72561,72565],{"type":21,"tag":209,"props":72553,"children":72554},{"style":263},[72555],{"type":26,"value":51473},{"type":21,"tag":209,"props":72557,"children":72558},{"style":222},[72559],{"type":26,"value":72560},".read_method ",{"type":21,"tag":209,"props":72562,"children":72563},{"style":216},[72564],{"type":26,"value":1432},{"type":21,"tag":209,"props":72566,"children":72567},{"style":222},[72568],{"type":26,"value":72569}," read_method;\n",{"type":21,"tag":209,"props":72571,"children":72572},{"class":211,"line":463},[72573],{"type":21,"tag":209,"props":72574,"children":72575},{"emptyLinePlaceholder":248},[72576],{"type":26,"value":251},{"type":21,"tag":209,"props":72578,"children":72579},{"class":211,"line":472},[72580,72584,72588,72593],{"type":21,"tag":209,"props":72581,"children":72582},{"style":263},[72583],{"type":26,"value":51112},{"type":21,"tag":209,"props":72585,"children":72586},{"style":222},[72587],{"type":26,"value":378},{"type":21,"tag":209,"props":72589,"children":72590},{"style":360},[72591],{"type":26,"value":72592},"listen",{"type":21,"tag":209,"props":72594,"children":72595},{"style":222},[72596],{"type":26,"value":4842},{"type":21,"tag":209,"props":72598,"children":72599},{"class":211,"line":480},[72600,72604],{"type":21,"tag":209,"props":72601,"children":72602},{"style":263},[72603],{"type":26,"value":51112},{"type":21,"tag":209,"props":72605,"children":72606},{"style":222},[72607],{"type":26,"value":72608},".reader[read_method](file);\n",{"type":21,"tag":209,"props":72610,"children":72611},{"class":211,"line":489},[72612],{"type":21,"tag":209,"props":72613,"children":72614},{"emptyLinePlaceholder":248},[72615],{"type":26,"value":251},{"type":21,"tag":209,"props":72617,"children":72618},{"class":211,"line":847},[72619,72623,72627,72631,72635],{"type":21,"tag":209,"props":72620,"children":72621},{"style":216},[72622],{"type":26,"value":1298},{"type":21,"tag":209,"props":72624,"children":72625},{"style":263},[72626],{"type":26,"value":17698},{"type":21,"tag":209,"props":72628,"children":72629},{"style":222},[72630],{"type":26,"value":61531},{"type":21,"tag":209,"props":72632,"children":72633},{"style":360},[72634],{"type":26,"value":27809},{"type":21,"tag":209,"props":72636,"children":72637},{"style":222},[72638],{"type":26,"value":4842},{"type":21,"tag":209,"props":72640,"children":72641},{"class":211,"line":860},[72642],{"type":21,"tag":209,"props":72643,"children":72644},{"style":222},[72645],{"type":26,"value":7798},{"type":21,"tag":209,"props":72647,"children":72648},{"class":211,"line":877},[72649],{"type":21,"tag":209,"props":72650,"children":72651},{"emptyLinePlaceholder":248},[72652],{"type":26,"value":251},{"type":21,"tag":209,"props":72654,"children":72655},{"class":211,"line":889},[72656],{"type":21,"tag":209,"props":72657,"children":72658},{"style":448},[72659],{"type":26,"value":731},{"type":21,"tag":209,"props":72661,"children":72662},{"class":211,"line":902},[72663],{"type":21,"tag":209,"props":72664,"children":72665},{"style":448},[72666],{"type":26,"value":72667}," * Listen for the various events of interest on the file reader, and return notification or resolution\n",{"type":21,"tag":209,"props":72669,"children":72670},{"class":211,"line":914},[72671],{"type":21,"tag":209,"props":72672,"children":72673},{"style":448},[72674],{"type":26,"value":72675}," * to deferred as appropriate.\n",{"type":21,"tag":209,"props":72677,"children":72678},{"class":211,"line":922},[72679],{"type":21,"tag":209,"props":72680,"children":72681},{"style":448},[72682],{"type":26,"value":755},{"type":21,"tag":209,"props":72684,"children":72685},{"class":211,"line":2312},[72686,72691,72695,72699,72703,72707,72711,72715],{"type":21,"tag":209,"props":72687,"children":72688},{"style":263},[72689],{"type":26,"value":72690},"DeferReader",{"type":21,"tag":209,"props":72692,"children":72693},{"style":222},[72694],{"type":26,"value":378},{"type":21,"tag":209,"props":72696,"children":72697},{"style":263},[72698],{"type":26,"value":37016},{"type":21,"tag":209,"props":72700,"children":72701},{"style":222},[72702],{"type":26,"value":378},{"type":21,"tag":209,"props":72704,"children":72705},{"style":360},[72706],{"type":26,"value":72592},{"type":21,"tag":209,"props":72708,"children":72709},{"style":216},[72710],{"type":26,"value":271},{"type":21,"tag":209,"props":72712,"children":72713},{"style":216},[72714],{"type":26,"value":4766},{"type":21,"tag":209,"props":72716,"children":72717},{"style":222},[72718],{"type":26,"value":2561},{"type":21,"tag":209,"props":72720,"children":72721},{"class":211,"line":2321},[72722,72726,72730,72734,72738],{"type":21,"tag":209,"props":72723,"children":72724},{"style":216},[72725],{"type":26,"value":10405},{"type":21,"tag":209,"props":72727,"children":72728},{"style":222},[72729],{"type":26,"value":57248},{"type":21,"tag":209,"props":72731,"children":72732},{"style":216},[72733],{"type":26,"value":1432},{"type":21,"tag":209,"props":72735,"children":72736},{"style":263},[72737],{"type":26,"value":17698},{"type":21,"tag":209,"props":72739,"children":72740},{"style":222},[72741],{"type":26,"value":241},{"type":21,"tag":209,"props":72743,"children":72744},{"class":211,"line":2372},[72745],{"type":21,"tag":209,"props":72746,"children":72747},{"emptyLinePlaceholder":248},[72748],{"type":26,"value":251},{"type":21,"tag":209,"props":72750,"children":72751},{"class":211,"line":2381},[72752,72756,72761,72765,72769,72773,72777,72781,72785,72789],{"type":21,"tag":209,"props":72753,"children":72754},{"style":263},[72755],{"type":26,"value":51112},{"type":21,"tag":209,"props":72757,"children":72758},{"style":222},[72759],{"type":26,"value":72760},".reader.",{"type":21,"tag":209,"props":72762,"children":72763},{"style":360},[72764],{"type":26,"value":6424},{"type":21,"tag":209,"props":72766,"children":72767},{"style":222},[72768],{"type":26,"value":368},{"type":21,"tag":209,"props":72770,"children":72771},{"style":233},[72772],{"type":26,"value":17784},{"type":21,"tag":209,"props":72774,"children":72775},{"style":222},[72776],{"type":26,"value":408},{"type":21,"tag":209,"props":72778,"children":72779},{"style":216},[72780],{"type":26,"value":5370},{"type":21,"tag":209,"props":72782,"children":72783},{"style":222},[72784],{"type":26,"value":368},{"type":21,"tag":209,"props":72786,"children":72787},{"style":400},[72788],{"type":26,"value":10794},{"type":21,"tag":209,"props":72790,"children":72791},{"style":222},[72792],{"type":26,"value":2369},{"type":21,"tag":209,"props":72794,"children":72795},{"class":211,"line":2389},[72796,72800,72805,72809],{"type":21,"tag":209,"props":72797,"children":72798},{"style":216},[72799],{"type":26,"value":5925},{"type":21,"tag":209,"props":72801,"children":72802},{"style":222},[72803],{"type":26,"value":72804}," err ",{"type":21,"tag":209,"props":72806,"children":72807},{"style":216},[72808],{"type":26,"value":1432},{"type":21,"tag":209,"props":72810,"children":72811},{"style":222},[72812],{"type":26,"value":72813}," event.target.error,\n",{"type":21,"tag":209,"props":72815,"children":72816},{"class":211,"line":2397},[72817,72822,72826],{"type":21,"tag":209,"props":72818,"children":72819},{"style":222},[72820],{"type":26,"value":72821},"            errCode ",{"type":21,"tag":209,"props":72823,"children":72824},{"style":216},[72825],{"type":26,"value":1432},{"type":21,"tag":209,"props":72827,"children":72828},{"style":222},[72829],{"type":26,"value":72830}," event.target.error.code,\n",{"type":21,"tag":209,"props":72832,"children":72833},{"class":211,"line":2406},[72834,72839,72843,72848,72852,72856,72861,72865,72870],{"type":21,"tag":209,"props":72835,"children":72836},{"style":222},[72837],{"type":26,"value":72838},"            errMsg ",{"type":21,"tag":209,"props":72840,"children":72841},{"style":216},[72842],{"type":26,"value":1432},{"type":21,"tag":209,"props":72844,"children":72845},{"style":233},[72846],{"type":26,"value":72847}," 'Error attempting to read file \"'",{"type":21,"tag":209,"props":72849,"children":72850},{"style":216},[72851],{"type":26,"value":10237},{"type":21,"tag":209,"props":72853,"children":72854},{"style":263},[72855],{"type":26,"value":2508},{"type":21,"tag":209,"props":72857,"children":72858},{"style":222},[72859],{"type":26,"value":72860},".file.name",{"type":21,"tag":209,"props":72862,"children":72863},{"style":216},[72864],{"type":26,"value":10237},{"type":21,"tag":209,"props":72866,"children":72867},{"style":233},[72868],{"type":26,"value":72869},"'\": '",{"type":21,"tag":209,"props":72871,"children":72872},{"style":222},[72873],{"type":26,"value":241},{"type":21,"tag":209,"props":72875,"children":72876},{"class":211,"line":2415},[72877,72882],{"type":21,"tag":209,"props":72878,"children":72879},{"style":216},[72880],{"type":26,"value":72881},"        switch",{"type":21,"tag":209,"props":72883,"children":72884},{"style":222},[72885],{"type":26,"value":72886},"(errCode)\n",{"type":21,"tag":209,"props":72888,"children":72889},{"class":211,"line":2424},[72890],{"type":21,"tag":209,"props":72891,"children":72892},{"style":222},[72893],{"type":26,"value":7561},{"type":21,"tag":209,"props":72895,"children":72896},{"class":211,"line":2433},[72897,72902,72907,72912],{"type":21,"tag":209,"props":72898,"children":72899},{"style":216},[72900],{"type":26,"value":72901},"            case",{"type":21,"tag":209,"props":72903,"children":72904},{"style":222},[72905],{"type":26,"value":72906}," err.",{"type":21,"tag":209,"props":72908,"children":72909},{"style":263},[72910],{"type":26,"value":72911},"NOT_FOUND_ERR",{"type":21,"tag":209,"props":72913,"children":72914},{"style":222},[72915],{"type":26,"value":844},{"type":21,"tag":209,"props":72917,"children":72918},{"class":211,"line":2442},[72919,72924,72928,72933],{"type":21,"tag":209,"props":72920,"children":72921},{"style":222},[72922],{"type":26,"value":72923},"                errMsg ",{"type":21,"tag":209,"props":72925,"children":72926},{"style":216},[72927],{"type":26,"value":13131},{"type":21,"tag":209,"props":72929,"children":72930},{"style":233},[72931],{"type":26,"value":72932}," \"File could not be found.\"",{"type":21,"tag":209,"props":72934,"children":72935},{"style":222},[72936],{"type":26,"value":241},{"type":21,"tag":209,"props":72938,"children":72939},{"class":211,"line":2471},[72940,72945],{"type":21,"tag":209,"props":72941,"children":72942},{"style":216},[72943],{"type":26,"value":72944},"                break",{"type":21,"tag":209,"props":72946,"children":72947},{"style":222},[72948],{"type":26,"value":241},{"type":21,"tag":209,"props":72950,"children":72951},{"class":211,"line":2480},[72952,72956,72960,72965],{"type":21,"tag":209,"props":72953,"children":72954},{"style":216},[72955],{"type":26,"value":72901},{"type":21,"tag":209,"props":72957,"children":72958},{"style":222},[72959],{"type":26,"value":72906},{"type":21,"tag":209,"props":72961,"children":72962},{"style":263},[72963],{"type":26,"value":72964},"NOT_READABLE_ERR",{"type":21,"tag":209,"props":72966,"children":72967},{"style":222},[72968],{"type":26,"value":844},{"type":21,"tag":209,"props":72970,"children":72971},{"class":211,"line":2489},[72972,72976,72980,72985],{"type":21,"tag":209,"props":72973,"children":72974},{"style":222},[72975],{"type":26,"value":72923},{"type":21,"tag":209,"props":72977,"children":72978},{"style":216},[72979],{"type":26,"value":13131},{"type":21,"tag":209,"props":72981,"children":72982},{"style":233},[72983],{"type":26,"value":72984}," \"File is not readable.\"",{"type":21,"tag":209,"props":72986,"children":72987},{"style":222},[72988],{"type":26,"value":241},{"type":21,"tag":209,"props":72990,"children":72991},{"class":211,"line":2516},[72992,72996],{"type":21,"tag":209,"props":72993,"children":72994},{"style":216},[72995],{"type":26,"value":72944},{"type":21,"tag":209,"props":72997,"children":72998},{"style":222},[72999],{"type":26,"value":241},{"type":21,"tag":209,"props":73001,"children":73002},{"class":211,"line":2525},[73003,73007,73011,73016],{"type":21,"tag":209,"props":73004,"children":73005},{"style":216},[73006],{"type":26,"value":72901},{"type":21,"tag":209,"props":73008,"children":73009},{"style":222},[73010],{"type":26,"value":72906},{"type":21,"tag":209,"props":73012,"children":73013},{"style":263},[73014],{"type":26,"value":73015},"ABORT_ERR",{"type":21,"tag":209,"props":73017,"children":73018},{"style":222},[73019],{"type":26,"value":844},{"type":21,"tag":209,"props":73021,"children":73022},{"class":211,"line":2533},[73023,73027,73031,73036],{"type":21,"tag":209,"props":73024,"children":73025},{"style":222},[73026],{"type":26,"value":72923},{"type":21,"tag":209,"props":73028,"children":73029},{"style":216},[73030],{"type":26,"value":13131},{"type":21,"tag":209,"props":73032,"children":73033},{"style":233},[73034],{"type":26,"value":73035}," \"File read was aborted.\"",{"type":21,"tag":209,"props":73037,"children":73038},{"style":222},[73039],{"type":26,"value":241},{"type":21,"tag":209,"props":73041,"children":73042},{"class":211,"line":2542},[73043,73047],{"type":21,"tag":209,"props":73044,"children":73045},{"style":216},[73046],{"type":26,"value":72944},{"type":21,"tag":209,"props":73048,"children":73049},{"style":222},[73050],{"type":26,"value":241},{"type":21,"tag":209,"props":73052,"children":73053},{"class":211,"line":2550},[73054,73059],{"type":21,"tag":209,"props":73055,"children":73056},{"style":216},[73057],{"type":26,"value":73058},"            default",{"type":21,"tag":209,"props":73060,"children":73061},{"style":222},[73062],{"type":26,"value":844},{"type":21,"tag":209,"props":73064,"children":73065},{"class":211,"line":2564},[73066,73070,73074,73079],{"type":21,"tag":209,"props":73067,"children":73068},{"style":222},[73069],{"type":26,"value":72923},{"type":21,"tag":209,"props":73071,"children":73072},{"style":216},[73073],{"type":26,"value":13131},{"type":21,"tag":209,"props":73075,"children":73076},{"style":233},[73077],{"type":26,"value":73078}," \"An unexpected error occurred.\"",{"type":21,"tag":209,"props":73080,"children":73081},{"style":222},[73082],{"type":26,"value":241},{"type":21,"tag":209,"props":73084,"children":73085},{"class":211,"line":2611},[73086,73090],{"type":21,"tag":209,"props":73087,"children":73088},{"style":216},[73089],{"type":26,"value":72944},{"type":21,"tag":209,"props":73091,"children":73092},{"style":222},[73093],{"type":26,"value":241},{"type":21,"tag":209,"props":73095,"children":73096},{"class":211,"line":2619},[73097],{"type":21,"tag":209,"props":73098,"children":73099},{"style":222},[73100],{"type":26,"value":2235},{"type":21,"tag":209,"props":73102,"children":73103},{"class":211,"line":2627},[73104,73109,73113,73117,73122],{"type":21,"tag":209,"props":73105,"children":73106},{"style":222},[73107],{"type":26,"value":73108},"        that.defer.",{"type":21,"tag":209,"props":73110,"children":73111},{"style":360},[73112],{"type":26,"value":5599},{"type":21,"tag":209,"props":73114,"children":73115},{"style":222},[73116],{"type":26,"value":61541},{"type":21,"tag":209,"props":73118,"children":73119},{"style":263},[73120],{"type":26,"value":73121},"FILE_READ_ERROR",{"type":21,"tag":209,"props":73123,"children":73124},{"style":222},[73125],{"type":26,"value":73126},", error:errMsg});\n",{"type":21,"tag":209,"props":73128,"children":73129},{"class":211,"line":2636},[73130,73135,73139],{"type":21,"tag":209,"props":73131,"children":73132},{"style":222},[73133],{"type":26,"value":73134},"    }, ",{"type":21,"tag":209,"props":73136,"children":73137},{"style":263},[73138],{"type":26,"value":27598},{"type":21,"tag":209,"props":73140,"children":73141},{"style":222},[73142],{"type":26,"value":2608},{"type":21,"tag":209,"props":73144,"children":73145},{"class":211,"line":2644},[73146],{"type":21,"tag":209,"props":73147,"children":73148},{"emptyLinePlaceholder":248},[73149],{"type":26,"value":251},{"type":21,"tag":209,"props":73151,"children":73152},{"class":211,"line":2657},[73153,73157,73161,73165,73169,73173,73177,73181,73185,73189],{"type":21,"tag":209,"props":73154,"children":73155},{"style":263},[73156],{"type":26,"value":51112},{"type":21,"tag":209,"props":73158,"children":73159},{"style":222},[73160],{"type":26,"value":72760},{"type":21,"tag":209,"props":73162,"children":73163},{"style":360},[73164],{"type":26,"value":6424},{"type":21,"tag":209,"props":73166,"children":73167},{"style":222},[73168],{"type":26,"value":368},{"type":21,"tag":209,"props":73170,"children":73171},{"style":233},[73172],{"type":26,"value":71597},{"type":21,"tag":209,"props":73174,"children":73175},{"style":222},[73176],{"type":26,"value":408},{"type":21,"tag":209,"props":73178,"children":73179},{"style":216},[73180],{"type":26,"value":5370},{"type":21,"tag":209,"props":73182,"children":73183},{"style":222},[73184],{"type":26,"value":368},{"type":21,"tag":209,"props":73186,"children":73187},{"style":400},[73188],{"type":26,"value":10794},{"type":21,"tag":209,"props":73190,"children":73191},{"style":222},[73192],{"type":26,"value":2369},{"type":21,"tag":209,"props":73194,"children":73195},{"class":211,"line":2728},[73196,73200],{"type":21,"tag":209,"props":73197,"children":73198},{"style":216},[73199],{"type":26,"value":5803},{"type":21,"tag":209,"props":73201,"children":73202},{"style":222},[73203],{"type":26,"value":61229},{"type":21,"tag":209,"props":73205,"children":73206},{"class":211,"line":2758},[73207],{"type":21,"tag":209,"props":73208,"children":73209},{"style":222},[73210],{"type":26,"value":7561},{"type":21,"tag":209,"props":73212,"children":73213},{"class":211,"line":2776},[73214,73219,73223,73227,73232],{"type":21,"tag":209,"props":73215,"children":73216},{"style":222},[73217],{"type":26,"value":73218},"            that.defer.",{"type":21,"tag":209,"props":73220,"children":73221},{"style":360},[73222],{"type":26,"value":61536},{"type":21,"tag":209,"props":73224,"children":73225},{"style":222},[73226],{"type":26,"value":61541},{"type":21,"tag":209,"props":73228,"children":73229},{"style":263},[73230],{"type":26,"value":73231},"FILE_READ_PROGRESS",{"type":21,"tag":209,"props":73233,"children":73234},{"style":222},[73235],{"type":26,"value":73236},", file_name:that.file.name,\n",{"type":21,"tag":209,"props":73238,"children":73239},{"class":211,"line":2785},[73240,73245,73249],{"type":21,"tag":209,"props":73241,"children":73242},{"style":222},[73243],{"type":26,"value":73244},"                progress:(event.loaded",{"type":21,"tag":209,"props":73246,"children":73247},{"style":216},[73248],{"type":26,"value":9749},{"type":21,"tag":209,"props":73250,"children":73251},{"style":222},[73252],{"type":26,"value":73253},"event.total)});\n",{"type":21,"tag":209,"props":73255,"children":73256},{"class":211,"line":2793},[73257],{"type":21,"tag":209,"props":73258,"children":73259},{"style":222},[73260],{"type":26,"value":2235},{"type":21,"tag":209,"props":73262,"children":73263},{"class":211,"line":2801},[73264],{"type":21,"tag":209,"props":73265,"children":73266},{"style":222},[73267],{"type":26,"value":3391},{"type":21,"tag":209,"props":73269,"children":73270},{"class":211,"line":2809},[73271],{"type":21,"tag":209,"props":73272,"children":73273},{"emptyLinePlaceholder":248},[73274],{"type":26,"value":251},{"type":21,"tag":209,"props":73276,"children":73277},{"class":211,"line":6219},[73278,73282,73286,73290,73294,73299,73303,73307,73311,73315],{"type":21,"tag":209,"props":73279,"children":73280},{"style":263},[73281],{"type":26,"value":51112},{"type":21,"tag":209,"props":73283,"children":73284},{"style":222},[73285],{"type":26,"value":72760},{"type":21,"tag":209,"props":73287,"children":73288},{"style":360},[73289],{"type":26,"value":6424},{"type":21,"tag":209,"props":73291,"children":73292},{"style":222},[73293],{"type":26,"value":368},{"type":21,"tag":209,"props":73295,"children":73296},{"style":233},[73297],{"type":26,"value":73298},"'loadend'",{"type":21,"tag":209,"props":73300,"children":73301},{"style":222},[73302],{"type":26,"value":408},{"type":21,"tag":209,"props":73304,"children":73305},{"style":216},[73306],{"type":26,"value":5370},{"type":21,"tag":209,"props":73308,"children":73309},{"style":222},[73310],{"type":26,"value":368},{"type":21,"tag":209,"props":73312,"children":73313},{"style":400},[73314],{"type":26,"value":10794},{"type":21,"tag":209,"props":73316,"children":73317},{"style":222},[73318],{"type":26,"value":2369},{"type":21,"tag":209,"props":73320,"children":73321},{"class":211,"line":6228},[73322,73326,73331,73335,73340,73345],{"type":21,"tag":209,"props":73323,"children":73324},{"style":216},[73325],{"type":26,"value":5803},{"type":21,"tag":209,"props":73327,"children":73328},{"style":222},[73329],{"type":26,"value":73330}," (event.target.readyState ",{"type":21,"tag":209,"props":73332,"children":73333},{"style":216},[73334],{"type":26,"value":12908},{"type":21,"tag":209,"props":73336,"children":73337},{"style":222},[73338],{"type":26,"value":73339}," FileReader.",{"type":21,"tag":209,"props":73341,"children":73342},{"style":263},[73343],{"type":26,"value":73344},"DONE",{"type":21,"tag":209,"props":73346,"children":73347},{"style":222},[73348],{"type":26,"value":10112},{"type":21,"tag":209,"props":73350,"children":73351},{"class":211,"line":6250},[73352],{"type":21,"tag":209,"props":73353,"children":73354},{"style":222},[73355],{"type":26,"value":7561},{"type":21,"tag":209,"props":73357,"children":73358},{"class":211,"line":6258},[73359,73363,73367,73371,73376],{"type":21,"tag":209,"props":73360,"children":73361},{"style":222},[73362],{"type":26,"value":73218},{"type":21,"tag":209,"props":73364,"children":73365},{"style":360},[73366],{"type":26,"value":5590},{"type":21,"tag":209,"props":73368,"children":73369},{"style":222},[73370],{"type":26,"value":61541},{"type":21,"tag":209,"props":73372,"children":73373},{"style":263},[73374],{"type":26,"value":73375},"FILE_READ_FINISHED",{"type":21,"tag":209,"props":73377,"children":73378},{"style":222},[73379],{"type":26,"value":304},{"type":21,"tag":209,"props":73381,"children":73382},{"class":211,"line":6267},[73383],{"type":21,"tag":209,"props":73384,"children":73385},{"style":222},[73386],{"type":26,"value":73387},"                file_name:that.file.name, file_size:that.file.size, file_type:that.file.type,\n",{"type":21,"tag":209,"props":73389,"children":73390},{"class":211,"line":6303},[73391],{"type":21,"tag":209,"props":73392,"children":73393},{"style":222},[73394],{"type":26,"value":73395},"                read_method:that.read_method, read_result:event.target.result});\n",{"type":21,"tag":209,"props":73397,"children":73398},{"class":211,"line":6336},[73399],{"type":21,"tag":209,"props":73400,"children":73401},{"style":222},[73402],{"type":26,"value":2235},{"type":21,"tag":209,"props":73404,"children":73405},{"class":211,"line":6369},[73406,73410,73414],{"type":21,"tag":209,"props":73407,"children":73408},{"style":222},[73409],{"type":26,"value":73134},{"type":21,"tag":209,"props":73411,"children":73412},{"style":263},[73413],{"type":26,"value":27598},{"type":21,"tag":209,"props":73415,"children":73416},{"style":222},[73417],{"type":26,"value":2608},{"type":21,"tag":209,"props":73419,"children":73420},{"class":211,"line":6378},[73421],{"type":21,"tag":209,"props":73422,"children":73423},{"style":222},[73424],{"type":26,"value":340},{"type":21,"tag":22,"props":73426,"children":73427},{},[73428],{"type":26,"value":73429},"Pretty simple (you'll notice I'm using the promises here to wrap around the callbacks that FileReader offer us - we're doing the same with the xhr upload). We set up our reader with a file read method (which will determine what kind of result we're given.",{"type":21,"tag":22,"props":73431,"children":73432},{},[73433,73435,73442],{"type":26,"value":73434},"We can readAsText (text files, obviously), readAsDataURL (images are a good candidate for being read this way - we'll be returned a data url with the contents encoded as base64), readAsBinaryString (which will return us a string with the binary contents encoded - we can get the bytes values by getting the char codes of each character in the string) or readAsArrayBuffer (see ",{"type":21,"tag":29,"props":73436,"children":73439},{"href":73437,"rel":73438},"http://www.khronos.org/registry/typedarray/specs/latest/",[93],[73440],{"type":26,"value":73441},"Array Buffer spec",{"type":26,"value":2699},{"type":21,"tag":22,"props":73444,"children":73445},{},[73446],{"type":26,"value":73447},"The reader will call back to use on progress (useful for a progress bar, for instance) on the file read, and when finished loading, with the result of our read (which will be encoded as we've specified with our read method).",{"type":21,"tag":3549,"props":73449,"children":73450},{"id":14920},[73451],{"type":26,"value":14923},{"type":21,"tag":22,"props":73453,"children":73454},{},[73455],{"type":26,"value":73456},"So, been teasing about that plugin, and pulling it apart should be a good way to get started on learning how this all works; and if you want to forego that, just use the plugin! Keep in mind, the plugin doesn't offer any UI interaction - it just covers reading a file or uploading it, and returns the results of these operations to the element(s) the plugin is called on - you'll need/want to build your UI on top of that.",{"type":21,"tag":22,"props":73458,"children":73459},{},[73460,73462,73468],{"type":26,"value":73461},"Usage, the plugin, a test page and an example php script to receive and assemble chunked uploads can be found at ",{"type":21,"tag":29,"props":73463,"children":73465},{"href":32587,"rel":73464},[93],[73466],{"type":26,"value":73467},"the github repo",{"type":26,"value":378},{"type":21,"tag":58507,"props":73470,"children":73472},{"id":73471},"note-the-code-below-is-out-of-date-see-the-github-repo-for-the-up-to-date-code",[73473,73475,73481],{"type":26,"value":73474},"NOTE: The code below is OUT OF DATE - see the ",{"type":21,"tag":29,"props":73476,"children":73478},{"href":32587,"rel":73477},[93],[73479],{"type":26,"value":73480},"GITHUB REPO",{"type":26,"value":73482}," for the up-to-date code.",{"type":21,"tag":22,"props":73484,"children":73485},{},[73486],{"type":26,"value":73487},"Meanwhile, here's just the plugin:",{"type":21,"tag":200,"props":73489,"children":73491},{"className":9044,"code":73490,"language":9046,"meta":8,"style":8},"/**\n * Copyright (c) 2013 Christopher Keefer. All Rights Reserved.\n *\n * jQuery plugin for reading in files or uploading them with the HTML5 file api and xhr2.\n */\n(function($){\n    /**\n     * Construct html5 reader/uploader.\n     * @param {Object} options\n     * @constructor\n     */\n    function Hup(options){\n        this.init(options);\n    }\n\n/**\n * Set options, listen for events on input element that indicate we should read/upload selected file(s).\n * @param options\n */\nHup.prototype.init = function(options)\n{\n    this.options = $.extend({\n        async:true, // Whether to send this file asynchronously\n        chunked:true, // Whether to send the file in chunks\n        chunk_size:1048576, // Size of each chunk (default 1024*1024)\n        input:'', // Input element\n        make_dnd:false, // Whether to make the input element handle drag and drop - auto-true if not file input\n        read_method:'readAsDataURL', // the read method to use for reading in the file - one of\n        // readAsText, readAsBinaryString, readAsDataURL or readAsArrayBuffer\n        type:'PUT', // Type of request to use for uploading\n        url:false // Url endpoint to send file to - if not specified or false, we read the file and return it\n    }, options);\n\n    this.input = $(this.options.input);\n\n    var that = this;\n    if (this.options.make_dnd || !this.isFileInput(this.input))\n    {\n        this.options.make_dnd = true;\n        this.input.off('dragover').on('dragover', function(event){\n            event = event.originalEvent;\n            that.handleDragover(event);\n        });\n    }\n    this.input.off('drop change').on('drop change', function(event){\n        event = event.originalEvent;\n        that.handleSelect(event);\n    });\n}\n\n/**\n * Return whether the passed element is an input of type file.\n * @param input Element to check.\n * @returns {boolean}\n */\nHup.prototype.isFileInput = function(input){\n    return (input[0].tagName === 'INPUT' && input[0].getAttribute('type').indexOf('file') !== -1);\n};\n\n/**\n * Handle the dragging of file(s) to a target, preventing the rejection of the dragover.\n * @param event\n */\nHup.prototype.handleDragover = function(event){\n    event.preventDefault();\n    event.stopPropagation();\n    event.dataTransfer.dropEffect = 'copy';\n};\n\n/**\n * Handle the selection of files to upload via an input or drag and drop to a target.\n * @param event\n */\nHup.prototype.handleSelect = function(event){\n    var files;\n\n    if (this.options.make_dnd)\n    {\n        event.preventDefault();\n        event.stopPropagation();\n        files = event.dataTransfer.files;\n    }\n    else\n    {\n        files = event.target.files;\n    }\n    if (!files.length)\n    {\n        this.input.trigger(Hup.state.FILE_LIST_ERROR, {state:Hup.state.FILE_LIST_ERROR,\n            error:'No files found in file list; no files were selected.'});\n        return;\n    }\n    this.input.trigger(Hup.state.FILE_LIST_LOADED, {state:Hup.state.FILE_LIST_LOADED, files:files});\n\n    this.processFiles(files, this.options.url);\n};\n\n/**\n * Process the files in the fileList, uploading them if a url is specified, otherwise reading them into\n * memory and passing them on to be used in the browser.\n * @param files\n * @param upload\n */\nHup.prototype.processFiles = function(files, upload){\n    var that = this,\n        processed = 0;\n\n    for (var i=0, len = files.length; i < len; i++)\n    {\n        var fprocess = (upload) ? new DeferXhr(this.options, files[i]) :\n            new DeferReader(this.options.read_method, files[i]);\n\n        fprocess.progress(function(progress){\n            that.input.trigger(progress.state, progress);\n        }).done(function(res){\n            that.input.trigger(res.state, res);\n            processed++;\n            if (processed == len)\n                that.input.trigger((upload) ? Hup.state.FILE_UPLOAD_ALL : Hup.state.FILE_READ_ALL ,\n                    {state:(upload) ? Hup.state.FILE_UPLOAD_ALL : Hup.state.FILE_READ_ALL, files:len});\n        }).fail(function(res)\n        {\n            that.input.trigger(res.state, res);\n        });\n    }\n};\n\n/**\n * Custom events we'll trigger on our input element at the appropriate times.\n * @type {{FILE_LIST_ERROR: string, FILE_LIST_LOADED: string, FILE_READ_ERROR: string,\n * FILE_READ_PROGRESS: string, FILE_READ_FINISHED: string, FILE_READ_ALL: string,\n * FILE_UPLOAD_ERROR: string, FILE_UPLOAD_PROGRESS: string, FILE_UPLOAD_PAUSE: string,\n * FILE_UPLOAD_RESUME: string, FILE_UPLOAD_FINISHED: string, FILE_UPLOAD_ALL: string}}\n */\nHup.state = {\n    FILE_LIST_ERROR:'fileListError',\n    FILE_LIST_LOADED:'fileListLoaded',\n    FILE_READ_ERROR:'fileReadError',\n    FILE_READ_PROGRESS:'fileReadProgress',\n    FILE_READ_FINISHED:'fileReadFinished',\n    FILE_READ_ALL:'fileReadAll',\n    FILE_UPLOAD_ERROR:'fileUploadError',\n    FILE_UPLOAD_PROGRESS:'fileUploadProgress',\n    FILE_UPLOAD_PAUSE:'fileUploadPause',\n    FILE_UPLOAD_RESUME:'fileUploadResume',\n    FILE_UPLOAD_FINISHED:'fileUploadFinished',\n    FILE_UPLOAD_ALL:'fileUploadAll'\n};\n\n/**\n * Deferred wrapper for xhr upload.\n * @param options\n * @param file\n * @returns {Object} promise The deferred promise object.\n * @constructor\n */\nfunction DeferXhr(options, file){\n    var that = this;\n\n    this.defer = $.Deferred();\n    this.file = file;\n    this.options = options;\n    this.paused = false;\n    this.progress = 0;\n    this.time = {start:0, end:0, speed:0}; // Speed is measured in bytes per second\n    this.xhr = new XMLHttpRequest();\n\n    if (this.options.chunked)\n    {\n        this.start = 0;\n        this.end = Math.min(this.start+this.options.chunk_size, this.file.size);\n    }\n\n    this.xhr.addEventListener('load', function(){that.complete();}, false);\n    this.xhr.upload.addEventListener('progress', function(event){that.uploadProgress(event);}, false);\n    this.xhr.upload.addEventListener('error', function(event){that.uploadError(event);}, false);\n\n    this.upload();\n\n    return this.defer.promise();\n}\n\n/**\n * Carry out the xhr upload, optionally chunked.\n */\nDeferXhr.prototype.upload = function(){\n    this.time.start = +new Date();\n\n    this.xhr.open(this.options.type, this.options.url, this.options.async);\n    this.xhr.setRequestHeader('Accept', 'application/json');\n    this.xhr.setRequestHeader('X-File-Name', this.file.name);\n    this.xhr.setRequestHeader('X-File-Type', this.file.type);\n\n    if (this.options.chunked)\n    {\n        this.xhr.overrideMimeType('application/octet-stream');\n        this.xhr.setRequestHeader('Content-Range', 'bytes '+this.start+\"-\"+this.end+\"/\"+this.file.size);\n        this.xhr.send(this.file.slice(this.start, this.end));\n    }\n    else\n    {\n        this.xhr.overrideMimeType((this.file.type || 'application/octet-stream'));\n        this.xhr.send(this.file);\n    }\n}\n\n/**\n * Report on the upload progress, as a number between 0 and 1, modifying the progress if we're uploading a\n * file in chunks to report on the progress as a percentage of file upload and total chunks uploaded.\n * @param event\n */\nDeferXhr.prototype.uploadProgress = function(event){\n    if (event.lengthComputable)\n    {\n        this.progress = (event.loaded/event.total);\n        if (this.options.chunked)\n        {\n            this.progress *= (this.end/this.file.size);\n        }\n        this.time.end = +new Date();\n        this.time.speed = (this.file.size*this.progress)/(this.time.end-this.time.start)*1000;\n        console.log('time:', this.time.end-this.time.start, 'speed:', this.time.speed);\n        this.defer.notify({state:Hup.state.FILE_UPLOAD_PROGRESS, file_name:this.file.name, speed:this.time.speed,\n            progress:this.progress});\n    }\n};\n\nDeferXhr.prototype.uploadError = function(event){\n    this.defer.reject({state:Hup.state.FILE_UPLOAD_ERROR, error:event});\n}\n\n/**\n * Called when we've completed an upload (full file or chunk). If full file, or we've reached the last chunk,\n * the upload is complete. Otherwise, we calculate the next chunk offsets and, if the upload isn't paused,\n * upload it.\n */\nDeferXhr.prototype.complete = function(){\n    this.time.end = +new Date();\n    if (!this.options.chunked || this.end == this.file.size)\n    {\n        this.uploadComplete();\n        return;\n    }\n\n    this.defer.notify({state:Hup.state.FILE_UPLOAD_PROGRESS, file_name:this.file.name,\n        response:this.parseResponse(this.xhr.responseText), progress:this.progress});\n\n    this.start = this.end;\n    this.end = Math.min(this.start+this.options.chunk_size, this.file.size);\n\n    if (!this.paused)\n    {\n        this.upload();\n    }\n};\n\n/**\n * Called when the full file has been uploaded.\n */\nDeferXhr.prototype.uploadComplete = function(){\n    this.defer.resolve({state:Hup.state.FILE_UPLOAD_FINISHED, file_name:this.file.name,\n        file_size:this.file.size, file_type:this.file.type,\n        response:this.parseResponse(this.xhr.responseText)});\n};\n\n/**\n * Try to parse the response as a JSON, and on failure return the error and the plaintext.\n * @param response\n * @returns {Object}\n */\nDeferXhr.prototype.parseResponse = function(response)\n{\n    var response;\n    try{\n        response = JSON.parse(this.xhr.responseText);\n    }catch(e){\n        response = {error:e, text:this.xhr.responseText};\n    }\n    return response;\n}\n\n/**\n * Pause the upload (works for chunked uploads only).\n */\nDeferXhr.prototype.pause = function(){\n    this.paused = true;\n    this.defer.notify({state:Hup.state.FILE_UPLOAD_PAUSE, current_range:{start:this.start, end:this.end,\n        total:this.file.size}});\n}\n\n/**\n * Resume the upload (works for chunked uploads only).\n */\nDeferXhr.prototype.resume = function(){\n    if (this.paused)\n    {\n        this.paused = false;\n        this.defer.notify({state:Hup.state.FILE_UPLOAD_RESUME, current_range:{start:this.start, end:this.end,\n            total:this.file.size}});\n        this.upload();\n    }\n}\n\n/**\n * Deferred wrapper for file reader.\n * @param read_method\n * @param file\n * @returns {Object} promise The Deferred promise object\n * @constructor\n */\nfunction DeferReader(read_method, file){\n    this.defer = $.Deferred();\n    this.reader = new FileReader();\n    this.file = file;\n    this.read_method = read_method;\n\n    this.listen();\n    this.reader[read_method](file);\n\n    return this.defer.promise();\n}\n\n/**\n * Listen for the various events of interest on the file reader, and return notification or resolution\n * to deferred as appropriate.\n */\nDeferReader.prototype.listen = function(){\n    var that = this;\n\n    this.reader.addEventListener('error', function(event){\n        var err = event.target.error,\n            errCode = event.target.error.code,\n            errMsg = 'Error attempting to read file \"'+this.file.name+'\": ';\n        switch(errCode)\n        {\n            case err.NOT_FOUND_ERR:\n                errMsg += \"File could not be found.\";\n                break;\n            case err.NOT_READABLE_ERR:\n                errMsg += \"File is not readable.\";\n                break;\n            case err.ABORT_ERR:\n                errMsg += \"File read was aborted.\";\n                break;\n            default:\n                errMsg += \"An unexpected error occurred.\";\n                break;\n        }\n        that.defer.reject({state:Hup.state.FILE_READ_ERROR, error:errMsg});\n    }, false);\n\n    this.reader.addEventListener('progress', function(event){\n        if (event.lengthComputable)\n        {\n            that.defer.notify({state:Hup.state.FILE_READ_PROGRESS, file_name:that.file.name,\n                progress:(event.loaded/event.total)});\n        }\n    });\n\n    this.reader.addEventListener('loadend', function(event){\n        if (event.target.readyState == FileReader.DONE)\n        {\n            that.defer.resolve({state:Hup.state.FILE_READ_FINISHED,\n                file_name:that.file.name, file_size:that.file.size, file_type:that.file.type,\n                read_method:that.read_method, read_result:event.target.result});\n        }\n    }, false);\n};\n\n/**\n * Entry point for calling the reader/uploader, with the element to be used as input specified.\n * Usage:\n * $('#input').hup({options}).on('events') --OR--\n * $('.inputs').hup({options}).on('events')\n * @param options\n * @returns {Hup} Promise deferred from Hup.\n */\n$.fn.hup = function(options){\n    var options = (options || {});\n    return this.each(function(){\n        options.input = this;\n        var $this = $(this),\n            hup = $this.data('hup');\n        if (!hup)\n        {\n            $this.data('hup', new Hup(options));\n        }\n        else if (hup instanceof Hup)\n        {\n            hup.init(options);\n        }\n    });\n};\n})(jQuery);\n",[73492],{"type":21,"tag":63,"props":73493,"children":73494},{"__ignoreMap":8},[73495,73502,73510,73517,73525,73532,73555,73562,73570,73589,73600,73607,73631,73651,73658,73665,73672,73680,73695,73702,73745,73752,73779,73800,73821,73843,73864,73885,73907,73915,73937,73954,73962,73969,74002,74009,74032,74086,74093,74116,74175,74191,74208,74215,74222,74281,74297,74314,74321,74328,74335,74342,74350,74371,74387,74394,74437,74543,74550,74557,74564,74572,74587,74594,74637,74652,74667,74688,74695,74702,74709,74717,74732,74739,74782,74793,74800,74820,74827,74843,74858,74874,74881,74888,74895,74910,74917,74945,74952,74989,75006,75017,75024,75061,75068,75097,75104,75111,75118,75126,75134,75149,75164,75171,75222,75245,75264,75271,75335,75342,75390,75414,75421,75453,75468,75499,75514,75530,75550,75594,75630,75661,75668,75683,75690,75697,75704,75711,75718,75726,75742,75750,75758,75766,75773,75789,75806,75823,75840,75857,75874,75891,75908,75925,75942,75959,75976,75989,75996,76003,76010,76018,76033,76048,76067,76078,76085,76116,76139,76146,76173,76192,76211,76234,76257,76310,76337,76344,76363,76370,76393,76448,76455,76462,76513,76572,76631,76638,76657,76664,76687,76694,76701,76708,76715,76722,76757,76785,76792,76835,76870,76906,76942,76950,76970,76978,77006,77091,77143,77151,77159,77167,77207,77235,77243,77251,77259,77267,77276,77285,77301,77309,77353,77365,77373,77401,77421,77429,77469,77477,77505,77585,77645,77689,77706,77714,77722,77730,77774,77804,77812,77820,77828,77837,77846,77855,77863,77899,77927,77977,77985,78006,78018,78026,78034,78071,78114,78122,78147,78203,78211,78236,78244,78264,78272,78280,78288,78296,78305,78313,78349,78386,78413,78446,78454,78462,78470,78479,78495,78512,78520,78564,78572,78584,78596,78634,78651,78677,78685,78697,78705,78713,78721,78730,78738,78775,78799,78847,78865,78873,78881,78889,78898,78906,78942,78962,78970,78994,79039,79056,79076,79084,79092,79100,79108,79117,79133,79149,79169,79181,79189,79221,79249,79277,79297,79317,79325,79345,79357,79365,79389,79397,79405,79413,79421,79429,79437,79473,79497,79505,79549,79569,79585,79625,79637,79645,79665,79685,79697,79717,79737,79749,79769,79789,79801,79813,79833,79845,79853,79877,79893,79901,79945,79957,79965,79989,80005,80013,80021,80029,80073,80101,80109,80133,80141,80149,80157,80173,80181,80189,80197,80206,80215,80224,80233,80249,80271,80279,80313,80344,80376,80397,80429,80463,80484,80492,80530,80538,80568,80576,80593,80601,80609,80617],{"type":21,"tag":209,"props":73496,"children":73497},{"class":211,"line":212},[73498],{"type":21,"tag":209,"props":73499,"children":73500},{"style":448},[73501],{"type":26,"value":731},{"type":21,"tag":209,"props":73503,"children":73504},{"class":211,"line":244},[73505],{"type":21,"tag":209,"props":73506,"children":73507},{"style":448},[73508],{"type":26,"value":73509}," * Copyright (c) 2013 Christopher Keefer. All Rights Reserved.\n",{"type":21,"tag":209,"props":73511,"children":73512},{"class":211,"line":254},[73513],{"type":21,"tag":209,"props":73514,"children":73515},{"style":448},[73516],{"type":26,"value":14974},{"type":21,"tag":209,"props":73518,"children":73519},{"class":211,"line":279},[73520],{"type":21,"tag":209,"props":73521,"children":73522},{"style":448},[73523],{"type":26,"value":73524}," * jQuery plugin for reading in files or uploading them with the HTML5 file api and xhr2.\n",{"type":21,"tag":209,"props":73526,"children":73527},{"class":211,"line":288},[73528],{"type":21,"tag":209,"props":73529,"children":73530},{"style":448},[73531],{"type":26,"value":755},{"type":21,"tag":209,"props":73533,"children":73534},{"class":211,"line":307},[73535,73539,73543,73547,73551],{"type":21,"tag":209,"props":73536,"children":73537},{"style":222},[73538],{"type":26,"value":368},{"type":21,"tag":209,"props":73540,"children":73541},{"style":216},[73542],{"type":26,"value":5370},{"type":21,"tag":209,"props":73544,"children":73545},{"style":222},[73546],{"type":26,"value":368},{"type":21,"tag":209,"props":73548,"children":73549},{"style":400},[73550],{"type":26,"value":10250},{"type":21,"tag":209,"props":73552,"children":73553},{"style":222},[73554],{"type":26,"value":2369},{"type":21,"tag":209,"props":73556,"children":73557},{"class":211,"line":325},[73558],{"type":21,"tag":209,"props":73559,"children":73560},{"style":448},[73561],{"type":26,"value":4697},{"type":21,"tag":209,"props":73563,"children":73564},{"class":211,"line":334},[73565],{"type":21,"tag":209,"props":73566,"children":73567},{"style":448},[73568],{"type":26,"value":73569},"     * Construct html5 reader/uploader.\n",{"type":21,"tag":209,"props":73571,"children":73572},{"class":211,"line":343},[73573,73577,73581,73585],{"type":21,"tag":209,"props":73574,"children":73575},{"style":448},[73576],{"type":26,"value":4713},{"type":21,"tag":209,"props":73578,"children":73579},{"style":216},[73580],{"type":26,"value":4718},{"type":21,"tag":209,"props":73582,"children":73583},{"style":360},[73584],{"type":26,"value":67802},{"type":21,"tag":209,"props":73586,"children":73587},{"style":222},[73588],{"type":26,"value":71126},{"type":21,"tag":209,"props":73590,"children":73591},{"class":211,"line":351},[73592,73596],{"type":21,"tag":209,"props":73593,"children":73594},{"style":448},[73595],{"type":26,"value":4713},{"type":21,"tag":209,"props":73597,"children":73598},{"style":216},[73599],{"type":26,"value":46286},{"type":21,"tag":209,"props":73601,"children":73602},{"class":211,"line":444},[73603],{"type":21,"tag":209,"props":73604,"children":73605},{"style":448},[73606],{"type":26,"value":4753},{"type":21,"tag":209,"props":73608,"children":73609},{"class":211,"line":454},[73610,73614,73619,73623,73627],{"type":21,"tag":209,"props":73611,"children":73612},{"style":216},[73613],{"type":26,"value":2981},{"type":21,"tag":209,"props":73615,"children":73616},{"style":360},[73617],{"type":26,"value":73618}," Hup",{"type":21,"tag":209,"props":73620,"children":73621},{"style":222},[73622],{"type":26,"value":368},{"type":21,"tag":209,"props":73624,"children":73625},{"style":400},[73626],{"type":26,"value":29825},{"type":21,"tag":209,"props":73628,"children":73629},{"style":222},[73630],{"type":26,"value":2369},{"type":21,"tag":209,"props":73632,"children":73633},{"class":211,"line":463},[73634,73638,73642,73646],{"type":21,"tag":209,"props":73635,"children":73636},{"style":263},[73637],{"type":26,"value":51473},{"type":21,"tag":209,"props":73639,"children":73640},{"style":222},[73641],{"type":26,"value":378},{"type":21,"tag":209,"props":73643,"children":73644},{"style":360},[73645],{"type":26,"value":51199},{"type":21,"tag":209,"props":73647,"children":73648},{"style":222},[73649],{"type":26,"value":73650},"(options);\n",{"type":21,"tag":209,"props":73652,"children":73653},{"class":211,"line":472},[73654],{"type":21,"tag":209,"props":73655,"children":73656},{"style":222},[73657],{"type":26,"value":331},{"type":21,"tag":209,"props":73659,"children":73660},{"class":211,"line":480},[73661],{"type":21,"tag":209,"props":73662,"children":73663},{"emptyLinePlaceholder":248},[73664],{"type":26,"value":251},{"type":21,"tag":209,"props":73666,"children":73667},{"class":211,"line":489},[73668],{"type":21,"tag":209,"props":73669,"children":73670},{"style":448},[73671],{"type":26,"value":731},{"type":21,"tag":209,"props":73673,"children":73674},{"class":211,"line":847},[73675],{"type":21,"tag":209,"props":73676,"children":73677},{"style":448},[73678],{"type":26,"value":73679}," * Set options, listen for events on input element that indicate we should read/upload selected file(s).\n",{"type":21,"tag":209,"props":73681,"children":73682},{"class":211,"line":860},[73683,73687,73691],{"type":21,"tag":209,"props":73684,"children":73685},{"style":448},[73686],{"type":26,"value":11233},{"type":21,"tag":209,"props":73688,"children":73689},{"style":216},[73690],{"type":26,"value":4718},{"type":21,"tag":209,"props":73692,"children":73693},{"style":222},[73694],{"type":26,"value":71126},{"type":21,"tag":209,"props":73696,"children":73697},{"class":211,"line":877},[73698],{"type":21,"tag":209,"props":73699,"children":73700},{"style":448},[73701],{"type":26,"value":755},{"type":21,"tag":209,"props":73703,"children":73704},{"class":211,"line":889},[73705,73709,73713,73717,73721,73725,73729,73733,73737,73741],{"type":21,"tag":209,"props":73706,"children":73707},{"style":263},[73708],{"type":26,"value":56462},{"type":21,"tag":209,"props":73710,"children":73711},{"style":222},[73712],{"type":26,"value":378},{"type":21,"tag":209,"props":73714,"children":73715},{"style":263},[73716],{"type":26,"value":37016},{"type":21,"tag":209,"props":73718,"children":73719},{"style":222},[73720],{"type":26,"value":378},{"type":21,"tag":209,"props":73722,"children":73723},{"style":360},[73724],{"type":26,"value":51199},{"type":21,"tag":209,"props":73726,"children":73727},{"style":216},[73728],{"type":26,"value":271},{"type":21,"tag":209,"props":73730,"children":73731},{"style":216},[73732],{"type":26,"value":4766},{"type":21,"tag":209,"props":73734,"children":73735},{"style":222},[73736],{"type":26,"value":368},{"type":21,"tag":209,"props":73738,"children":73739},{"style":400},[73740],{"type":26,"value":29825},{"type":21,"tag":209,"props":73742,"children":73743},{"style":222},[73744],{"type":26,"value":10112},{"type":21,"tag":209,"props":73746,"children":73747},{"class":211,"line":902},[73748],{"type":21,"tag":209,"props":73749,"children":73750},{"style":222},[73751],{"type":26,"value":7414},{"type":21,"tag":209,"props":73753,"children":73754},{"class":211,"line":914},[73755,73759,73763,73767,73771,73775],{"type":21,"tag":209,"props":73756,"children":73757},{"style":263},[73758],{"type":26,"value":51112},{"type":21,"tag":209,"props":73760,"children":73761},{"style":222},[73762],{"type":26,"value":71302},{"type":21,"tag":209,"props":73764,"children":73765},{"style":216},[73766],{"type":26,"value":1432},{"type":21,"tag":209,"props":73768,"children":73769},{"style":222},[73770],{"type":26,"value":26905},{"type":21,"tag":209,"props":73772,"children":73773},{"style":360},[73774],{"type":26,"value":38684},{"type":21,"tag":209,"props":73776,"children":73777},{"style":222},[73778],{"type":26,"value":17983},{"type":21,"tag":209,"props":73780,"children":73781},{"class":211,"line":922},[73782,73787,73791,73795],{"type":21,"tag":209,"props":73783,"children":73784},{"style":222},[73785],{"type":26,"value":73786},"        async:",{"type":21,"tag":209,"props":73788,"children":73789},{"style":263},[73790],{"type":26,"value":2223},{"type":21,"tag":209,"props":73792,"children":73793},{"style":222},[73794],{"type":26,"value":408},{"type":21,"tag":209,"props":73796,"children":73797},{"style":448},[73798],{"type":26,"value":73799},"// Whether to send this file asynchronously\n",{"type":21,"tag":209,"props":73801,"children":73802},{"class":211,"line":2312},[73803,73808,73812,73816],{"type":21,"tag":209,"props":73804,"children":73805},{"style":222},[73806],{"type":26,"value":73807},"        chunked:",{"type":21,"tag":209,"props":73809,"children":73810},{"style":263},[73811],{"type":26,"value":2223},{"type":21,"tag":209,"props":73813,"children":73814},{"style":222},[73815],{"type":26,"value":408},{"type":21,"tag":209,"props":73817,"children":73818},{"style":448},[73819],{"type":26,"value":73820},"// Whether to send the file in chunks\n",{"type":21,"tag":209,"props":73822,"children":73823},{"class":211,"line":2321},[73824,73829,73834,73838],{"type":21,"tag":209,"props":73825,"children":73826},{"style":222},[73827],{"type":26,"value":73828},"        chunk_size:",{"type":21,"tag":209,"props":73830,"children":73831},{"style":263},[73832],{"type":26,"value":73833},"1048576",{"type":21,"tag":209,"props":73835,"children":73836},{"style":222},[73837],{"type":26,"value":408},{"type":21,"tag":209,"props":73839,"children":73840},{"style":448},[73841],{"type":26,"value":73842},"// Size of each chunk (default 1024*1024)\n",{"type":21,"tag":209,"props":73844,"children":73845},{"class":211,"line":2372},[73846,73851,73855,73859],{"type":21,"tag":209,"props":73847,"children":73848},{"style":222},[73849],{"type":26,"value":73850},"        input:",{"type":21,"tag":209,"props":73852,"children":73853},{"style":233},[73854],{"type":26,"value":20111},{"type":21,"tag":209,"props":73856,"children":73857},{"style":222},[73858],{"type":26,"value":408},{"type":21,"tag":209,"props":73860,"children":73861},{"style":448},[73862],{"type":26,"value":73863},"// Input element\n",{"type":21,"tag":209,"props":73865,"children":73866},{"class":211,"line":2381},[73867,73872,73876,73880],{"type":21,"tag":209,"props":73868,"children":73869},{"style":222},[73870],{"type":26,"value":73871},"        make_dnd:",{"type":21,"tag":209,"props":73873,"children":73874},{"style":263},[73875],{"type":26,"value":27598},{"type":21,"tag":209,"props":73877,"children":73878},{"style":222},[73879],{"type":26,"value":408},{"type":21,"tag":209,"props":73881,"children":73882},{"style":448},[73883],{"type":26,"value":73884},"// Whether to make the input element handle drag and drop - auto-true if not file input\n",{"type":21,"tag":209,"props":73886,"children":73887},{"class":211,"line":2389},[73888,73893,73898,73902],{"type":21,"tag":209,"props":73889,"children":73890},{"style":222},[73891],{"type":26,"value":73892},"        read_method:",{"type":21,"tag":209,"props":73894,"children":73895},{"style":233},[73896],{"type":26,"value":73897},"'readAsDataURL'",{"type":21,"tag":209,"props":73899,"children":73900},{"style":222},[73901],{"type":26,"value":408},{"type":21,"tag":209,"props":73903,"children":73904},{"style":448},[73905],{"type":26,"value":73906},"// the read method to use for reading in the file - one of\n",{"type":21,"tag":209,"props":73908,"children":73909},{"class":211,"line":2397},[73910],{"type":21,"tag":209,"props":73911,"children":73912},{"style":448},[73913],{"type":26,"value":73914},"        // readAsText, readAsBinaryString, readAsDataURL or readAsArrayBuffer\n",{"type":21,"tag":209,"props":73916,"children":73917},{"class":211,"line":2406},[73918,73923,73928,73932],{"type":21,"tag":209,"props":73919,"children":73920},{"style":222},[73921],{"type":26,"value":73922},"        type:",{"type":21,"tag":209,"props":73924,"children":73925},{"style":233},[73926],{"type":26,"value":73927},"'PUT'",{"type":21,"tag":209,"props":73929,"children":73930},{"style":222},[73931],{"type":26,"value":408},{"type":21,"tag":209,"props":73933,"children":73934},{"style":448},[73935],{"type":26,"value":73936},"// Type of request to use for uploading\n",{"type":21,"tag":209,"props":73938,"children":73939},{"class":211,"line":2415},[73940,73945,73949],{"type":21,"tag":209,"props":73941,"children":73942},{"style":222},[73943],{"type":26,"value":73944},"        url:",{"type":21,"tag":209,"props":73946,"children":73947},{"style":263},[73948],{"type":26,"value":27598},{"type":21,"tag":209,"props":73950,"children":73951},{"style":448},[73952],{"type":26,"value":73953}," // Url endpoint to send file to - if not specified or false, we read the file and return it\n",{"type":21,"tag":209,"props":73955,"children":73956},{"class":211,"line":2424},[73957],{"type":21,"tag":209,"props":73958,"children":73959},{"style":222},[73960],{"type":26,"value":73961},"    }, options);\n",{"type":21,"tag":209,"props":73963,"children":73964},{"class":211,"line":2433},[73965],{"type":21,"tag":209,"props":73966,"children":73967},{"emptyLinePlaceholder":248},[73968],{"type":26,"value":251},{"type":21,"tag":209,"props":73970,"children":73971},{"class":211,"line":2442},[73972,73976,73981,73985,73989,73993,73997],{"type":21,"tag":209,"props":73973,"children":73974},{"style":263},[73975],{"type":26,"value":51112},{"type":21,"tag":209,"props":73977,"children":73978},{"style":222},[73979],{"type":26,"value":73980},".input ",{"type":21,"tag":209,"props":73982,"children":73983},{"style":216},[73984],{"type":26,"value":1432},{"type":21,"tag":209,"props":73986,"children":73987},{"style":360},[73988],{"type":26,"value":49968},{"type":21,"tag":209,"props":73990,"children":73991},{"style":222},[73992],{"type":26,"value":368},{"type":21,"tag":209,"props":73994,"children":73995},{"style":263},[73996],{"type":26,"value":2508},{"type":21,"tag":209,"props":73998,"children":73999},{"style":222},[74000],{"type":26,"value":74001},".options.input);\n",{"type":21,"tag":209,"props":74003,"children":74004},{"class":211,"line":2471},[74005],{"type":21,"tag":209,"props":74006,"children":74007},{"emptyLinePlaceholder":248},[74008],{"type":26,"value":251},{"type":21,"tag":209,"props":74010,"children":74011},{"class":211,"line":2480},[74012,74016,74020,74024,74028],{"type":21,"tag":209,"props":74013,"children":74014},{"style":216},[74015],{"type":26,"value":10405},{"type":21,"tag":209,"props":74017,"children":74018},{"style":222},[74019],{"type":26,"value":57248},{"type":21,"tag":209,"props":74021,"children":74022},{"style":216},[74023],{"type":26,"value":1432},{"type":21,"tag":209,"props":74025,"children":74026},{"style":263},[74027],{"type":26,"value":17698},{"type":21,"tag":209,"props":74029,"children":74030},{"style":222},[74031],{"type":26,"value":241},{"type":21,"tag":209,"props":74033,"children":74034},{"class":211,"line":2489},[74035,74039,74043,74047,74052,74056,74060,74064,74068,74073,74077,74081],{"type":21,"tag":209,"props":74036,"children":74037},{"style":216},[74038],{"type":26,"value":10853},{"type":21,"tag":209,"props":74040,"children":74041},{"style":222},[74042],{"type":26,"value":4776},{"type":21,"tag":209,"props":74044,"children":74045},{"style":263},[74046],{"type":26,"value":2508},{"type":21,"tag":209,"props":74048,"children":74049},{"style":222},[74050],{"type":26,"value":74051},".options.make_dnd ",{"type":21,"tag":209,"props":74053,"children":74054},{"style":216},[74055],{"type":26,"value":4677},{"type":21,"tag":209,"props":74057,"children":74058},{"style":216},[74059],{"type":26,"value":17157},{"type":21,"tag":209,"props":74061,"children":74062},{"style":263},[74063],{"type":26,"value":2508},{"type":21,"tag":209,"props":74065,"children":74066},{"style":222},[74067],{"type":26,"value":378},{"type":21,"tag":209,"props":74069,"children":74070},{"style":360},[74071],{"type":26,"value":74072},"isFileInput",{"type":21,"tag":209,"props":74074,"children":74075},{"style":222},[74076],{"type":26,"value":368},{"type":21,"tag":209,"props":74078,"children":74079},{"style":263},[74080],{"type":26,"value":2508},{"type":21,"tag":209,"props":74082,"children":74083},{"style":222},[74084],{"type":26,"value":74085},".input))\n",{"type":21,"tag":209,"props":74087,"children":74088},{"class":211,"line":2516},[74089],{"type":21,"tag":209,"props":74090,"children":74091},{"style":222},[74092],{"type":26,"value":37029},{"type":21,"tag":209,"props":74094,"children":74095},{"class":211,"line":2525},[74096,74100,74104,74108,74112],{"type":21,"tag":209,"props":74097,"children":74098},{"style":263},[74099],{"type":26,"value":51473},{"type":21,"tag":209,"props":74101,"children":74102},{"style":222},[74103],{"type":26,"value":74051},{"type":21,"tag":209,"props":74105,"children":74106},{"style":216},[74107],{"type":26,"value":1432},{"type":21,"tag":209,"props":74109,"children":74110},{"style":263},[74111],{"type":26,"value":6243},{"type":21,"tag":209,"props":74113,"children":74114},{"style":222},[74115],{"type":26,"value":241},{"type":21,"tag":209,"props":74117,"children":74118},{"class":211,"line":2533},[74119,74123,74127,74131,74135,74139,74143,74147,74151,74155,74159,74163,74167,74171],{"type":21,"tag":209,"props":74120,"children":74121},{"style":263},[74122],{"type":26,"value":51473},{"type":21,"tag":209,"props":74124,"children":74125},{"style":222},[74126],{"type":26,"value":57646},{"type":21,"tag":209,"props":74128,"children":74129},{"style":360},[74130],{"type":26,"value":70775},{"type":21,"tag":209,"props":74132,"children":74133},{"style":222},[74134],{"type":26,"value":368},{"type":21,"tag":209,"props":74136,"children":74137},{"style":233},[74138],{"type":26,"value":70784},{"type":21,"tag":209,"props":74140,"children":74141},{"style":222},[74142],{"type":26,"value":2699},{"type":21,"tag":209,"props":74144,"children":74145},{"style":360},[74146],{"type":26,"value":363},{"type":21,"tag":209,"props":74148,"children":74149},{"style":222},[74150],{"type":26,"value":368},{"type":21,"tag":209,"props":74152,"children":74153},{"style":233},[74154],{"type":26,"value":70784},{"type":21,"tag":209,"props":74156,"children":74157},{"style":222},[74158],{"type":26,"value":408},{"type":21,"tag":209,"props":74160,"children":74161},{"style":216},[74162],{"type":26,"value":5370},{"type":21,"tag":209,"props":74164,"children":74165},{"style":222},[74166],{"type":26,"value":368},{"type":21,"tag":209,"props":74168,"children":74169},{"style":400},[74170],{"type":26,"value":10794},{"type":21,"tag":209,"props":74172,"children":74173},{"style":222},[74174],{"type":26,"value":2369},{"type":21,"tag":209,"props":74176,"children":74177},{"class":211,"line":2542},[74178,74183,74187],{"type":21,"tag":209,"props":74179,"children":74180},{"style":222},[74181],{"type":26,"value":74182},"            event ",{"type":21,"tag":209,"props":74184,"children":74185},{"style":216},[74186],{"type":26,"value":1432},{"type":21,"tag":209,"props":74188,"children":74189},{"style":222},[74190],{"type":26,"value":70837},{"type":21,"tag":209,"props":74192,"children":74193},{"class":211,"line":2550},[74194,74199,74204],{"type":21,"tag":209,"props":74195,"children":74196},{"style":222},[74197],{"type":26,"value":74198},"            that.",{"type":21,"tag":209,"props":74200,"children":74201},{"style":360},[74202],{"type":26,"value":74203},"handleDragover",{"type":21,"tag":209,"props":74205,"children":74206},{"style":222},[74207],{"type":26,"value":27301},{"type":21,"tag":209,"props":74209,"children":74210},{"class":211,"line":2564},[74211],{"type":21,"tag":209,"props":74212,"children":74213},{"style":222},[74214],{"type":26,"value":5114},{"type":21,"tag":209,"props":74216,"children":74217},{"class":211,"line":2611},[74218],{"type":21,"tag":209,"props":74219,"children":74220},{"style":222},[74221],{"type":26,"value":331},{"type":21,"tag":209,"props":74223,"children":74224},{"class":211,"line":2619},[74225,74229,74233,74237,74241,74245,74249,74253,74257,74261,74265,74269,74273,74277],{"type":21,"tag":209,"props":74226,"children":74227},{"style":263},[74228],{"type":26,"value":51112},{"type":21,"tag":209,"props":74230,"children":74231},{"style":222},[74232],{"type":26,"value":57646},{"type":21,"tag":209,"props":74234,"children":74235},{"style":360},[74236],{"type":26,"value":70775},{"type":21,"tag":209,"props":74238,"children":74239},{"style":222},[74240],{"type":26,"value":368},{"type":21,"tag":209,"props":74242,"children":74243},{"style":233},[74244],{"type":26,"value":70927},{"type":21,"tag":209,"props":74246,"children":74247},{"style":222},[74248],{"type":26,"value":2699},{"type":21,"tag":209,"props":74250,"children":74251},{"style":360},[74252],{"type":26,"value":363},{"type":21,"tag":209,"props":74254,"children":74255},{"style":222},[74256],{"type":26,"value":368},{"type":21,"tag":209,"props":74258,"children":74259},{"style":233},[74260],{"type":26,"value":70927},{"type":21,"tag":209,"props":74262,"children":74263},{"style":222},[74264],{"type":26,"value":408},{"type":21,"tag":209,"props":74266,"children":74267},{"style":216},[74268],{"type":26,"value":5370},{"type":21,"tag":209,"props":74270,"children":74271},{"style":222},[74272],{"type":26,"value":368},{"type":21,"tag":209,"props":74274,"children":74275},{"style":400},[74276],{"type":26,"value":10794},{"type":21,"tag":209,"props":74278,"children":74279},{"style":222},[74280],{"type":26,"value":2369},{"type":21,"tag":209,"props":74282,"children":74283},{"class":211,"line":2627},[74284,74289,74293],{"type":21,"tag":209,"props":74285,"children":74286},{"style":222},[74287],{"type":26,"value":74288},"        event ",{"type":21,"tag":209,"props":74290,"children":74291},{"style":216},[74292],{"type":26,"value":1432},{"type":21,"tag":209,"props":74294,"children":74295},{"style":222},[74296],{"type":26,"value":70837},{"type":21,"tag":209,"props":74298,"children":74299},{"class":211,"line":2636},[74300,74305,74310],{"type":21,"tag":209,"props":74301,"children":74302},{"style":222},[74303],{"type":26,"value":74304},"        that.",{"type":21,"tag":209,"props":74306,"children":74307},{"style":360},[74308],{"type":26,"value":74309},"handleSelect",{"type":21,"tag":209,"props":74311,"children":74312},{"style":222},[74313],{"type":26,"value":27301},{"type":21,"tag":209,"props":74315,"children":74316},{"class":211,"line":2644},[74317],{"type":21,"tag":209,"props":74318,"children":74319},{"style":222},[74320],{"type":26,"value":3391},{"type":21,"tag":209,"props":74322,"children":74323},{"class":211,"line":2657},[74324],{"type":21,"tag":209,"props":74325,"children":74326},{"style":222},[74327],{"type":26,"value":7798},{"type":21,"tag":209,"props":74329,"children":74330},{"class":211,"line":2728},[74331],{"type":21,"tag":209,"props":74332,"children":74333},{"emptyLinePlaceholder":248},[74334],{"type":26,"value":251},{"type":21,"tag":209,"props":74336,"children":74337},{"class":211,"line":2758},[74338],{"type":21,"tag":209,"props":74339,"children":74340},{"style":448},[74341],{"type":26,"value":731},{"type":21,"tag":209,"props":74343,"children":74344},{"class":211,"line":2776},[74345],{"type":21,"tag":209,"props":74346,"children":74347},{"style":448},[74348],{"type":26,"value":74349}," * Return whether the passed element is an input of type file.\n",{"type":21,"tag":209,"props":74351,"children":74352},{"class":211,"line":2785},[74353,74357,74361,74366],{"type":21,"tag":209,"props":74354,"children":74355},{"style":448},[74356],{"type":26,"value":11233},{"type":21,"tag":209,"props":74358,"children":74359},{"style":216},[74360],{"type":26,"value":4718},{"type":21,"tag":209,"props":74362,"children":74363},{"style":222},[74364],{"type":26,"value":74365}," input",{"type":21,"tag":209,"props":74367,"children":74368},{"style":448},[74369],{"type":26,"value":74370}," Element to check.\n",{"type":21,"tag":209,"props":74372,"children":74373},{"class":211,"line":2793},[74374,74378,74382],{"type":21,"tag":209,"props":74375,"children":74376},{"style":448},[74377],{"type":26,"value":11233},{"type":21,"tag":209,"props":74379,"children":74380},{"style":216},[74381],{"type":26,"value":4740},{"type":21,"tag":209,"props":74383,"children":74384},{"style":360},[74385],{"type":26,"value":74386}," {boolean}\n",{"type":21,"tag":209,"props":74388,"children":74389},{"class":211,"line":2801},[74390],{"type":21,"tag":209,"props":74391,"children":74392},{"style":448},[74393],{"type":26,"value":755},{"type":21,"tag":209,"props":74395,"children":74396},{"class":211,"line":2809},[74397,74401,74405,74409,74413,74417,74421,74425,74429,74433],{"type":21,"tag":209,"props":74398,"children":74399},{"style":263},[74400],{"type":26,"value":56462},{"type":21,"tag":209,"props":74402,"children":74403},{"style":222},[74404],{"type":26,"value":378},{"type":21,"tag":209,"props":74406,"children":74407},{"style":263},[74408],{"type":26,"value":37016},{"type":21,"tag":209,"props":74410,"children":74411},{"style":222},[74412],{"type":26,"value":378},{"type":21,"tag":209,"props":74414,"children":74415},{"style":360},[74416],{"type":26,"value":74072},{"type":21,"tag":209,"props":74418,"children":74419},{"style":216},[74420],{"type":26,"value":271},{"type":21,"tag":209,"props":74422,"children":74423},{"style":216},[74424],{"type":26,"value":4766},{"type":21,"tag":209,"props":74426,"children":74427},{"style":222},[74428],{"type":26,"value":368},{"type":21,"tag":209,"props":74430,"children":74431},{"style":400},[74432],{"type":26,"value":34026},{"type":21,"tag":209,"props":74434,"children":74435},{"style":222},[74436],{"type":26,"value":2369},{"type":21,"tag":209,"props":74438,"children":74439},{"class":211,"line":6219},[74440,74444,74449,74453,74458,74462,74467,74472,74476,74480,74485,74489,74493,74498,74502,74506,74510,74514,74518,74523,74527,74531,74535,74539],{"type":21,"tag":209,"props":74441,"children":74442},{"style":216},[74443],{"type":26,"value":1298},{"type":21,"tag":209,"props":74445,"children":74446},{"style":222},[74447],{"type":26,"value":74448}," (input[",{"type":21,"tag":209,"props":74450,"children":74451},{"style":263},[74452],{"type":26,"value":6048},{"type":21,"tag":209,"props":74454,"children":74455},{"style":222},[74456],{"type":26,"value":74457},"].tagName ",{"type":21,"tag":209,"props":74459,"children":74460},{"style":216},[74461],{"type":26,"value":6102},{"type":21,"tag":209,"props":74463,"children":74464},{"style":233},[74465],{"type":26,"value":74466}," 'INPUT'",{"type":21,"tag":209,"props":74468,"children":74469},{"style":216},[74470],{"type":26,"value":74471}," &",{"type":21,"tag":209,"props":74473,"children":74474},{"style":222},[74475],{"type":26,"value":69027},{"type":21,"tag":209,"props":74477,"children":74478},{"style":216},[74479],{"type":26,"value":36584},{"type":21,"tag":209,"props":74481,"children":74482},{"style":222},[74483],{"type":26,"value":74484},"amp;amp; input[",{"type":21,"tag":209,"props":74486,"children":74487},{"style":263},[74488],{"type":26,"value":6048},{"type":21,"tag":209,"props":74490,"children":74491},{"style":222},[74492],{"type":26,"value":54820},{"type":21,"tag":209,"props":74494,"children":74495},{"style":360},[74496],{"type":26,"value":74497},"getAttribute",{"type":21,"tag":209,"props":74499,"children":74500},{"style":222},[74501],{"type":26,"value":368},{"type":21,"tag":209,"props":74503,"children":74504},{"style":233},[74505],{"type":26,"value":36941},{"type":21,"tag":209,"props":74507,"children":74508},{"style":222},[74509],{"type":26,"value":2699},{"type":21,"tag":209,"props":74511,"children":74512},{"style":360},[74513],{"type":26,"value":12392},{"type":21,"tag":209,"props":74515,"children":74516},{"style":222},[74517],{"type":26,"value":368},{"type":21,"tag":209,"props":74519,"children":74520},{"style":233},[74521],{"type":26,"value":74522},"'file'",{"type":21,"tag":209,"props":74524,"children":74525},{"style":222},[74526],{"type":26,"value":432},{"type":21,"tag":209,"props":74528,"children":74529},{"style":216},[74530],{"type":26,"value":12011},{"type":21,"tag":209,"props":74532,"children":74533},{"style":216},[74534],{"type":26,"value":12414},{"type":21,"tag":209,"props":74536,"children":74537},{"style":263},[74538],{"type":26,"value":3224},{"type":21,"tag":209,"props":74540,"children":74541},{"style":222},[74542],{"type":26,"value":2608},{"type":21,"tag":209,"props":74544,"children":74545},{"class":211,"line":6228},[74546],{"type":21,"tag":209,"props":74547,"children":74548},{"style":222},[74549],{"type":26,"value":340},{"type":21,"tag":209,"props":74551,"children":74552},{"class":211,"line":6250},[74553],{"type":21,"tag":209,"props":74554,"children":74555},{"emptyLinePlaceholder":248},[74556],{"type":26,"value":251},{"type":21,"tag":209,"props":74558,"children":74559},{"class":211,"line":6258},[74560],{"type":21,"tag":209,"props":74561,"children":74562},{"style":448},[74563],{"type":26,"value":731},{"type":21,"tag":209,"props":74565,"children":74566},{"class":211,"line":6267},[74567],{"type":21,"tag":209,"props":74568,"children":74569},{"style":448},[74570],{"type":26,"value":74571}," * Handle the dragging of file(s) to a target, preventing the rejection of the dragover.\n",{"type":21,"tag":209,"props":74573,"children":74574},{"class":211,"line":6303},[74575,74579,74583],{"type":21,"tag":209,"props":74576,"children":74577},{"style":448},[74578],{"type":26,"value":11233},{"type":21,"tag":209,"props":74580,"children":74581},{"style":216},[74582],{"type":26,"value":4718},{"type":21,"tag":209,"props":74584,"children":74585},{"style":222},[74586],{"type":26,"value":10766},{"type":21,"tag":209,"props":74588,"children":74589},{"class":211,"line":6336},[74590],{"type":21,"tag":209,"props":74591,"children":74592},{"style":448},[74593],{"type":26,"value":755},{"type":21,"tag":209,"props":74595,"children":74596},{"class":211,"line":6369},[74597,74601,74605,74609,74613,74617,74621,74625,74629,74633],{"type":21,"tag":209,"props":74598,"children":74599},{"style":263},[74600],{"type":26,"value":56462},{"type":21,"tag":209,"props":74602,"children":74603},{"style":222},[74604],{"type":26,"value":378},{"type":21,"tag":209,"props":74606,"children":74607},{"style":263},[74608],{"type":26,"value":37016},{"type":21,"tag":209,"props":74610,"children":74611},{"style":222},[74612],{"type":26,"value":378},{"type":21,"tag":209,"props":74614,"children":74615},{"style":360},[74616],{"type":26,"value":74203},{"type":21,"tag":209,"props":74618,"children":74619},{"style":216},[74620],{"type":26,"value":271},{"type":21,"tag":209,"props":74622,"children":74623},{"style":216},[74624],{"type":26,"value":4766},{"type":21,"tag":209,"props":74626,"children":74627},{"style":222},[74628],{"type":26,"value":368},{"type":21,"tag":209,"props":74630,"children":74631},{"style":400},[74632],{"type":26,"value":10794},{"type":21,"tag":209,"props":74634,"children":74635},{"style":222},[74636],{"type":26,"value":2369},{"type":21,"tag":209,"props":74638,"children":74639},{"class":211,"line":6378},[74640,74644,74648],{"type":21,"tag":209,"props":74641,"children":74642},{"style":222},[74643],{"type":26,"value":11587},{"type":21,"tag":209,"props":74645,"children":74646},{"style":360},[74647],{"type":26,"value":70849},{"type":21,"tag":209,"props":74649,"children":74650},{"style":222},[74651],{"type":26,"value":4842},{"type":21,"tag":209,"props":74653,"children":74654},{"class":211,"line":6387},[74655,74659,74663],{"type":21,"tag":209,"props":74656,"children":74657},{"style":222},[74658],{"type":26,"value":11587},{"type":21,"tag":209,"props":74660,"children":74661},{"style":360},[74662],{"type":26,"value":70865},{"type":21,"tag":209,"props":74664,"children":74665},{"style":222},[74666],{"type":26,"value":4842},{"type":21,"tag":209,"props":74668,"children":74669},{"class":211,"line":6395},[74670,74675,74679,74684],{"type":21,"tag":209,"props":74671,"children":74672},{"style":222},[74673],{"type":26,"value":74674},"    event.dataTransfer.dropEffect ",{"type":21,"tag":209,"props":74676,"children":74677},{"style":216},[74678],{"type":26,"value":1432},{"type":21,"tag":209,"props":74680,"children":74681},{"style":233},[74682],{"type":26,"value":74683}," 'copy'",{"type":21,"tag":209,"props":74685,"children":74686},{"style":222},[74687],{"type":26,"value":241},{"type":21,"tag":209,"props":74689,"children":74690},{"class":211,"line":6404},[74691],{"type":21,"tag":209,"props":74692,"children":74693},{"style":222},[74694],{"type":26,"value":340},{"type":21,"tag":209,"props":74696,"children":74697},{"class":211,"line":6413},[74698],{"type":21,"tag":209,"props":74699,"children":74700},{"emptyLinePlaceholder":248},[74701],{"type":26,"value":251},{"type":21,"tag":209,"props":74703,"children":74704},{"class":211,"line":6447},[74705],{"type":21,"tag":209,"props":74706,"children":74707},{"style":448},[74708],{"type":26,"value":731},{"type":21,"tag":209,"props":74710,"children":74711},{"class":211,"line":6479},[74712],{"type":21,"tag":209,"props":74713,"children":74714},{"style":448},[74715],{"type":26,"value":74716}," * Handle the selection of files to upload via an input or drag and drop to a target.\n",{"type":21,"tag":209,"props":74718,"children":74719},{"class":211,"line":6511},[74720,74724,74728],{"type":21,"tag":209,"props":74721,"children":74722},{"style":448},[74723],{"type":26,"value":11233},{"type":21,"tag":209,"props":74725,"children":74726},{"style":216},[74727],{"type":26,"value":4718},{"type":21,"tag":209,"props":74729,"children":74730},{"style":222},[74731],{"type":26,"value":10766},{"type":21,"tag":209,"props":74733,"children":74734},{"class":211,"line":6519},[74735],{"type":21,"tag":209,"props":74736,"children":74737},{"style":448},[74738],{"type":26,"value":755},{"type":21,"tag":209,"props":74740,"children":74741},{"class":211,"line":6527},[74742,74746,74750,74754,74758,74762,74766,74770,74774,74778],{"type":21,"tag":209,"props":74743,"children":74744},{"style":263},[74745],{"type":26,"value":56462},{"type":21,"tag":209,"props":74747,"children":74748},{"style":222},[74749],{"type":26,"value":378},{"type":21,"tag":209,"props":74751,"children":74752},{"style":263},[74753],{"type":26,"value":37016},{"type":21,"tag":209,"props":74755,"children":74756},{"style":222},[74757],{"type":26,"value":378},{"type":21,"tag":209,"props":74759,"children":74760},{"style":360},[74761],{"type":26,"value":74309},{"type":21,"tag":209,"props":74763,"children":74764},{"style":216},[74765],{"type":26,"value":271},{"type":21,"tag":209,"props":74767,"children":74768},{"style":216},[74769],{"type":26,"value":4766},{"type":21,"tag":209,"props":74771,"children":74772},{"style":222},[74773],{"type":26,"value":368},{"type":21,"tag":209,"props":74775,"children":74776},{"style":400},[74777],{"type":26,"value":10794},{"type":21,"tag":209,"props":74779,"children":74780},{"style":222},[74781],{"type":26,"value":2369},{"type":21,"tag":209,"props":74783,"children":74784},{"class":211,"line":6535},[74785,74789],{"type":21,"tag":209,"props":74786,"children":74787},{"style":216},[74788],{"type":26,"value":10405},{"type":21,"tag":209,"props":74790,"children":74791},{"style":222},[74792],{"type":26,"value":70895},{"type":21,"tag":209,"props":74794,"children":74795},{"class":211,"line":6543},[74796],{"type":21,"tag":209,"props":74797,"children":74798},{"emptyLinePlaceholder":248},[74799],{"type":26,"value":251},{"type":21,"tag":209,"props":74801,"children":74802},{"class":211,"line":6552},[74803,74807,74811,74815],{"type":21,"tag":209,"props":74804,"children":74805},{"style":216},[74806],{"type":26,"value":10853},{"type":21,"tag":209,"props":74808,"children":74809},{"style":222},[74810],{"type":26,"value":4776},{"type":21,"tag":209,"props":74812,"children":74813},{"style":263},[74814],{"type":26,"value":2508},{"type":21,"tag":209,"props":74816,"children":74817},{"style":222},[74818],{"type":26,"value":74819},".options.make_dnd)\n",{"type":21,"tag":209,"props":74821,"children":74822},{"class":211,"line":6572},[74823],{"type":21,"tag":209,"props":74824,"children":74825},{"style":222},[74826],{"type":26,"value":37029},{"type":21,"tag":209,"props":74828,"children":74829},{"class":211,"line":6589},[74830,74835,74839],{"type":21,"tag":209,"props":74831,"children":74832},{"style":222},[74833],{"type":26,"value":74834},"        event.",{"type":21,"tag":209,"props":74836,"children":74837},{"style":360},[74838],{"type":26,"value":70849},{"type":21,"tag":209,"props":74840,"children":74841},{"style":222},[74842],{"type":26,"value":4842},{"type":21,"tag":209,"props":74844,"children":74845},{"class":211,"line":6597},[74846,74850,74854],{"type":21,"tag":209,"props":74847,"children":74848},{"style":222},[74849],{"type":26,"value":74834},{"type":21,"tag":209,"props":74851,"children":74852},{"style":360},[74853],{"type":26,"value":70865},{"type":21,"tag":209,"props":74855,"children":74856},{"style":222},[74857],{"type":26,"value":4842},{"type":21,"tag":209,"props":74859,"children":74860},{"class":211,"line":6625},[74861,74866,74870],{"type":21,"tag":209,"props":74862,"children":74863},{"style":222},[74864],{"type":26,"value":74865},"        files ",{"type":21,"tag":209,"props":74867,"children":74868},{"style":216},[74869],{"type":26,"value":1432},{"type":21,"tag":209,"props":74871,"children":74872},{"style":222},[74873],{"type":26,"value":71033},{"type":21,"tag":209,"props":74875,"children":74876},{"class":211,"line":6648},[74877],{"type":21,"tag":209,"props":74878,"children":74879},{"style":222},[74880],{"type":26,"value":331},{"type":21,"tag":209,"props":74882,"children":74883},{"class":211,"line":6670},[74884],{"type":21,"tag":209,"props":74885,"children":74886},{"style":216},[74887],{"type":26,"value":72200},{"type":21,"tag":209,"props":74889,"children":74890},{"class":211,"line":6678},[74891],{"type":21,"tag":209,"props":74892,"children":74893},{"style":222},[74894],{"type":26,"value":37029},{"type":21,"tag":209,"props":74896,"children":74897},{"class":211,"line":6686},[74898,74902,74906],{"type":21,"tag":209,"props":74899,"children":74900},{"style":222},[74901],{"type":26,"value":74865},{"type":21,"tag":209,"props":74903,"children":74904},{"style":216},[74905],{"type":26,"value":1432},{"type":21,"tag":209,"props":74907,"children":74908},{"style":222},[74909],{"type":26,"value":71057},{"type":21,"tag":209,"props":74911,"children":74912},{"class":211,"line":6714},[74913],{"type":21,"tag":209,"props":74914,"children":74915},{"style":222},[74916],{"type":26,"value":331},{"type":21,"tag":209,"props":74918,"children":74919},{"class":211,"line":6747},[74920,74924,74928,74932,74937,74941],{"type":21,"tag":209,"props":74921,"children":74922},{"style":216},[74923],{"type":26,"value":10853},{"type":21,"tag":209,"props":74925,"children":74926},{"style":222},[74927],{"type":26,"value":4776},{"type":21,"tag":209,"props":74929,"children":74930},{"style":216},[74931],{"type":26,"value":15052},{"type":21,"tag":209,"props":74933,"children":74934},{"style":222},[74935],{"type":26,"value":74936},"files.",{"type":21,"tag":209,"props":74938,"children":74939},{"style":263},[74940],{"type":26,"value":36467},{"type":21,"tag":209,"props":74942,"children":74943},{"style":222},[74944],{"type":26,"value":10112},{"type":21,"tag":209,"props":74946,"children":74947},{"class":211,"line":6761},[74948],{"type":21,"tag":209,"props":74949,"children":74950},{"style":222},[74951],{"type":26,"value":37029},{"type":21,"tag":209,"props":74953,"children":74954},{"class":211,"line":6769},[74955,74959,74963,74967,74971,74976,74981,74985],{"type":21,"tag":209,"props":74956,"children":74957},{"style":263},[74958],{"type":26,"value":51473},{"type":21,"tag":209,"props":74960,"children":74961},{"style":222},[74962],{"type":26,"value":57646},{"type":21,"tag":209,"props":74964,"children":74965},{"style":360},[74966],{"type":26,"value":499},{"type":21,"tag":209,"props":74968,"children":74969},{"style":222},[74970],{"type":26,"value":57655},{"type":21,"tag":209,"props":74972,"children":74973},{"style":263},[74974],{"type":26,"value":74975},"FILE_LIST_ERROR",{"type":21,"tag":209,"props":74977,"children":74978},{"style":222},[74979],{"type":26,"value":74980},", {state:Hup.state.",{"type":21,"tag":209,"props":74982,"children":74983},{"style":263},[74984],{"type":26,"value":74975},{"type":21,"tag":209,"props":74986,"children":74987},{"style":222},[74988],{"type":26,"value":304},{"type":21,"tag":209,"props":74990,"children":74991},{"class":211,"line":6782},[74992,74997,75002],{"type":21,"tag":209,"props":74993,"children":74994},{"style":222},[74995],{"type":26,"value":74996},"            error:",{"type":21,"tag":209,"props":74998,"children":74999},{"style":233},[75000],{"type":26,"value":75001},"'No files found in file list; no files were selected.'",{"type":21,"tag":209,"props":75003,"children":75004},{"style":222},[75005],{"type":26,"value":469},{"type":21,"tag":209,"props":75007,"children":75008},{"class":211,"line":6812},[75009,75013],{"type":21,"tag":209,"props":75010,"children":75011},{"style":216},[75012],{"type":26,"value":3069},{"type":21,"tag":209,"props":75014,"children":75015},{"style":222},[75016],{"type":26,"value":241},{"type":21,"tag":209,"props":75018,"children":75019},{"class":211,"line":6831},[75020],{"type":21,"tag":209,"props":75021,"children":75022},{"style":222},[75023],{"type":26,"value":331},{"type":21,"tag":209,"props":75025,"children":75026},{"class":211,"line":6840},[75027,75031,75035,75039,75043,75048,75052,75056],{"type":21,"tag":209,"props":75028,"children":75029},{"style":263},[75030],{"type":26,"value":51112},{"type":21,"tag":209,"props":75032,"children":75033},{"style":222},[75034],{"type":26,"value":57646},{"type":21,"tag":209,"props":75036,"children":75037},{"style":360},[75038],{"type":26,"value":499},{"type":21,"tag":209,"props":75040,"children":75041},{"style":222},[75042],{"type":26,"value":57655},{"type":21,"tag":209,"props":75044,"children":75045},{"style":263},[75046],{"type":26,"value":75047},"FILE_LIST_LOADED",{"type":21,"tag":209,"props":75049,"children":75050},{"style":222},[75051],{"type":26,"value":74980},{"type":21,"tag":209,"props":75053,"children":75054},{"style":263},[75055],{"type":26,"value":75047},{"type":21,"tag":209,"props":75057,"children":75058},{"style":222},[75059],{"type":26,"value":75060},", files:files});\n",{"type":21,"tag":209,"props":75062,"children":75063},{"class":211,"line":6864},[75064],{"type":21,"tag":209,"props":75065,"children":75066},{"emptyLinePlaceholder":248},[75067],{"type":26,"value":251},{"type":21,"tag":209,"props":75069,"children":75070},{"class":211,"line":6872},[75071,75075,75079,75083,75088,75092],{"type":21,"tag":209,"props":75072,"children":75073},{"style":263},[75074],{"type":26,"value":51112},{"type":21,"tag":209,"props":75076,"children":75077},{"style":222},[75078],{"type":26,"value":378},{"type":21,"tag":209,"props":75080,"children":75081},{"style":360},[75082],{"type":26,"value":57207},{"type":21,"tag":209,"props":75084,"children":75085},{"style":222},[75086],{"type":26,"value":75087},"(files, ",{"type":21,"tag":209,"props":75089,"children":75090},{"style":263},[75091],{"type":26,"value":2508},{"type":21,"tag":209,"props":75093,"children":75094},{"style":222},[75095],{"type":26,"value":75096},".options.url);\n",{"type":21,"tag":209,"props":75098,"children":75099},{"class":211,"line":6880},[75100],{"type":21,"tag":209,"props":75101,"children":75102},{"style":222},[75103],{"type":26,"value":340},{"type":21,"tag":209,"props":75105,"children":75106},{"class":211,"line":6899},[75107],{"type":21,"tag":209,"props":75108,"children":75109},{"emptyLinePlaceholder":248},[75110],{"type":26,"value":251},{"type":21,"tag":209,"props":75112,"children":75113},{"class":211,"line":6907},[75114],{"type":21,"tag":209,"props":75115,"children":75116},{"style":448},[75117],{"type":26,"value":731},{"type":21,"tag":209,"props":75119,"children":75120},{"class":211,"line":6919},[75121],{"type":21,"tag":209,"props":75122,"children":75123},{"style":448},[75124],{"type":26,"value":75125}," * Process the files in the fileList, uploading them if a url is specified, otherwise reading them into\n",{"type":21,"tag":209,"props":75127,"children":75128},{"class":211,"line":6927},[75129],{"type":21,"tag":209,"props":75130,"children":75131},{"style":448},[75132],{"type":26,"value":75133}," * memory and passing them on to be used in the browser.\n",{"type":21,"tag":209,"props":75135,"children":75136},{"class":211,"line":6935},[75137,75141,75145],{"type":21,"tag":209,"props":75138,"children":75139},{"style":448},[75140],{"type":26,"value":11233},{"type":21,"tag":209,"props":75142,"children":75143},{"style":216},[75144],{"type":26,"value":4718},{"type":21,"tag":209,"props":75146,"children":75147},{"style":222},[75148],{"type":26,"value":57160},{"type":21,"tag":209,"props":75150,"children":75151},{"class":211,"line":6943},[75152,75156,75160],{"type":21,"tag":209,"props":75153,"children":75154},{"style":448},[75155],{"type":26,"value":11233},{"type":21,"tag":209,"props":75157,"children":75158},{"style":216},[75159],{"type":26,"value":4718},{"type":21,"tag":209,"props":75161,"children":75162},{"style":222},[75163],{"type":26,"value":57176},{"type":21,"tag":209,"props":75165,"children":75166},{"class":211,"line":6952},[75167],{"type":21,"tag":209,"props":75168,"children":75169},{"style":448},[75170],{"type":26,"value":755},{"type":21,"tag":209,"props":75172,"children":75173},{"class":211,"line":6961},[75174,75178,75182,75186,75190,75194,75198,75202,75206,75210,75214,75218],{"type":21,"tag":209,"props":75175,"children":75176},{"style":263},[75177],{"type":26,"value":56462},{"type":21,"tag":209,"props":75179,"children":75180},{"style":222},[75181],{"type":26,"value":378},{"type":21,"tag":209,"props":75183,"children":75184},{"style":263},[75185],{"type":26,"value":37016},{"type":21,"tag":209,"props":75187,"children":75188},{"style":222},[75189],{"type":26,"value":378},{"type":21,"tag":209,"props":75191,"children":75192},{"style":360},[75193],{"type":26,"value":57207},{"type":21,"tag":209,"props":75195,"children":75196},{"style":216},[75197],{"type":26,"value":271},{"type":21,"tag":209,"props":75199,"children":75200},{"style":216},[75201],{"type":26,"value":4766},{"type":21,"tag":209,"props":75203,"children":75204},{"style":222},[75205],{"type":26,"value":368},{"type":21,"tag":209,"props":75207,"children":75208},{"style":400},[75209],{"type":26,"value":57224},{"type":21,"tag":209,"props":75211,"children":75212},{"style":222},[75213],{"type":26,"value":408},{"type":21,"tag":209,"props":75215,"children":75216},{"style":400},[75217],{"type":26,"value":32649},{"type":21,"tag":209,"props":75219,"children":75220},{"style":222},[75221],{"type":26,"value":2369},{"type":21,"tag":209,"props":75223,"children":75224},{"class":211,"line":6977},[75225,75229,75233,75237,75241],{"type":21,"tag":209,"props":75226,"children":75227},{"style":216},[75228],{"type":26,"value":10405},{"type":21,"tag":209,"props":75230,"children":75231},{"style":222},[75232],{"type":26,"value":57248},{"type":21,"tag":209,"props":75234,"children":75235},{"style":216},[75236],{"type":26,"value":1432},{"type":21,"tag":209,"props":75238,"children":75239},{"style":263},[75240],{"type":26,"value":17698},{"type":21,"tag":209,"props":75242,"children":75243},{"style":222},[75244],{"type":26,"value":304},{"type":21,"tag":209,"props":75246,"children":75247},{"class":211,"line":6993},[75248,75252,75256,75260],{"type":21,"tag":209,"props":75249,"children":75250},{"style":222},[75251],{"type":26,"value":57268},{"type":21,"tag":209,"props":75253,"children":75254},{"style":216},[75255],{"type":26,"value":1432},{"type":21,"tag":209,"props":75257,"children":75258},{"style":263},[75259],{"type":26,"value":17197},{"type":21,"tag":209,"props":75261,"children":75262},{"style":222},[75263],{"type":26,"value":241},{"type":21,"tag":209,"props":75265,"children":75266},{"class":211,"line":7001},[75267],{"type":21,"tag":209,"props":75268,"children":75269},{"emptyLinePlaceholder":248},[75270],{"type":26,"value":251},{"type":21,"tag":209,"props":75272,"children":75273},{"class":211,"line":7025},[75274,75278,75282,75286,75290,75294,75298,75302,75306,75310,75314,75318,75322,75327,75331],{"type":21,"tag":209,"props":75275,"children":75276},{"style":216},[75277],{"type":26,"value":55989},{"type":21,"tag":209,"props":75279,"children":75280},{"style":222},[75281],{"type":26,"value":4776},{"type":21,"tag":209,"props":75283,"children":75284},{"style":216},[75285],{"type":26,"value":8996},{"type":21,"tag":209,"props":75287,"children":75288},{"style":222},[75289],{"type":26,"value":36621},{"type":21,"tag":209,"props":75291,"children":75292},{"style":216},[75293],{"type":26,"value":1432},{"type":21,"tag":209,"props":75295,"children":75296},{"style":263},[75297],{"type":26,"value":6048},{"type":21,"tag":209,"props":75299,"children":75300},{"style":222},[75301],{"type":26,"value":56664},{"type":21,"tag":209,"props":75303,"children":75304},{"style":216},[75305],{"type":26,"value":1432},{"type":21,"tag":209,"props":75307,"children":75308},{"style":222},[75309],{"type":26,"value":57396},{"type":21,"tag":209,"props":75311,"children":75312},{"style":263},[75313],{"type":26,"value":36467},{"type":21,"tag":209,"props":75315,"children":75316},{"style":222},[75317],{"type":26,"value":36647},{"type":21,"tag":209,"props":75319,"children":75320},{"style":216},[75321],{"type":26,"value":36584},{"type":21,"tag":209,"props":75323,"children":75324},{"style":222},[75325],{"type":26,"value":75326},"amp;lt; len; i",{"type":21,"tag":209,"props":75328,"children":75329},{"style":216},[75330],{"type":26,"value":36661},{"type":21,"tag":209,"props":75332,"children":75333},{"style":222},[75334],{"type":26,"value":10112},{"type":21,"tag":209,"props":75336,"children":75337},{"class":211,"line":7066},[75338],{"type":21,"tag":209,"props":75339,"children":75340},{"style":222},[75341],{"type":26,"value":37029},{"type":21,"tag":209,"props":75343,"children":75344},{"class":211,"line":7094},[75345,75349,75354,75358,75362,75366,75370,75374,75378,75382,75386],{"type":21,"tag":209,"props":75346,"children":75347},{"style":216},[75348],{"type":26,"value":5925},{"type":21,"tag":209,"props":75350,"children":75351},{"style":222},[75352],{"type":26,"value":75353}," fprocess ",{"type":21,"tag":209,"props":75355,"children":75356},{"style":216},[75357],{"type":26,"value":1432},{"type":21,"tag":209,"props":75359,"children":75360},{"style":222},[75361],{"type":26,"value":57982},{"type":21,"tag":209,"props":75363,"children":75364},{"style":216},[75365],{"type":26,"value":15218},{"type":21,"tag":209,"props":75367,"children":75368},{"style":216},[75369],{"type":26,"value":4667},{"type":21,"tag":209,"props":75371,"children":75372},{"style":360},[75373],{"type":26,"value":57995},{"type":21,"tag":209,"props":75375,"children":75376},{"style":222},[75377],{"type":26,"value":368},{"type":21,"tag":209,"props":75379,"children":75380},{"style":263},[75381],{"type":26,"value":2508},{"type":21,"tag":209,"props":75383,"children":75384},{"style":222},[75385],{"type":26,"value":58008},{"type":21,"tag":209,"props":75387,"children":75388},{"style":216},[75389],{"type":26,"value":844},{"type":21,"tag":209,"props":75391,"children":75392},{"class":211,"line":7110},[75393,75398,75402,75406,75410],{"type":21,"tag":209,"props":75394,"children":75395},{"style":216},[75396],{"type":26,"value":75397},"            new",{"type":21,"tag":209,"props":75399,"children":75400},{"style":360},[75401],{"type":26,"value":58025},{"type":21,"tag":209,"props":75403,"children":75404},{"style":222},[75405],{"type":26,"value":368},{"type":21,"tag":209,"props":75407,"children":75408},{"style":263},[75409],{"type":26,"value":2508},{"type":21,"tag":209,"props":75411,"children":75412},{"style":222},[75413],{"type":26,"value":58038},{"type":21,"tag":209,"props":75415,"children":75416},{"class":211,"line":7126},[75417],{"type":21,"tag":209,"props":75418,"children":75419},{"emptyLinePlaceholder":248},[75420],{"type":26,"value":251},{"type":21,"tag":209,"props":75422,"children":75423},{"class":211,"line":7142},[75424,75429,75433,75437,75441,75445,75449],{"type":21,"tag":209,"props":75425,"children":75426},{"style":222},[75427],{"type":26,"value":75428},"        fprocess.",{"type":21,"tag":209,"props":75430,"children":75431},{"style":360},[75432],{"type":26,"value":58058},{"type":21,"tag":209,"props":75434,"children":75435},{"style":222},[75436],{"type":26,"value":368},{"type":21,"tag":209,"props":75438,"children":75439},{"style":216},[75440],{"type":26,"value":5370},{"type":21,"tag":209,"props":75442,"children":75443},{"style":222},[75444],{"type":26,"value":368},{"type":21,"tag":209,"props":75446,"children":75447},{"style":400},[75448],{"type":26,"value":58058},{"type":21,"tag":209,"props":75450,"children":75451},{"style":222},[75452],{"type":26,"value":2369},{"type":21,"tag":209,"props":75454,"children":75455},{"class":211,"line":7150},[75456,75460,75464],{"type":21,"tag":209,"props":75457,"children":75458},{"style":222},[75459],{"type":26,"value":58197},{"type":21,"tag":209,"props":75461,"children":75462},{"style":360},[75463],{"type":26,"value":499},{"type":21,"tag":209,"props":75465,"children":75466},{"style":222},[75467],{"type":26,"value":58095},{"type":21,"tag":209,"props":75469,"children":75470},{"class":211,"line":7162},[75471,75475,75479,75483,75487,75491,75495],{"type":21,"tag":209,"props":75472,"children":75473},{"style":222},[75474],{"type":26,"value":11670},{"type":21,"tag":209,"props":75476,"children":75477},{"style":360},[75478],{"type":26,"value":18042},{"type":21,"tag":209,"props":75480,"children":75481},{"style":222},[75482],{"type":26,"value":368},{"type":21,"tag":209,"props":75484,"children":75485},{"style":216},[75486],{"type":26,"value":5370},{"type":21,"tag":209,"props":75488,"children":75489},{"style":222},[75490],{"type":26,"value":368},{"type":21,"tag":209,"props":75492,"children":75493},{"style":400},[75494],{"type":26,"value":1385},{"type":21,"tag":209,"props":75496,"children":75497},{"style":222},[75498],{"type":26,"value":2369},{"type":21,"tag":209,"props":75500,"children":75501},{"class":211,"line":7170},[75502,75506,75510],{"type":21,"tag":209,"props":75503,"children":75504},{"style":222},[75505],{"type":26,"value":58197},{"type":21,"tag":209,"props":75507,"children":75508},{"style":360},[75509],{"type":26,"value":499},{"type":21,"tag":209,"props":75511,"children":75512},{"style":222},[75513],{"type":26,"value":58143},{"type":21,"tag":209,"props":75515,"children":75516},{"class":211,"line":7178},[75517,75522,75526],{"type":21,"tag":209,"props":75518,"children":75519},{"style":222},[75520],{"type":26,"value":75521},"            processed",{"type":21,"tag":209,"props":75523,"children":75524},{"style":216},[75525],{"type":26,"value":36661},{"type":21,"tag":209,"props":75527,"children":75528},{"style":222},[75529],{"type":26,"value":241},{"type":21,"tag":209,"props":75531,"children":75532},{"class":211,"line":7186},[75533,75537,75541,75545],{"type":21,"tag":209,"props":75534,"children":75535},{"style":216},[75536],{"type":26,"value":6083},{"type":21,"tag":209,"props":75538,"children":75539},{"style":222},[75540],{"type":26,"value":58171},{"type":21,"tag":209,"props":75542,"children":75543},{"style":216},[75544],{"type":26,"value":12908},{"type":21,"tag":209,"props":75546,"children":75547},{"style":222},[75548],{"type":26,"value":75549}," len)\n",{"type":21,"tag":209,"props":75551,"children":75552},{"class":211,"line":7199},[75553,75558,75562,75566,75570,75574,75578,75582,75586,75590],{"type":21,"tag":209,"props":75554,"children":75555},{"style":222},[75556],{"type":26,"value":75557},"                that.input.",{"type":21,"tag":209,"props":75559,"children":75560},{"style":360},[75561],{"type":26,"value":499},{"type":21,"tag":209,"props":75563,"children":75564},{"style":222},[75565],{"type":26,"value":58206},{"type":21,"tag":209,"props":75567,"children":75568},{"style":216},[75569],{"type":26,"value":15218},{"type":21,"tag":209,"props":75571,"children":75572},{"style":222},[75573],{"type":26,"value":58215},{"type":21,"tag":209,"props":75575,"children":75576},{"style":263},[75577],{"type":26,"value":58220},{"type":21,"tag":209,"props":75579,"children":75580},{"style":216},[75581],{"type":26,"value":58225},{"type":21,"tag":209,"props":75583,"children":75584},{"style":222},[75585],{"type":26,"value":58215},{"type":21,"tag":209,"props":75587,"children":75588},{"style":263},[75589],{"type":26,"value":58234},{"type":21,"tag":209,"props":75591,"children":75592},{"style":222},[75593],{"type":26,"value":58239},{"type":21,"tag":209,"props":75595,"children":75596},{"class":211,"line":16789},[75597,75602,75606,75610,75614,75618,75622,75626],{"type":21,"tag":209,"props":75598,"children":75599},{"style":222},[75600],{"type":26,"value":75601},"                    {state:(upload) ",{"type":21,"tag":209,"props":75603,"children":75604},{"style":216},[75605],{"type":26,"value":15218},{"type":21,"tag":209,"props":75607,"children":75608},{"style":222},[75609],{"type":26,"value":58215},{"type":21,"tag":209,"props":75611,"children":75612},{"style":263},[75613],{"type":26,"value":58220},{"type":21,"tag":209,"props":75615,"children":75616},{"style":216},[75617],{"type":26,"value":58225},{"type":21,"tag":209,"props":75619,"children":75620},{"style":222},[75621],{"type":26,"value":58215},{"type":21,"tag":209,"props":75623,"children":75624},{"style":263},[75625],{"type":26,"value":58234},{"type":21,"tag":209,"props":75627,"children":75628},{"style":222},[75629],{"type":26,"value":58276},{"type":21,"tag":209,"props":75631,"children":75632},{"class":211,"line":16798},[75633,75637,75641,75645,75649,75653,75657],{"type":21,"tag":209,"props":75634,"children":75635},{"style":222},[75636],{"type":26,"value":11670},{"type":21,"tag":209,"props":75638,"children":75639},{"style":360},[75640],{"type":26,"value":18091},{"type":21,"tag":209,"props":75642,"children":75643},{"style":222},[75644],{"type":26,"value":368},{"type":21,"tag":209,"props":75646,"children":75647},{"style":216},[75648],{"type":26,"value":5370},{"type":21,"tag":209,"props":75650,"children":75651},{"style":222},[75652],{"type":26,"value":368},{"type":21,"tag":209,"props":75654,"children":75655},{"style":400},[75656],{"type":26,"value":1385},{"type":21,"tag":209,"props":75658,"children":75659},{"style":222},[75660],{"type":26,"value":10112},{"type":21,"tag":209,"props":75662,"children":75663},{"class":211,"line":16812},[75664],{"type":21,"tag":209,"props":75665,"children":75666},{"style":222},[75667],{"type":26,"value":7561},{"type":21,"tag":209,"props":75669,"children":75670},{"class":211,"line":16821},[75671,75675,75679],{"type":21,"tag":209,"props":75672,"children":75673},{"style":222},[75674],{"type":26,"value":58197},{"type":21,"tag":209,"props":75676,"children":75677},{"style":360},[75678],{"type":26,"value":499},{"type":21,"tag":209,"props":75680,"children":75681},{"style":222},[75682],{"type":26,"value":58143},{"type":21,"tag":209,"props":75684,"children":75685},{"class":211,"line":16835},[75686],{"type":21,"tag":209,"props":75687,"children":75688},{"style":222},[75689],{"type":26,"value":5114},{"type":21,"tag":209,"props":75691,"children":75692},{"class":211,"line":16849},[75693],{"type":21,"tag":209,"props":75694,"children":75695},{"style":222},[75696],{"type":26,"value":331},{"type":21,"tag":209,"props":75698,"children":75699},{"class":211,"line":16857},[75700],{"type":21,"tag":209,"props":75701,"children":75702},{"style":222},[75703],{"type":26,"value":340},{"type":21,"tag":209,"props":75705,"children":75706},{"class":211,"line":16898},[75707],{"type":21,"tag":209,"props":75708,"children":75709},{"emptyLinePlaceholder":248},[75710],{"type":26,"value":251},{"type":21,"tag":209,"props":75712,"children":75713},{"class":211,"line":16923},[75714],{"type":21,"tag":209,"props":75715,"children":75716},{"style":448},[75717],{"type":26,"value":731},{"type":21,"tag":209,"props":75719,"children":75720},{"class":211,"line":16954},[75721],{"type":21,"tag":209,"props":75722,"children":75723},{"style":448},[75724],{"type":26,"value":75725}," * Custom events we'll trigger on our input element at the appropriate times.\n",{"type":21,"tag":209,"props":75727,"children":75728},{"class":211,"line":16976},[75729,75733,75737],{"type":21,"tag":209,"props":75730,"children":75731},{"style":448},[75732],{"type":26,"value":11233},{"type":21,"tag":209,"props":75734,"children":75735},{"style":216},[75736],{"type":26,"value":51414},{"type":21,"tag":209,"props":75738,"children":75739},{"style":360},[75740],{"type":26,"value":75741}," {{FILE_LIST_ERROR: string, FILE_LIST_LOADED: string, FILE_READ_ERROR: string,\n",{"type":21,"tag":209,"props":75743,"children":75744},{"class":211,"line":16994},[75745],{"type":21,"tag":209,"props":75746,"children":75747},{"style":360},[75748],{"type":26,"value":75749}," * FILE_READ_PROGRESS: string, FILE_READ_FINISHED: string, FILE_READ_ALL: string,\n",{"type":21,"tag":209,"props":75751,"children":75752},{"class":211,"line":17003},[75753],{"type":21,"tag":209,"props":75754,"children":75755},{"style":360},[75756],{"type":26,"value":75757}," * FILE_UPLOAD_ERROR: string, FILE_UPLOAD_PROGRESS: string, FILE_UPLOAD_PAUSE: string,\n",{"type":21,"tag":209,"props":75759,"children":75760},{"class":211,"line":17011},[75761],{"type":21,"tag":209,"props":75762,"children":75763},{"style":360},[75764],{"type":26,"value":75765}," * FILE_UPLOAD_RESUME: string, FILE_UPLOAD_FINISHED: string, FILE_UPLOAD_ALL: string}}\n",{"type":21,"tag":209,"props":75767,"children":75768},{"class":211,"line":17020},[75769],{"type":21,"tag":209,"props":75770,"children":75771},{"style":448},[75772],{"type":26,"value":755},{"type":21,"tag":209,"props":75774,"children":75775},{"class":211,"line":17028},[75776,75781,75785],{"type":21,"tag":209,"props":75777,"children":75778},{"style":222},[75779],{"type":26,"value":75780},"Hup.state ",{"type":21,"tag":209,"props":75782,"children":75783},{"style":216},[75784],{"type":26,"value":1432},{"type":21,"tag":209,"props":75786,"children":75787},{"style":222},[75788],{"type":26,"value":276},{"type":21,"tag":209,"props":75790,"children":75791},{"class":211,"line":17061},[75792,75797,75802],{"type":21,"tag":209,"props":75793,"children":75794},{"style":222},[75795],{"type":26,"value":75796},"    FILE_LIST_ERROR:",{"type":21,"tag":209,"props":75798,"children":75799},{"style":233},[75800],{"type":26,"value":75801},"'fileListError'",{"type":21,"tag":209,"props":75803,"children":75804},{"style":222},[75805],{"type":26,"value":304},{"type":21,"tag":209,"props":75807,"children":75808},{"class":211,"line":17069},[75809,75814,75819],{"type":21,"tag":209,"props":75810,"children":75811},{"style":222},[75812],{"type":26,"value":75813},"    FILE_LIST_LOADED:",{"type":21,"tag":209,"props":75815,"children":75816},{"style":233},[75817],{"type":26,"value":75818},"'fileListLoaded'",{"type":21,"tag":209,"props":75820,"children":75821},{"style":222},[75822],{"type":26,"value":304},{"type":21,"tag":209,"props":75824,"children":75825},{"class":211,"line":17108},[75826,75831,75836],{"type":21,"tag":209,"props":75827,"children":75828},{"style":222},[75829],{"type":26,"value":75830},"    FILE_READ_ERROR:",{"type":21,"tag":209,"props":75832,"children":75833},{"style":233},[75834],{"type":26,"value":75835},"'fileReadError'",{"type":21,"tag":209,"props":75837,"children":75838},{"style":222},[75839],{"type":26,"value":304},{"type":21,"tag":209,"props":75841,"children":75842},{"class":211,"line":17116},[75843,75848,75853],{"type":21,"tag":209,"props":75844,"children":75845},{"style":222},[75846],{"type":26,"value":75847},"    FILE_READ_PROGRESS:",{"type":21,"tag":209,"props":75849,"children":75850},{"style":233},[75851],{"type":26,"value":75852},"'fileReadProgress'",{"type":21,"tag":209,"props":75854,"children":75855},{"style":222},[75856],{"type":26,"value":304},{"type":21,"tag":209,"props":75858,"children":75859},{"class":211,"line":17170},[75860,75865,75870],{"type":21,"tag":209,"props":75861,"children":75862},{"style":222},[75863],{"type":26,"value":75864},"    FILE_READ_FINISHED:",{"type":21,"tag":209,"props":75866,"children":75867},{"style":233},[75868],{"type":26,"value":75869},"'fileReadFinished'",{"type":21,"tag":209,"props":75871,"children":75872},{"style":222},[75873],{"type":26,"value":304},{"type":21,"tag":209,"props":75875,"children":75876},{"class":211,"line":17182},[75877,75882,75887],{"type":21,"tag":209,"props":75878,"children":75879},{"style":222},[75880],{"type":26,"value":75881},"    FILE_READ_ALL:",{"type":21,"tag":209,"props":75883,"children":75884},{"style":233},[75885],{"type":26,"value":75886},"'fileReadAll'",{"type":21,"tag":209,"props":75888,"children":75889},{"style":222},[75890],{"type":26,"value":304},{"type":21,"tag":209,"props":75892,"children":75893},{"class":211,"line":17204},[75894,75899,75904],{"type":21,"tag":209,"props":75895,"children":75896},{"style":222},[75897],{"type":26,"value":75898},"    FILE_UPLOAD_ERROR:",{"type":21,"tag":209,"props":75900,"children":75901},{"style":233},[75902],{"type":26,"value":75903},"'fileUploadError'",{"type":21,"tag":209,"props":75905,"children":75906},{"style":222},[75907],{"type":26,"value":304},{"type":21,"tag":209,"props":75909,"children":75910},{"class":211,"line":17212},[75911,75916,75921],{"type":21,"tag":209,"props":75912,"children":75913},{"style":222},[75914],{"type":26,"value":75915},"    FILE_UPLOAD_PROGRESS:",{"type":21,"tag":209,"props":75917,"children":75918},{"style":233},[75919],{"type":26,"value":75920},"'fileUploadProgress'",{"type":21,"tag":209,"props":75922,"children":75923},{"style":222},[75924],{"type":26,"value":304},{"type":21,"tag":209,"props":75926,"children":75927},{"class":211,"line":17220},[75928,75933,75938],{"type":21,"tag":209,"props":75929,"children":75930},{"style":222},[75931],{"type":26,"value":75932},"    FILE_UPLOAD_PAUSE:",{"type":21,"tag":209,"props":75934,"children":75935},{"style":233},[75936],{"type":26,"value":75937},"'fileUploadPause'",{"type":21,"tag":209,"props":75939,"children":75940},{"style":222},[75941],{"type":26,"value":304},{"type":21,"tag":209,"props":75943,"children":75944},{"class":211,"line":17259},[75945,75950,75955],{"type":21,"tag":209,"props":75946,"children":75947},{"style":222},[75948],{"type":26,"value":75949},"    FILE_UPLOAD_RESUME:",{"type":21,"tag":209,"props":75951,"children":75952},{"style":233},[75953],{"type":26,"value":75954},"'fileUploadResume'",{"type":21,"tag":209,"props":75956,"children":75957},{"style":222},[75958],{"type":26,"value":304},{"type":21,"tag":209,"props":75960,"children":75961},{"class":211,"line":17271},[75962,75967,75972],{"type":21,"tag":209,"props":75963,"children":75964},{"style":222},[75965],{"type":26,"value":75966},"    FILE_UPLOAD_FINISHED:",{"type":21,"tag":209,"props":75968,"children":75969},{"style":233},[75970],{"type":26,"value":75971},"'fileUploadFinished'",{"type":21,"tag":209,"props":75973,"children":75974},{"style":222},[75975],{"type":26,"value":304},{"type":21,"tag":209,"props":75977,"children":75978},{"class":211,"line":17279},[75979,75984],{"type":21,"tag":209,"props":75980,"children":75981},{"style":222},[75982],{"type":26,"value":75983},"    FILE_UPLOAD_ALL:",{"type":21,"tag":209,"props":75985,"children":75986},{"style":233},[75987],{"type":26,"value":75988},"'fileUploadAll'\n",{"type":21,"tag":209,"props":75990,"children":75991},{"class":211,"line":17287},[75992],{"type":21,"tag":209,"props":75993,"children":75994},{"style":222},[75995],{"type":26,"value":340},{"type":21,"tag":209,"props":75997,"children":75998},{"class":211,"line":17312},[75999],{"type":21,"tag":209,"props":76000,"children":76001},{"emptyLinePlaceholder":248},[76002],{"type":26,"value":251},{"type":21,"tag":209,"props":76004,"children":76005},{"class":211,"line":17320},[76006],{"type":21,"tag":209,"props":76007,"children":76008},{"style":448},[76009],{"type":26,"value":731},{"type":21,"tag":209,"props":76011,"children":76012},{"class":211,"line":17341},[76013],{"type":21,"tag":209,"props":76014,"children":76015},{"style":448},[76016],{"type":26,"value":76017}," * Deferred wrapper for xhr upload.\n",{"type":21,"tag":209,"props":76019,"children":76020},{"class":211,"line":17350},[76021,76025,76029],{"type":21,"tag":209,"props":76022,"children":76023},{"style":448},[76024],{"type":26,"value":11233},{"type":21,"tag":209,"props":76026,"children":76027},{"style":216},[76028],{"type":26,"value":4718},{"type":21,"tag":209,"props":76030,"children":76031},{"style":222},[76032],{"type":26,"value":71126},{"type":21,"tag":209,"props":76034,"children":76035},{"class":211,"line":17359},[76036,76040,76044],{"type":21,"tag":209,"props":76037,"children":76038},{"style":448},[76039],{"type":26,"value":11233},{"type":21,"tag":209,"props":76041,"children":76042},{"style":216},[76043],{"type":26,"value":4718},{"type":21,"tag":209,"props":76045,"children":76046},{"style":222},[76047],{"type":26,"value":71142},{"type":21,"tag":209,"props":76049,"children":76050},{"class":211,"line":17404},[76051,76055,76059,76063],{"type":21,"tag":209,"props":76052,"children":76053},{"style":448},[76054],{"type":26,"value":11233},{"type":21,"tag":209,"props":76056,"children":76057},{"style":216},[76058],{"type":26,"value":4740},{"type":21,"tag":209,"props":76060,"children":76061},{"style":360},[76062],{"type":26,"value":67802},{"type":21,"tag":209,"props":76064,"children":76065},{"style":448},[76066],{"type":26,"value":71162},{"type":21,"tag":209,"props":76068,"children":76069},{"class":211,"line":17412},[76070,76074],{"type":21,"tag":209,"props":76071,"children":76072},{"style":448},[76073],{"type":26,"value":11233},{"type":21,"tag":209,"props":76075,"children":76076},{"style":216},[76077],{"type":26,"value":46286},{"type":21,"tag":209,"props":76079,"children":76080},{"class":211,"line":17420},[76081],{"type":21,"tag":209,"props":76082,"children":76083},{"style":448},[76084],{"type":26,"value":755},{"type":21,"tag":209,"props":76086,"children":76087},{"class":211,"line":17429},[76088,76092,76096,76100,76104,76108,76112],{"type":21,"tag":209,"props":76089,"children":76090},{"style":216},[76091],{"type":26,"value":5370},{"type":21,"tag":209,"props":76093,"children":76094},{"style":360},[76095],{"type":26,"value":57995},{"type":21,"tag":209,"props":76097,"children":76098},{"style":222},[76099],{"type":26,"value":368},{"type":21,"tag":209,"props":76101,"children":76102},{"style":400},[76103],{"type":26,"value":29825},{"type":21,"tag":209,"props":76105,"children":76106},{"style":222},[76107],{"type":26,"value":408},{"type":21,"tag":209,"props":76109,"children":76110},{"style":400},[76111],{"type":26,"value":19799},{"type":21,"tag":209,"props":76113,"children":76114},{"style":222},[76115],{"type":26,"value":2369},{"type":21,"tag":209,"props":76117,"children":76118},{"class":211,"line":17438},[76119,76123,76127,76131,76135],{"type":21,"tag":209,"props":76120,"children":76121},{"style":216},[76122],{"type":26,"value":10405},{"type":21,"tag":209,"props":76124,"children":76125},{"style":222},[76126],{"type":26,"value":57248},{"type":21,"tag":209,"props":76128,"children":76129},{"style":216},[76130],{"type":26,"value":1432},{"type":21,"tag":209,"props":76132,"children":76133},{"style":263},[76134],{"type":26,"value":17698},{"type":21,"tag":209,"props":76136,"children":76137},{"style":222},[76138],{"type":26,"value":241},{"type":21,"tag":209,"props":76140,"children":76141},{"class":211,"line":17486},[76142],{"type":21,"tag":209,"props":76143,"children":76144},{"emptyLinePlaceholder":248},[76145],{"type":26,"value":251},{"type":21,"tag":209,"props":76147,"children":76148},{"class":211,"line":17503},[76149,76153,76157,76161,76165,76169],{"type":21,"tag":209,"props":76150,"children":76151},{"style":263},[76152],{"type":26,"value":51112},{"type":21,"tag":209,"props":76154,"children":76155},{"style":222},[76156],{"type":26,"value":71253},{"type":21,"tag":209,"props":76158,"children":76159},{"style":216},[76160],{"type":26,"value":1432},{"type":21,"tag":209,"props":76162,"children":76163},{"style":222},[76164],{"type":26,"value":26905},{"type":21,"tag":209,"props":76166,"children":76167},{"style":360},[76168],{"type":26,"value":26910},{"type":21,"tag":209,"props":76170,"children":76171},{"style":222},[76172],{"type":26,"value":4842},{"type":21,"tag":209,"props":76174,"children":76175},{"class":211,"line":17511},[76176,76180,76184,76188],{"type":21,"tag":209,"props":76177,"children":76178},{"style":263},[76179],{"type":26,"value":51112},{"type":21,"tag":209,"props":76181,"children":76182},{"style":222},[76183],{"type":26,"value":71281},{"type":21,"tag":209,"props":76185,"children":76186},{"style":216},[76187],{"type":26,"value":1432},{"type":21,"tag":209,"props":76189,"children":76190},{"style":222},[76191],{"type":26,"value":71290},{"type":21,"tag":209,"props":76193,"children":76194},{"class":211,"line":29262},[76195,76199,76203,76207],{"type":21,"tag":209,"props":76196,"children":76197},{"style":263},[76198],{"type":26,"value":51112},{"type":21,"tag":209,"props":76200,"children":76201},{"style":222},[76202],{"type":26,"value":71302},{"type":21,"tag":209,"props":76204,"children":76205},{"style":216},[76206],{"type":26,"value":1432},{"type":21,"tag":209,"props":76208,"children":76209},{"style":222},[76210],{"type":26,"value":71311},{"type":21,"tag":209,"props":76212,"children":76213},{"class":211,"line":29270},[76214,76218,76222,76226,76230],{"type":21,"tag":209,"props":76215,"children":76216},{"style":263},[76217],{"type":26,"value":51112},{"type":21,"tag":209,"props":76219,"children":76220},{"style":222},[76221],{"type":26,"value":71323},{"type":21,"tag":209,"props":76223,"children":76224},{"style":216},[76225],{"type":26,"value":1432},{"type":21,"tag":209,"props":76227,"children":76228},{"style":263},[76229],{"type":26,"value":5455},{"type":21,"tag":209,"props":76231,"children":76232},{"style":222},[76233],{"type":26,"value":241},{"type":21,"tag":209,"props":76235,"children":76236},{"class":211,"line":29278},[76237,76241,76245,76249,76253],{"type":21,"tag":209,"props":76238,"children":76239},{"style":263},[76240],{"type":26,"value":51112},{"type":21,"tag":209,"props":76242,"children":76243},{"style":222},[76244],{"type":26,"value":61248},{"type":21,"tag":209,"props":76246,"children":76247},{"style":216},[76248],{"type":26,"value":1432},{"type":21,"tag":209,"props":76250,"children":76251},{"style":263},[76252],{"type":26,"value":17197},{"type":21,"tag":209,"props":76254,"children":76255},{"style":222},[76256],{"type":26,"value":241},{"type":21,"tag":209,"props":76258,"children":76259},{"class":211,"line":29287},[76260,76264,76269,76273,76278,76282,76287,76291,76296,76300,76305],{"type":21,"tag":209,"props":76261,"children":76262},{"style":263},[76263],{"type":26,"value":51112},{"type":21,"tag":209,"props":76265,"children":76266},{"style":222},[76267],{"type":26,"value":76268},".time ",{"type":21,"tag":209,"props":76270,"children":76271},{"style":216},[76272],{"type":26,"value":1432},{"type":21,"tag":209,"props":76274,"children":76275},{"style":222},[76276],{"type":26,"value":76277}," {start:",{"type":21,"tag":209,"props":76279,"children":76280},{"style":263},[76281],{"type":26,"value":6048},{"type":21,"tag":209,"props":76283,"children":76284},{"style":222},[76285],{"type":26,"value":76286},", end:",{"type":21,"tag":209,"props":76288,"children":76289},{"style":263},[76290],{"type":26,"value":6048},{"type":21,"tag":209,"props":76292,"children":76293},{"style":222},[76294],{"type":26,"value":76295},", speed:",{"type":21,"tag":209,"props":76297,"children":76298},{"style":263},[76299],{"type":26,"value":6048},{"type":21,"tag":209,"props":76301,"children":76302},{"style":222},[76303],{"type":26,"value":76304},"}; ",{"type":21,"tag":209,"props":76306,"children":76307},{"style":448},[76308],{"type":26,"value":76309},"// Speed is measured in bytes per second\n",{"type":21,"tag":209,"props":76311,"children":76312},{"class":211,"line":29307},[76313,76317,76321,76325,76329,76333],{"type":21,"tag":209,"props":76314,"children":76315},{"style":263},[76316],{"type":26,"value":51112},{"type":21,"tag":209,"props":76318,"children":76319},{"style":222},[76320],{"type":26,"value":71370},{"type":21,"tag":209,"props":76322,"children":76323},{"style":216},[76324],{"type":26,"value":1432},{"type":21,"tag":209,"props":76326,"children":76327},{"style":216},[76328],{"type":26,"value":4667},{"type":21,"tag":209,"props":76330,"children":76331},{"style":360},[76332],{"type":26,"value":17634},{"type":21,"tag":209,"props":76334,"children":76335},{"style":222},[76336],{"type":26,"value":4842},{"type":21,"tag":209,"props":76338,"children":76339},{"class":211,"line":29315},[76340],{"type":21,"tag":209,"props":76341,"children":76342},{"emptyLinePlaceholder":248},[76343],{"type":26,"value":251},{"type":21,"tag":209,"props":76345,"children":76346},{"class":211,"line":29323},[76347,76351,76355,76359],{"type":21,"tag":209,"props":76348,"children":76349},{"style":216},[76350],{"type":26,"value":10853},{"type":21,"tag":209,"props":76352,"children":76353},{"style":222},[76354],{"type":26,"value":4776},{"type":21,"tag":209,"props":76356,"children":76357},{"style":263},[76358],{"type":26,"value":2508},{"type":21,"tag":209,"props":76360,"children":76361},{"style":222},[76362],{"type":26,"value":61286},{"type":21,"tag":209,"props":76364,"children":76365},{"class":211,"line":29344},[76366],{"type":21,"tag":209,"props":76367,"children":76368},{"style":222},[76369],{"type":26,"value":37029},{"type":21,"tag":209,"props":76371,"children":76372},{"class":211,"line":29372},[76373,76377,76381,76385,76389],{"type":21,"tag":209,"props":76374,"children":76375},{"style":263},[76376],{"type":26,"value":51473},{"type":21,"tag":209,"props":76378,"children":76379},{"style":222},[76380],{"type":26,"value":71431},{"type":21,"tag":209,"props":76382,"children":76383},{"style":216},[76384],{"type":26,"value":1432},{"type":21,"tag":209,"props":76386,"children":76387},{"style":263},[76388],{"type":26,"value":17197},{"type":21,"tag":209,"props":76390,"children":76391},{"style":222},[76392],{"type":26,"value":241},{"type":21,"tag":209,"props":76394,"children":76395},{"class":211,"line":29405},[76396,76400,76404,76408,76412,76416,76420,76424,76428,76432,76436,76440,76444],{"type":21,"tag":209,"props":76397,"children":76398},{"style":263},[76399],{"type":26,"value":51473},{"type":21,"tag":209,"props":76401,"children":76402},{"style":222},[76403],{"type":26,"value":71455},{"type":21,"tag":209,"props":76405,"children":76406},{"style":216},[76407],{"type":26,"value":1432},{"type":21,"tag":209,"props":76409,"children":76410},{"style":222},[76411],{"type":26,"value":71464},{"type":21,"tag":209,"props":76413,"children":76414},{"style":360},[76415],{"type":26,"value":71469},{"type":21,"tag":209,"props":76417,"children":76418},{"style":222},[76419],{"type":26,"value":368},{"type":21,"tag":209,"props":76421,"children":76422},{"style":263},[76423],{"type":26,"value":2508},{"type":21,"tag":209,"props":76425,"children":76426},{"style":222},[76427],{"type":26,"value":71482},{"type":21,"tag":209,"props":76429,"children":76430},{"style":216},[76431],{"type":26,"value":10237},{"type":21,"tag":209,"props":76433,"children":76434},{"style":263},[76435],{"type":26,"value":2508},{"type":21,"tag":209,"props":76437,"children":76438},{"style":222},[76439],{"type":26,"value":71495},{"type":21,"tag":209,"props":76441,"children":76442},{"style":263},[76443],{"type":26,"value":2508},{"type":21,"tag":209,"props":76445,"children":76446},{"style":222},[76447],{"type":26,"value":61336},{"type":21,"tag":209,"props":76449,"children":76450},{"class":211,"line":29413},[76451],{"type":21,"tag":209,"props":76452,"children":76453},{"style":222},[76454],{"type":26,"value":331},{"type":21,"tag":209,"props":76456,"children":76457},{"class":211,"line":29438},[76458],{"type":21,"tag":209,"props":76459,"children":76460},{"emptyLinePlaceholder":248},[76461],{"type":26,"value":251},{"type":21,"tag":209,"props":76463,"children":76464},{"class":211,"line":29446},[76465,76469,76473,76477,76481,76485,76489,76493,76497,76501,76505,76509],{"type":21,"tag":209,"props":76466,"children":76467},{"style":263},[76468],{"type":26,"value":51112},{"type":21,"tag":209,"props":76470,"children":76471},{"style":222},[76472],{"type":26,"value":71529},{"type":21,"tag":209,"props":76474,"children":76475},{"style":360},[76476],{"type":26,"value":6424},{"type":21,"tag":209,"props":76478,"children":76479},{"style":222},[76480],{"type":26,"value":368},{"type":21,"tag":209,"props":76482,"children":76483},{"style":233},[76484],{"type":26,"value":11055},{"type":21,"tag":209,"props":76486,"children":76487},{"style":222},[76488],{"type":26,"value":408},{"type":21,"tag":209,"props":76490,"children":76491},{"style":216},[76492],{"type":26,"value":5370},{"type":21,"tag":209,"props":76494,"children":76495},{"style":222},[76496],{"type":26,"value":71554},{"type":21,"tag":209,"props":76498,"children":76499},{"style":360},[76500],{"type":26,"value":71559},{"type":21,"tag":209,"props":76502,"children":76503},{"style":222},[76504],{"type":26,"value":71564},{"type":21,"tag":209,"props":76506,"children":76507},{"style":263},[76508],{"type":26,"value":27598},{"type":21,"tag":209,"props":76510,"children":76511},{"style":222},[76512],{"type":26,"value":2608},{"type":21,"tag":209,"props":76514,"children":76515},{"class":211,"line":29478},[76516,76520,76524,76528,76532,76536,76540,76544,76548,76552,76556,76560,76564,76568],{"type":21,"tag":209,"props":76517,"children":76518},{"style":263},[76519],{"type":26,"value":51112},{"type":21,"tag":209,"props":76521,"children":76522},{"style":222},[76523],{"type":26,"value":71584},{"type":21,"tag":209,"props":76525,"children":76526},{"style":360},[76527],{"type":26,"value":6424},{"type":21,"tag":209,"props":76529,"children":76530},{"style":222},[76531],{"type":26,"value":368},{"type":21,"tag":209,"props":76533,"children":76534},{"style":233},[76535],{"type":26,"value":71597},{"type":21,"tag":209,"props":76537,"children":76538},{"style":222},[76539],{"type":26,"value":408},{"type":21,"tag":209,"props":76541,"children":76542},{"style":216},[76543],{"type":26,"value":5370},{"type":21,"tag":209,"props":76545,"children":76546},{"style":222},[76547],{"type":26,"value":368},{"type":21,"tag":209,"props":76549,"children":76550},{"style":400},[76551],{"type":26,"value":10794},{"type":21,"tag":209,"props":76553,"children":76554},{"style":222},[76555],{"type":26,"value":67521},{"type":21,"tag":209,"props":76557,"children":76558},{"style":360},[76559],{"type":26,"value":61197},{"type":21,"tag":209,"props":76561,"children":76562},{"style":222},[76563],{"type":26,"value":71626},{"type":21,"tag":209,"props":76565,"children":76566},{"style":263},[76567],{"type":26,"value":27598},{"type":21,"tag":209,"props":76569,"children":76570},{"style":222},[76571],{"type":26,"value":2608},{"type":21,"tag":209,"props":76573,"children":76574},{"class":211,"line":29494},[76575,76579,76583,76587,76591,76595,76599,76603,76607,76611,76615,76619,76623,76627],{"type":21,"tag":209,"props":76576,"children":76577},{"style":263},[76578],{"type":26,"value":51112},{"type":21,"tag":209,"props":76580,"children":76581},{"style":222},[76582],{"type":26,"value":71584},{"type":21,"tag":209,"props":76584,"children":76585},{"style":360},[76586],{"type":26,"value":6424},{"type":21,"tag":209,"props":76588,"children":76589},{"style":222},[76590],{"type":26,"value":368},{"type":21,"tag":209,"props":76592,"children":76593},{"style":233},[76594],{"type":26,"value":17784},{"type":21,"tag":209,"props":76596,"children":76597},{"style":222},[76598],{"type":26,"value":408},{"type":21,"tag":209,"props":76600,"children":76601},{"style":216},[76602],{"type":26,"value":5370},{"type":21,"tag":209,"props":76604,"children":76605},{"style":222},[76606],{"type":26,"value":368},{"type":21,"tag":209,"props":76608,"children":76609},{"style":400},[76610],{"type":26,"value":10794},{"type":21,"tag":209,"props":76612,"children":76613},{"style":222},[76614],{"type":26,"value":67521},{"type":21,"tag":209,"props":76616,"children":76617},{"style":360},[76618],{"type":26,"value":71682},{"type":21,"tag":209,"props":76620,"children":76621},{"style":222},[76622],{"type":26,"value":71626},{"type":21,"tag":209,"props":76624,"children":76625},{"style":263},[76626],{"type":26,"value":27598},{"type":21,"tag":209,"props":76628,"children":76629},{"style":222},[76630],{"type":26,"value":2608},{"type":21,"tag":209,"props":76632,"children":76633},{"class":211,"line":29510},[76634],{"type":21,"tag":209,"props":76635,"children":76636},{"emptyLinePlaceholder":248},[76637],{"type":26,"value":251},{"type":21,"tag":209,"props":76639,"children":76640},{"class":211,"line":29518},[76641,76645,76649,76653],{"type":21,"tag":209,"props":76642,"children":76643},{"style":263},[76644],{"type":26,"value":51112},{"type":21,"tag":209,"props":76646,"children":76647},{"style":222},[76648],{"type":26,"value":378},{"type":21,"tag":209,"props":76650,"children":76651},{"style":360},[76652],{"type":26,"value":32649},{"type":21,"tag":209,"props":76654,"children":76655},{"style":222},[76656],{"type":26,"value":4842},{"type":21,"tag":209,"props":76658,"children":76659},{"class":211,"line":29526},[76660],{"type":21,"tag":209,"props":76661,"children":76662},{"emptyLinePlaceholder":248},[76663],{"type":26,"value":251},{"type":21,"tag":209,"props":76665,"children":76666},{"class":211,"line":29550},[76667,76671,76675,76679,76683],{"type":21,"tag":209,"props":76668,"children":76669},{"style":216},[76670],{"type":26,"value":1298},{"type":21,"tag":209,"props":76672,"children":76673},{"style":263},[76674],{"type":26,"value":17698},{"type":21,"tag":209,"props":76676,"children":76677},{"style":222},[76678],{"type":26,"value":61531},{"type":21,"tag":209,"props":76680,"children":76681},{"style":360},[76682],{"type":26,"value":27809},{"type":21,"tag":209,"props":76684,"children":76685},{"style":222},[76686],{"type":26,"value":4842},{"type":21,"tag":209,"props":76688,"children":76689},{"class":211,"line":29574},[76690],{"type":21,"tag":209,"props":76691,"children":76692},{"style":222},[76693],{"type":26,"value":7798},{"type":21,"tag":209,"props":76695,"children":76696},{"class":211,"line":29591},[76697],{"type":21,"tag":209,"props":76698,"children":76699},{"emptyLinePlaceholder":248},[76700],{"type":26,"value":251},{"type":21,"tag":209,"props":76702,"children":76703},{"class":211,"line":29600},[76704],{"type":21,"tag":209,"props":76705,"children":76706},{"style":448},[76707],{"type":26,"value":731},{"type":21,"tag":209,"props":76709,"children":76710},{"class":211,"line":29608},[76711],{"type":21,"tag":209,"props":76712,"children":76713},{"style":448},[76714],{"type":26,"value":71779},{"type":21,"tag":209,"props":76716,"children":76717},{"class":211,"line":29621},[76718],{"type":21,"tag":209,"props":76719,"children":76720},{"style":448},[76721],{"type":26,"value":755},{"type":21,"tag":209,"props":76723,"children":76724},{"class":211,"line":29629},[76725,76729,76733,76737,76741,76745,76749,76753],{"type":21,"tag":209,"props":76726,"children":76727},{"style":263},[76728],{"type":26,"value":61180},{"type":21,"tag":209,"props":76730,"children":76731},{"style":222},[76732],{"type":26,"value":378},{"type":21,"tag":209,"props":76734,"children":76735},{"style":263},[76736],{"type":26,"value":37016},{"type":21,"tag":209,"props":76738,"children":76739},{"style":222},[76740],{"type":26,"value":378},{"type":21,"tag":209,"props":76742,"children":76743},{"style":360},[76744],{"type":26,"value":32649},{"type":21,"tag":209,"props":76746,"children":76747},{"style":216},[76748],{"type":26,"value":271},{"type":21,"tag":209,"props":76750,"children":76751},{"style":216},[76752],{"type":26,"value":4766},{"type":21,"tag":209,"props":76754,"children":76755},{"style":222},[76756],{"type":26,"value":2561},{"type":21,"tag":209,"props":76758,"children":76759},{"class":211,"line":29637},[76760,76764,76769,76773,76777,76781],{"type":21,"tag":209,"props":76761,"children":76762},{"style":263},[76763],{"type":26,"value":51112},{"type":21,"tag":209,"props":76765,"children":76766},{"style":222},[76767],{"type":26,"value":76768},".time.start ",{"type":21,"tag":209,"props":76770,"children":76771},{"style":216},[76772],{"type":26,"value":1432},{"type":21,"tag":209,"props":76774,"children":76775},{"style":216},[76776],{"type":26,"value":17248},{"type":21,"tag":209,"props":76778,"children":76779},{"style":360},[76780],{"type":26,"value":14388},{"type":21,"tag":209,"props":76782,"children":76783},{"style":222},[76784],{"type":26,"value":4842},{"type":21,"tag":209,"props":76786,"children":76787},{"class":211,"line":29657},[76788],{"type":21,"tag":209,"props":76789,"children":76790},{"emptyLinePlaceholder":248},[76791],{"type":26,"value":251},{"type":21,"tag":209,"props":76793,"children":76794},{"class":211,"line":29665},[76795,76799,76803,76807,76811,76815,76819,76823,76827,76831],{"type":21,"tag":209,"props":76796,"children":76797},{"style":263},[76798],{"type":26,"value":51112},{"type":21,"tag":209,"props":76800,"children":76801},{"style":222},[76802],{"type":26,"value":71529},{"type":21,"tag":209,"props":76804,"children":76805},{"style":360},[76806],{"type":26,"value":11610},{"type":21,"tag":209,"props":76808,"children":76809},{"style":222},[76810],{"type":26,"value":368},{"type":21,"tag":209,"props":76812,"children":76813},{"style":263},[76814],{"type":26,"value":2508},{"type":21,"tag":209,"props":76816,"children":76817},{"style":222},[76818],{"type":26,"value":71856},{"type":21,"tag":209,"props":76820,"children":76821},{"style":263},[76822],{"type":26,"value":2508},{"type":21,"tag":209,"props":76824,"children":76825},{"style":222},[76826],{"type":26,"value":71865},{"type":21,"tag":209,"props":76828,"children":76829},{"style":263},[76830],{"type":26,"value":2508},{"type":21,"tag":209,"props":76832,"children":76833},{"style":222},[76834],{"type":26,"value":71874},{"type":21,"tag":209,"props":76836,"children":76837},{"class":211,"line":29673},[76838,76842,76846,76850,76854,76858,76862,76866],{"type":21,"tag":209,"props":76839,"children":76840},{"style":263},[76841],{"type":26,"value":51112},{"type":21,"tag":209,"props":76843,"children":76844},{"style":222},[76845],{"type":26,"value":71529},{"type":21,"tag":209,"props":76847,"children":76848},{"style":360},[76849],{"type":26,"value":62662},{"type":21,"tag":209,"props":76851,"children":76852},{"style":222},[76853],{"type":26,"value":368},{"type":21,"tag":209,"props":76855,"children":76856},{"style":233},[76857],{"type":26,"value":71898},{"type":21,"tag":209,"props":76859,"children":76860},{"style":222},[76861],{"type":26,"value":408},{"type":21,"tag":209,"props":76863,"children":76864},{"style":233},[76865],{"type":26,"value":25032},{"type":21,"tag":209,"props":76867,"children":76868},{"style":222},[76869],{"type":26,"value":2608},{"type":21,"tag":209,"props":76871,"children":76873},{"class":211,"line":76872},191,[76874,76878,76882,76886,76890,76894,76898,76902],{"type":21,"tag":209,"props":76875,"children":76876},{"style":263},[76877],{"type":26,"value":51112},{"type":21,"tag":209,"props":76879,"children":76880},{"style":222},[76881],{"type":26,"value":71529},{"type":21,"tag":209,"props":76883,"children":76884},{"style":360},[76885],{"type":26,"value":62662},{"type":21,"tag":209,"props":76887,"children":76888},{"style":222},[76889],{"type":26,"value":368},{"type":21,"tag":209,"props":76891,"children":76892},{"style":233},[76893],{"type":26,"value":71934},{"type":21,"tag":209,"props":76895,"children":76896},{"style":222},[76897],{"type":26,"value":408},{"type":21,"tag":209,"props":76899,"children":76900},{"style":263},[76901],{"type":26,"value":2508},{"type":21,"tag":209,"props":76903,"children":76904},{"style":222},[76905],{"type":26,"value":71947},{"type":21,"tag":209,"props":76907,"children":76909},{"class":211,"line":76908},192,[76910,76914,76918,76922,76926,76930,76934,76938],{"type":21,"tag":209,"props":76911,"children":76912},{"style":263},[76913],{"type":26,"value":51112},{"type":21,"tag":209,"props":76915,"children":76916},{"style":222},[76917],{"type":26,"value":71529},{"type":21,"tag":209,"props":76919,"children":76920},{"style":360},[76921],{"type":26,"value":62662},{"type":21,"tag":209,"props":76923,"children":76924},{"style":222},[76925],{"type":26,"value":368},{"type":21,"tag":209,"props":76927,"children":76928},{"style":233},[76929],{"type":26,"value":71971},{"type":21,"tag":209,"props":76931,"children":76932},{"style":222},[76933],{"type":26,"value":408},{"type":21,"tag":209,"props":76935,"children":76936},{"style":263},[76937],{"type":26,"value":2508},{"type":21,"tag":209,"props":76939,"children":76940},{"style":222},[76941],{"type":26,"value":71984},{"type":21,"tag":209,"props":76943,"children":76945},{"class":211,"line":76944},193,[76946],{"type":21,"tag":209,"props":76947,"children":76948},{"emptyLinePlaceholder":248},[76949],{"type":26,"value":251},{"type":21,"tag":209,"props":76951,"children":76953},{"class":211,"line":76952},194,[76954,76958,76962,76966],{"type":21,"tag":209,"props":76955,"children":76956},{"style":216},[76957],{"type":26,"value":10853},{"type":21,"tag":209,"props":76959,"children":76960},{"style":222},[76961],{"type":26,"value":4776},{"type":21,"tag":209,"props":76963,"children":76964},{"style":263},[76965],{"type":26,"value":2508},{"type":21,"tag":209,"props":76967,"children":76968},{"style":222},[76969],{"type":26,"value":61286},{"type":21,"tag":209,"props":76971,"children":76973},{"class":211,"line":76972},195,[76974],{"type":21,"tag":209,"props":76975,"children":76976},{"style":222},[76977],{"type":26,"value":37029},{"type":21,"tag":209,"props":76979,"children":76981},{"class":211,"line":76980},196,[76982,76986,76990,76994,76998,77002],{"type":21,"tag":209,"props":76983,"children":76984},{"style":263},[76985],{"type":26,"value":51473},{"type":21,"tag":209,"props":76987,"children":76988},{"style":222},[76989],{"type":26,"value":71529},{"type":21,"tag":209,"props":76991,"children":76992},{"style":360},[76993],{"type":26,"value":72033},{"type":21,"tag":209,"props":76995,"children":76996},{"style":222},[76997],{"type":26,"value":368},{"type":21,"tag":209,"props":76999,"children":77000},{"style":233},[77001],{"type":26,"value":9083},{"type":21,"tag":209,"props":77003,"children":77004},{"style":222},[77005],{"type":26,"value":2608},{"type":21,"tag":209,"props":77007,"children":77009},{"class":211,"line":77008},197,[77010,77014,77018,77022,77026,77030,77034,77038,77042,77046,77050,77054,77058,77062,77066,77070,77074,77079,77083,77087],{"type":21,"tag":209,"props":77011,"children":77012},{"style":263},[77013],{"type":26,"value":51473},{"type":21,"tag":209,"props":77015,"children":77016},{"style":222},[77017],{"type":26,"value":71529},{"type":21,"tag":209,"props":77019,"children":77020},{"style":360},[77021],{"type":26,"value":62662},{"type":21,"tag":209,"props":77023,"children":77024},{"style":222},[77025],{"type":26,"value":368},{"type":21,"tag":209,"props":77027,"children":77028},{"style":233},[77029],{"type":26,"value":72069},{"type":21,"tag":209,"props":77031,"children":77032},{"style":222},[77033],{"type":26,"value":408},{"type":21,"tag":209,"props":77035,"children":77036},{"style":233},[77037],{"type":26,"value":72078},{"type":21,"tag":209,"props":77039,"children":77040},{"style":216},[77041],{"type":26,"value":10237},{"type":21,"tag":209,"props":77043,"children":77044},{"style":263},[77045],{"type":26,"value":2508},{"type":21,"tag":209,"props":77047,"children":77048},{"style":222},[77049],{"type":26,"value":71482},{"type":21,"tag":209,"props":77051,"children":77052},{"style":216},[77053],{"type":26,"value":10237},{"type":21,"tag":209,"props":77055,"children":77056},{"style":233},[77057],{"type":26,"value":72099},{"type":21,"tag":209,"props":77059,"children":77060},{"style":216},[77061],{"type":26,"value":10237},{"type":21,"tag":209,"props":77063,"children":77064},{"style":263},[77065],{"type":26,"value":2508},{"type":21,"tag":209,"props":77067,"children":77068},{"style":222},[77069],{"type":26,"value":61323},{"type":21,"tag":209,"props":77071,"children":77072},{"style":216},[77073],{"type":26,"value":10237},{"type":21,"tag":209,"props":77075,"children":77076},{"style":233},[77077],{"type":26,"value":77078},"\"/\"",{"type":21,"tag":209,"props":77080,"children":77081},{"style":216},[77082],{"type":26,"value":10237},{"type":21,"tag":209,"props":77084,"children":77085},{"style":263},[77086],{"type":26,"value":2508},{"type":21,"tag":209,"props":77088,"children":77089},{"style":222},[77090],{"type":26,"value":61336},{"type":21,"tag":209,"props":77092,"children":77094},{"class":211,"line":77093},198,[77095,77099,77103,77107,77111,77115,77119,77123,77127,77131,77135,77139],{"type":21,"tag":209,"props":77096,"children":77097},{"style":263},[77098],{"type":26,"value":51473},{"type":21,"tag":209,"props":77100,"children":77101},{"style":222},[77102],{"type":26,"value":71529},{"type":21,"tag":209,"props":77104,"children":77105},{"style":360},[77106],{"type":26,"value":17917},{"type":21,"tag":209,"props":77108,"children":77109},{"style":222},[77110],{"type":26,"value":368},{"type":21,"tag":209,"props":77112,"children":77113},{"style":263},[77114],{"type":26,"value":2508},{"type":21,"tag":209,"props":77116,"children":77117},{"style":222},[77118],{"type":26,"value":72159},{"type":21,"tag":209,"props":77120,"children":77121},{"style":360},[77122],{"type":26,"value":46541},{"type":21,"tag":209,"props":77124,"children":77125},{"style":222},[77126],{"type":26,"value":368},{"type":21,"tag":209,"props":77128,"children":77129},{"style":263},[77130],{"type":26,"value":2508},{"type":21,"tag":209,"props":77132,"children":77133},{"style":222},[77134],{"type":26,"value":72176},{"type":21,"tag":209,"props":77136,"children":77137},{"style":263},[77138],{"type":26,"value":2508},{"type":21,"tag":209,"props":77140,"children":77141},{"style":222},[77142],{"type":26,"value":72185},{"type":21,"tag":209,"props":77144,"children":77146},{"class":211,"line":77145},199,[77147],{"type":21,"tag":209,"props":77148,"children":77149},{"style":222},[77150],{"type":26,"value":331},{"type":21,"tag":209,"props":77152,"children":77154},{"class":211,"line":77153},200,[77155],{"type":21,"tag":209,"props":77156,"children":77157},{"style":216},[77158],{"type":26,"value":72200},{"type":21,"tag":209,"props":77160,"children":77162},{"class":211,"line":77161},201,[77163],{"type":21,"tag":209,"props":77164,"children":77165},{"style":222},[77166],{"type":26,"value":37029},{"type":21,"tag":209,"props":77168,"children":77170},{"class":211,"line":77169},202,[77171,77175,77179,77183,77187,77191,77195,77199,77203],{"type":21,"tag":209,"props":77172,"children":77173},{"style":263},[77174],{"type":26,"value":51473},{"type":21,"tag":209,"props":77176,"children":77177},{"style":222},[77178],{"type":26,"value":71529},{"type":21,"tag":209,"props":77180,"children":77181},{"style":360},[77182],{"type":26,"value":72033},{"type":21,"tag":209,"props":77184,"children":77185},{"style":222},[77186],{"type":26,"value":2709},{"type":21,"tag":209,"props":77188,"children":77189},{"style":263},[77190],{"type":26,"value":2508},{"type":21,"tag":209,"props":77192,"children":77193},{"style":222},[77194],{"type":26,"value":72235},{"type":21,"tag":209,"props":77196,"children":77197},{"style":216},[77198],{"type":26,"value":4677},{"type":21,"tag":209,"props":77200,"children":77201},{"style":233},[77202],{"type":26,"value":72244},{"type":21,"tag":209,"props":77204,"children":77205},{"style":222},[77206],{"type":26,"value":46554},{"type":21,"tag":209,"props":77208,"children":77210},{"class":211,"line":77209},203,[77211,77215,77219,77223,77227,77231],{"type":21,"tag":209,"props":77212,"children":77213},{"style":263},[77214],{"type":26,"value":51473},{"type":21,"tag":209,"props":77216,"children":77217},{"style":222},[77218],{"type":26,"value":71529},{"type":21,"tag":209,"props":77220,"children":77221},{"style":360},[77222],{"type":26,"value":17917},{"type":21,"tag":209,"props":77224,"children":77225},{"style":222},[77226],{"type":26,"value":368},{"type":21,"tag":209,"props":77228,"children":77229},{"style":263},[77230],{"type":26,"value":2508},{"type":21,"tag":209,"props":77232,"children":77233},{"style":222},[77234],{"type":26,"value":72276},{"type":21,"tag":209,"props":77236,"children":77238},{"class":211,"line":77237},204,[77239],{"type":21,"tag":209,"props":77240,"children":77241},{"style":222},[77242],{"type":26,"value":331},{"type":21,"tag":209,"props":77244,"children":77246},{"class":211,"line":77245},205,[77247],{"type":21,"tag":209,"props":77248,"children":77249},{"style":222},[77250],{"type":26,"value":7798},{"type":21,"tag":209,"props":77252,"children":77254},{"class":211,"line":77253},206,[77255],{"type":21,"tag":209,"props":77256,"children":77257},{"emptyLinePlaceholder":248},[77258],{"type":26,"value":251},{"type":21,"tag":209,"props":77260,"children":77262},{"class":211,"line":77261},207,[77263],{"type":21,"tag":209,"props":77264,"children":77265},{"style":448},[77266],{"type":26,"value":731},{"type":21,"tag":209,"props":77268,"children":77270},{"class":211,"line":77269},208,[77271],{"type":21,"tag":209,"props":77272,"children":77273},{"style":448},[77274],{"type":26,"value":77275}," * Report on the upload progress, as a number between 0 and 1, modifying the progress if we're uploading a\n",{"type":21,"tag":209,"props":77277,"children":77279},{"class":211,"line":77278},209,[77280],{"type":21,"tag":209,"props":77281,"children":77282},{"style":448},[77283],{"type":26,"value":77284}," * file in chunks to report on the progress as a percentage of file upload and total chunks uploaded.\n",{"type":21,"tag":209,"props":77286,"children":77288},{"class":211,"line":77287},210,[77289,77293,77297],{"type":21,"tag":209,"props":77290,"children":77291},{"style":448},[77292],{"type":26,"value":11233},{"type":21,"tag":209,"props":77294,"children":77295},{"style":216},[77296],{"type":26,"value":4718},{"type":21,"tag":209,"props":77298,"children":77299},{"style":222},[77300],{"type":26,"value":10766},{"type":21,"tag":209,"props":77302,"children":77304},{"class":211,"line":77303},211,[77305],{"type":21,"tag":209,"props":77306,"children":77307},{"style":448},[77308],{"type":26,"value":755},{"type":21,"tag":209,"props":77310,"children":77312},{"class":211,"line":77311},212,[77313,77317,77321,77325,77329,77333,77337,77341,77345,77349],{"type":21,"tag":209,"props":77314,"children":77315},{"style":263},[77316],{"type":26,"value":61180},{"type":21,"tag":209,"props":77318,"children":77319},{"style":222},[77320],{"type":26,"value":378},{"type":21,"tag":209,"props":77322,"children":77323},{"style":263},[77324],{"type":26,"value":37016},{"type":21,"tag":209,"props":77326,"children":77327},{"style":222},[77328],{"type":26,"value":378},{"type":21,"tag":209,"props":77330,"children":77331},{"style":360},[77332],{"type":26,"value":61197},{"type":21,"tag":209,"props":77334,"children":77335},{"style":216},[77336],{"type":26,"value":271},{"type":21,"tag":209,"props":77338,"children":77339},{"style":216},[77340],{"type":26,"value":4766},{"type":21,"tag":209,"props":77342,"children":77343},{"style":222},[77344],{"type":26,"value":368},{"type":21,"tag":209,"props":77346,"children":77347},{"style":400},[77348],{"type":26,"value":10794},{"type":21,"tag":209,"props":77350,"children":77351},{"style":222},[77352],{"type":26,"value":2369},{"type":21,"tag":209,"props":77354,"children":77356},{"class":211,"line":77355},213,[77357,77361],{"type":21,"tag":209,"props":77358,"children":77359},{"style":216},[77360],{"type":26,"value":10853},{"type":21,"tag":209,"props":77362,"children":77363},{"style":222},[77364],{"type":26,"value":61229},{"type":21,"tag":209,"props":77366,"children":77368},{"class":211,"line":77367},214,[77369],{"type":21,"tag":209,"props":77370,"children":77371},{"style":222},[77372],{"type":26,"value":37029},{"type":21,"tag":209,"props":77374,"children":77376},{"class":211,"line":77375},215,[77377,77381,77385,77389,77393,77397],{"type":21,"tag":209,"props":77378,"children":77379},{"style":263},[77380],{"type":26,"value":51473},{"type":21,"tag":209,"props":77382,"children":77383},{"style":222},[77384],{"type":26,"value":61248},{"type":21,"tag":209,"props":77386,"children":77387},{"style":216},[77388],{"type":26,"value":1432},{"type":21,"tag":209,"props":77390,"children":77391},{"style":222},[77392],{"type":26,"value":61257},{"type":21,"tag":209,"props":77394,"children":77395},{"style":216},[77396],{"type":26,"value":9749},{"type":21,"tag":209,"props":77398,"children":77399},{"style":222},[77400],{"type":26,"value":61266},{"type":21,"tag":209,"props":77402,"children":77404},{"class":211,"line":77403},216,[77405,77409,77413,77417],{"type":21,"tag":209,"props":77406,"children":77407},{"style":216},[77408],{"type":26,"value":5803},{"type":21,"tag":209,"props":77410,"children":77411},{"style":222},[77412],{"type":26,"value":4776},{"type":21,"tag":209,"props":77414,"children":77415},{"style":263},[77416],{"type":26,"value":2508},{"type":21,"tag":209,"props":77418,"children":77419},{"style":222},[77420],{"type":26,"value":61286},{"type":21,"tag":209,"props":77422,"children":77424},{"class":211,"line":77423},217,[77425],{"type":21,"tag":209,"props":77426,"children":77427},{"style":222},[77428],{"type":26,"value":7561},{"type":21,"tag":209,"props":77430,"children":77432},{"class":211,"line":77431},218,[77433,77437,77441,77445,77449,77453,77457,77461,77465],{"type":21,"tag":209,"props":77434,"children":77435},{"style":263},[77436],{"type":26,"value":2570},{"type":21,"tag":209,"props":77438,"children":77439},{"style":222},[77440],{"type":26,"value":61248},{"type":21,"tag":209,"props":77442,"children":77443},{"style":216},[77444],{"type":26,"value":61310},{"type":21,"tag":209,"props":77446,"children":77447},{"style":222},[77448],{"type":26,"value":4776},{"type":21,"tag":209,"props":77450,"children":77451},{"style":263},[77452],{"type":26,"value":2508},{"type":21,"tag":209,"props":77454,"children":77455},{"style":222},[77456],{"type":26,"value":61323},{"type":21,"tag":209,"props":77458,"children":77459},{"style":216},[77460],{"type":26,"value":9749},{"type":21,"tag":209,"props":77462,"children":77463},{"style":263},[77464],{"type":26,"value":2508},{"type":21,"tag":209,"props":77466,"children":77467},{"style":222},[77468],{"type":26,"value":61336},{"type":21,"tag":209,"props":77470,"children":77472},{"class":211,"line":77471},219,[77473],{"type":21,"tag":209,"props":77474,"children":77475},{"style":222},[77476],{"type":26,"value":2235},{"type":21,"tag":209,"props":77478,"children":77480},{"class":211,"line":77479},220,[77481,77485,77489,77493,77497,77501],{"type":21,"tag":209,"props":77482,"children":77483},{"style":263},[77484],{"type":26,"value":51473},{"type":21,"tag":209,"props":77486,"children":77487},{"style":222},[77488],{"type":26,"value":61355},{"type":21,"tag":209,"props":77490,"children":77491},{"style":216},[77492],{"type":26,"value":1432},{"type":21,"tag":209,"props":77494,"children":77495},{"style":216},[77496],{"type":26,"value":17248},{"type":21,"tag":209,"props":77498,"children":77499},{"style":360},[77500],{"type":26,"value":14388},{"type":21,"tag":209,"props":77502,"children":77503},{"style":222},[77504],{"type":26,"value":4842},{"type":21,"tag":209,"props":77506,"children":77508},{"class":211,"line":77507},221,[77509,77513,77517,77521,77525,77529,77533,77537,77541,77545,77549,77553,77557,77561,77565,77569,77573,77577,77581],{"type":21,"tag":209,"props":77510,"children":77511},{"style":263},[77512],{"type":26,"value":51473},{"type":21,"tag":209,"props":77514,"children":77515},{"style":222},[77516],{"type":26,"value":61383},{"type":21,"tag":209,"props":77518,"children":77519},{"style":216},[77520],{"type":26,"value":1432},{"type":21,"tag":209,"props":77522,"children":77523},{"style":222},[77524],{"type":26,"value":4776},{"type":21,"tag":209,"props":77526,"children":77527},{"style":263},[77528],{"type":26,"value":2508},{"type":21,"tag":209,"props":77530,"children":77531},{"style":222},[77532],{"type":26,"value":61400},{"type":21,"tag":209,"props":77534,"children":77535},{"style":216},[77536],{"type":26,"value":944},{"type":21,"tag":209,"props":77538,"children":77539},{"style":263},[77540],{"type":26,"value":2508},{"type":21,"tag":209,"props":77542,"children":77543},{"style":222},[77544],{"type":26,"value":61413},{"type":21,"tag":209,"props":77546,"children":77547},{"style":216},[77548],{"type":26,"value":9749},{"type":21,"tag":209,"props":77550,"children":77551},{"style":222},[77552],{"type":26,"value":368},{"type":21,"tag":209,"props":77554,"children":77555},{"style":263},[77556],{"type":26,"value":2508},{"type":21,"tag":209,"props":77558,"children":77559},{"style":222},[77560],{"type":26,"value":61430},{"type":21,"tag":209,"props":77562,"children":77563},{"style":216},[77564],{"type":26,"value":13012},{"type":21,"tag":209,"props":77566,"children":77567},{"style":263},[77568],{"type":26,"value":2508},{"type":21,"tag":209,"props":77570,"children":77571},{"style":222},[77572],{"type":26,"value":61443},{"type":21,"tag":209,"props":77574,"children":77575},{"style":216},[77576],{"type":26,"value":944},{"type":21,"tag":209,"props":77578,"children":77579},{"style":263},[77580],{"type":26,"value":61452},{"type":21,"tag":209,"props":77582,"children":77583},{"style":222},[77584],{"type":26,"value":241},{"type":21,"tag":209,"props":77586,"children":77588},{"class":211,"line":77587},222,[77589,77593,77597,77601,77605,77609,77613,77617,77621,77625,77629,77633,77637,77641],{"type":21,"tag":209,"props":77590,"children":77591},{"style":222},[77592],{"type":26,"value":3374},{"type":21,"tag":209,"props":77594,"children":77595},{"style":360},[77596],{"type":26,"value":1059},{"type":21,"tag":209,"props":77598,"children":77599},{"style":222},[77600],{"type":26,"value":368},{"type":21,"tag":209,"props":77602,"children":77603},{"style":233},[77604],{"type":26,"value":61476},{"type":21,"tag":209,"props":77606,"children":77607},{"style":222},[77608],{"type":26,"value":408},{"type":21,"tag":209,"props":77610,"children":77611},{"style":263},[77612],{"type":26,"value":2508},{"type":21,"tag":209,"props":77614,"children":77615},{"style":222},[77616],{"type":26,"value":61430},{"type":21,"tag":209,"props":77618,"children":77619},{"style":216},[77620],{"type":26,"value":13012},{"type":21,"tag":209,"props":77622,"children":77623},{"style":263},[77624],{"type":26,"value":2508},{"type":21,"tag":209,"props":77626,"children":77627},{"style":222},[77628],{"type":26,"value":61501},{"type":21,"tag":209,"props":77630,"children":77631},{"style":233},[77632],{"type":26,"value":61506},{"type":21,"tag":209,"props":77634,"children":77635},{"style":222},[77636],{"type":26,"value":408},{"type":21,"tag":209,"props":77638,"children":77639},{"style":263},[77640],{"type":26,"value":2508},{"type":21,"tag":209,"props":77642,"children":77643},{"style":222},[77644],{"type":26,"value":61519},{"type":21,"tag":209,"props":77646,"children":77648},{"class":211,"line":77647},223,[77649,77653,77657,77661,77665,77669,77673,77677,77681,77685],{"type":21,"tag":209,"props":77650,"children":77651},{"style":263},[77652],{"type":26,"value":51473},{"type":21,"tag":209,"props":77654,"children":77655},{"style":222},[77656],{"type":26,"value":61531},{"type":21,"tag":209,"props":77658,"children":77659},{"style":360},[77660],{"type":26,"value":61536},{"type":21,"tag":209,"props":77662,"children":77663},{"style":222},[77664],{"type":26,"value":61541},{"type":21,"tag":209,"props":77666,"children":77667},{"style":263},[77668],{"type":26,"value":61546},{"type":21,"tag":209,"props":77670,"children":77671},{"style":222},[77672],{"type":26,"value":61551},{"type":21,"tag":209,"props":77674,"children":77675},{"style":263},[77676],{"type":26,"value":2508},{"type":21,"tag":209,"props":77678,"children":77679},{"style":222},[77680],{"type":26,"value":61560},{"type":21,"tag":209,"props":77682,"children":77683},{"style":263},[77684],{"type":26,"value":2508},{"type":21,"tag":209,"props":77686,"children":77687},{"style":222},[77688],{"type":26,"value":61569},{"type":21,"tag":209,"props":77690,"children":77692},{"class":211,"line":77691},224,[77693,77698,77702],{"type":21,"tag":209,"props":77694,"children":77695},{"style":222},[77696],{"type":26,"value":77697},"            progress:",{"type":21,"tag":209,"props":77699,"children":77700},{"style":263},[77701],{"type":26,"value":2508},{"type":21,"tag":209,"props":77703,"children":77704},{"style":222},[77705],{"type":26,"value":61586},{"type":21,"tag":209,"props":77707,"children":77709},{"class":211,"line":77708},225,[77710],{"type":21,"tag":209,"props":77711,"children":77712},{"style":222},[77713],{"type":26,"value":331},{"type":21,"tag":209,"props":77715,"children":77717},{"class":211,"line":77716},226,[77718],{"type":21,"tag":209,"props":77719,"children":77720},{"style":222},[77721],{"type":26,"value":340},{"type":21,"tag":209,"props":77723,"children":77725},{"class":211,"line":77724},227,[77726],{"type":21,"tag":209,"props":77727,"children":77728},{"emptyLinePlaceholder":248},[77729],{"type":26,"value":251},{"type":21,"tag":209,"props":77731,"children":77733},{"class":211,"line":77732},228,[77734,77738,77742,77746,77750,77754,77758,77762,77766,77770],{"type":21,"tag":209,"props":77735,"children":77736},{"style":263},[77737],{"type":26,"value":61180},{"type":21,"tag":209,"props":77739,"children":77740},{"style":222},[77741],{"type":26,"value":378},{"type":21,"tag":209,"props":77743,"children":77744},{"style":263},[77745],{"type":26,"value":37016},{"type":21,"tag":209,"props":77747,"children":77748},{"style":222},[77749],{"type":26,"value":378},{"type":21,"tag":209,"props":77751,"children":77752},{"style":360},[77753],{"type":26,"value":71682},{"type":21,"tag":209,"props":77755,"children":77756},{"style":216},[77757],{"type":26,"value":271},{"type":21,"tag":209,"props":77759,"children":77760},{"style":216},[77761],{"type":26,"value":4766},{"type":21,"tag":209,"props":77763,"children":77764},{"style":222},[77765],{"type":26,"value":368},{"type":21,"tag":209,"props":77767,"children":77768},{"style":400},[77769],{"type":26,"value":10794},{"type":21,"tag":209,"props":77771,"children":77772},{"style":222},[77773],{"type":26,"value":2369},{"type":21,"tag":209,"props":77775,"children":77777},{"class":211,"line":77776},229,[77778,77782,77786,77790,77794,77799],{"type":21,"tag":209,"props":77779,"children":77780},{"style":263},[77781],{"type":26,"value":51112},{"type":21,"tag":209,"props":77783,"children":77784},{"style":222},[77785],{"type":26,"value":61531},{"type":21,"tag":209,"props":77787,"children":77788},{"style":360},[77789],{"type":26,"value":5599},{"type":21,"tag":209,"props":77791,"children":77792},{"style":222},[77793],{"type":26,"value":61541},{"type":21,"tag":209,"props":77795,"children":77796},{"style":263},[77797],{"type":26,"value":77798},"FILE_UPLOAD_ERROR",{"type":21,"tag":209,"props":77800,"children":77801},{"style":222},[77802],{"type":26,"value":77803},", error:event});\n",{"type":21,"tag":209,"props":77805,"children":77807},{"class":211,"line":77806},230,[77808],{"type":21,"tag":209,"props":77809,"children":77810},{"style":222},[77811],{"type":26,"value":7798},{"type":21,"tag":209,"props":77813,"children":77815},{"class":211,"line":77814},231,[77816],{"type":21,"tag":209,"props":77817,"children":77818},{"emptyLinePlaceholder":248},[77819],{"type":26,"value":251},{"type":21,"tag":209,"props":77821,"children":77823},{"class":211,"line":77822},232,[77824],{"type":21,"tag":209,"props":77825,"children":77826},{"style":448},[77827],{"type":26,"value":731},{"type":21,"tag":209,"props":77829,"children":77831},{"class":211,"line":77830},233,[77832],{"type":21,"tag":209,"props":77833,"children":77834},{"style":448},[77835],{"type":26,"value":77836}," * Called when we've completed an upload (full file or chunk). If full file, or we've reached the last chunk,\n",{"type":21,"tag":209,"props":77838,"children":77840},{"class":211,"line":77839},234,[77841],{"type":21,"tag":209,"props":77842,"children":77843},{"style":448},[77844],{"type":26,"value":77845}," * the upload is complete. Otherwise, we calculate the next chunk offsets and, if the upload isn't paused,\n",{"type":21,"tag":209,"props":77847,"children":77849},{"class":211,"line":77848},235,[77850],{"type":21,"tag":209,"props":77851,"children":77852},{"style":448},[77853],{"type":26,"value":77854}," * upload it.\n",{"type":21,"tag":209,"props":77856,"children":77858},{"class":211,"line":77857},236,[77859],{"type":21,"tag":209,"props":77860,"children":77861},{"style":448},[77862],{"type":26,"value":755},{"type":21,"tag":209,"props":77864,"children":77866},{"class":211,"line":77865},237,[77867,77871,77875,77879,77883,77887,77891,77895],{"type":21,"tag":209,"props":77868,"children":77869},{"style":263},[77870],{"type":26,"value":61180},{"type":21,"tag":209,"props":77872,"children":77873},{"style":222},[77874],{"type":26,"value":378},{"type":21,"tag":209,"props":77876,"children":77877},{"style":263},[77878],{"type":26,"value":37016},{"type":21,"tag":209,"props":77880,"children":77881},{"style":222},[77882],{"type":26,"value":378},{"type":21,"tag":209,"props":77884,"children":77885},{"style":360},[77886],{"type":26,"value":71559},{"type":21,"tag":209,"props":77888,"children":77889},{"style":216},[77890],{"type":26,"value":271},{"type":21,"tag":209,"props":77892,"children":77893},{"style":216},[77894],{"type":26,"value":4766},{"type":21,"tag":209,"props":77896,"children":77897},{"style":222},[77898],{"type":26,"value":2561},{"type":21,"tag":209,"props":77900,"children":77902},{"class":211,"line":77901},238,[77903,77907,77911,77915,77919,77923],{"type":21,"tag":209,"props":77904,"children":77905},{"style":263},[77906],{"type":26,"value":51112},{"type":21,"tag":209,"props":77908,"children":77909},{"style":222},[77910],{"type":26,"value":61355},{"type":21,"tag":209,"props":77912,"children":77913},{"style":216},[77914],{"type":26,"value":1432},{"type":21,"tag":209,"props":77916,"children":77917},{"style":216},[77918],{"type":26,"value":17248},{"type":21,"tag":209,"props":77920,"children":77921},{"style":360},[77922],{"type":26,"value":14388},{"type":21,"tag":209,"props":77924,"children":77925},{"style":222},[77926],{"type":26,"value":4842},{"type":21,"tag":209,"props":77928,"children":77930},{"class":211,"line":77929},239,[77931,77935,77939,77943,77947,77952,77956,77960,77964,77968,77972],{"type":21,"tag":209,"props":77932,"children":77933},{"style":216},[77934],{"type":26,"value":10853},{"type":21,"tag":209,"props":77936,"children":77937},{"style":222},[77938],{"type":26,"value":4776},{"type":21,"tag":209,"props":77940,"children":77941},{"style":216},[77942],{"type":26,"value":15052},{"type":21,"tag":209,"props":77944,"children":77945},{"style":263},[77946],{"type":26,"value":2508},{"type":21,"tag":209,"props":77948,"children":77949},{"style":222},[77950],{"type":26,"value":77951},".options.chunked ",{"type":21,"tag":209,"props":77953,"children":77954},{"style":216},[77955],{"type":26,"value":4677},{"type":21,"tag":209,"props":77957,"children":77958},{"style":263},[77959],{"type":26,"value":17698},{"type":21,"tag":209,"props":77961,"children":77962},{"style":222},[77963],{"type":26,"value":71455},{"type":21,"tag":209,"props":77965,"children":77966},{"style":216},[77967],{"type":26,"value":12908},{"type":21,"tag":209,"props":77969,"children":77970},{"style":263},[77971],{"type":26,"value":17698},{"type":21,"tag":209,"props":77973,"children":77974},{"style":222},[77975],{"type":26,"value":77976},".file.size)\n",{"type":21,"tag":209,"props":77978,"children":77980},{"class":211,"line":77979},240,[77981],{"type":21,"tag":209,"props":77982,"children":77983},{"style":222},[77984],{"type":26,"value":37029},{"type":21,"tag":209,"props":77986,"children":77988},{"class":211,"line":77987},241,[77989,77993,77997,78002],{"type":21,"tag":209,"props":77990,"children":77991},{"style":263},[77992],{"type":26,"value":51473},{"type":21,"tag":209,"props":77994,"children":77995},{"style":222},[77996],{"type":26,"value":378},{"type":21,"tag":209,"props":77998,"children":77999},{"style":360},[78000],{"type":26,"value":78001},"uploadComplete",{"type":21,"tag":209,"props":78003,"children":78004},{"style":222},[78005],{"type":26,"value":4842},{"type":21,"tag":209,"props":78007,"children":78009},{"class":211,"line":78008},242,[78010,78014],{"type":21,"tag":209,"props":78011,"children":78012},{"style":216},[78013],{"type":26,"value":3069},{"type":21,"tag":209,"props":78015,"children":78016},{"style":222},[78017],{"type":26,"value":241},{"type":21,"tag":209,"props":78019,"children":78021},{"class":211,"line":78020},243,[78022],{"type":21,"tag":209,"props":78023,"children":78024},{"style":222},[78025],{"type":26,"value":331},{"type":21,"tag":209,"props":78027,"children":78029},{"class":211,"line":78028},244,[78030],{"type":21,"tag":209,"props":78031,"children":78032},{"emptyLinePlaceholder":248},[78033],{"type":26,"value":251},{"type":21,"tag":209,"props":78035,"children":78037},{"class":211,"line":78036},245,[78038,78042,78046,78050,78054,78058,78062,78066],{"type":21,"tag":209,"props":78039,"children":78040},{"style":263},[78041],{"type":26,"value":51112},{"type":21,"tag":209,"props":78043,"children":78044},{"style":222},[78045],{"type":26,"value":61531},{"type":21,"tag":209,"props":78047,"children":78048},{"style":360},[78049],{"type":26,"value":61536},{"type":21,"tag":209,"props":78051,"children":78052},{"style":222},[78053],{"type":26,"value":61541},{"type":21,"tag":209,"props":78055,"children":78056},{"style":263},[78057],{"type":26,"value":61546},{"type":21,"tag":209,"props":78059,"children":78060},{"style":222},[78061],{"type":26,"value":61551},{"type":21,"tag":209,"props":78063,"children":78064},{"style":263},[78065],{"type":26,"value":2508},{"type":21,"tag":209,"props":78067,"children":78068},{"style":222},[78069],{"type":26,"value":78070},".file.name,\n",{"type":21,"tag":209,"props":78072,"children":78074},{"class":211,"line":78073},246,[78075,78080,78084,78088,78093,78097,78101,78106,78110],{"type":21,"tag":209,"props":78076,"children":78077},{"style":222},[78078],{"type":26,"value":78079},"        response:",{"type":21,"tag":209,"props":78081,"children":78082},{"style":263},[78083],{"type":26,"value":2508},{"type":21,"tag":209,"props":78085,"children":78086},{"style":222},[78087],{"type":26,"value":378},{"type":21,"tag":209,"props":78089,"children":78090},{"style":360},[78091],{"type":26,"value":78092},"parseResponse",{"type":21,"tag":209,"props":78094,"children":78095},{"style":222},[78096],{"type":26,"value":368},{"type":21,"tag":209,"props":78098,"children":78099},{"style":263},[78100],{"type":26,"value":2508},{"type":21,"tag":209,"props":78102,"children":78103},{"style":222},[78104],{"type":26,"value":78105},".xhr.responseText), progress:",{"type":21,"tag":209,"props":78107,"children":78108},{"style":263},[78109],{"type":26,"value":2508},{"type":21,"tag":209,"props":78111,"children":78112},{"style":222},[78113],{"type":26,"value":61586},{"type":21,"tag":209,"props":78115,"children":78117},{"class":211,"line":78116},247,[78118],{"type":21,"tag":209,"props":78119,"children":78120},{"emptyLinePlaceholder":248},[78121],{"type":26,"value":251},{"type":21,"tag":209,"props":78123,"children":78125},{"class":211,"line":78124},248,[78126,78130,78134,78138,78142],{"type":21,"tag":209,"props":78127,"children":78128},{"style":263},[78129],{"type":26,"value":51112},{"type":21,"tag":209,"props":78131,"children":78132},{"style":222},[78133],{"type":26,"value":71431},{"type":21,"tag":209,"props":78135,"children":78136},{"style":216},[78137],{"type":26,"value":1432},{"type":21,"tag":209,"props":78139,"children":78140},{"style":263},[78141],{"type":26,"value":17698},{"type":21,"tag":209,"props":78143,"children":78144},{"style":222},[78145],{"type":26,"value":78146},".end;\n",{"type":21,"tag":209,"props":78148,"children":78150},{"class":211,"line":78149},249,[78151,78155,78159,78163,78167,78171,78175,78179,78183,78187,78191,78195,78199],{"type":21,"tag":209,"props":78152,"children":78153},{"style":263},[78154],{"type":26,"value":51112},{"type":21,"tag":209,"props":78156,"children":78157},{"style":222},[78158],{"type":26,"value":71455},{"type":21,"tag":209,"props":78160,"children":78161},{"style":216},[78162],{"type":26,"value":1432},{"type":21,"tag":209,"props":78164,"children":78165},{"style":222},[78166],{"type":26,"value":71464},{"type":21,"tag":209,"props":78168,"children":78169},{"style":360},[78170],{"type":26,"value":71469},{"type":21,"tag":209,"props":78172,"children":78173},{"style":222},[78174],{"type":26,"value":368},{"type":21,"tag":209,"props":78176,"children":78177},{"style":263},[78178],{"type":26,"value":2508},{"type":21,"tag":209,"props":78180,"children":78181},{"style":222},[78182],{"type":26,"value":71482},{"type":21,"tag":209,"props":78184,"children":78185},{"style":216},[78186],{"type":26,"value":10237},{"type":21,"tag":209,"props":78188,"children":78189},{"style":263},[78190],{"type":26,"value":2508},{"type":21,"tag":209,"props":78192,"children":78193},{"style":222},[78194],{"type":26,"value":71495},{"type":21,"tag":209,"props":78196,"children":78197},{"style":263},[78198],{"type":26,"value":2508},{"type":21,"tag":209,"props":78200,"children":78201},{"style":222},[78202],{"type":26,"value":61336},{"type":21,"tag":209,"props":78204,"children":78206},{"class":211,"line":78205},250,[78207],{"type":21,"tag":209,"props":78208,"children":78209},{"emptyLinePlaceholder":248},[78210],{"type":26,"value":251},{"type":21,"tag":209,"props":78212,"children":78214},{"class":211,"line":78213},251,[78215,78219,78223,78227,78231],{"type":21,"tag":209,"props":78216,"children":78217},{"style":216},[78218],{"type":26,"value":10853},{"type":21,"tag":209,"props":78220,"children":78221},{"style":222},[78222],{"type":26,"value":4776},{"type":21,"tag":209,"props":78224,"children":78225},{"style":216},[78226],{"type":26,"value":15052},{"type":21,"tag":209,"props":78228,"children":78229},{"style":263},[78230],{"type":26,"value":2508},{"type":21,"tag":209,"props":78232,"children":78233},{"style":222},[78234],{"type":26,"value":78235},".paused)\n",{"type":21,"tag":209,"props":78237,"children":78239},{"class":211,"line":78238},252,[78240],{"type":21,"tag":209,"props":78241,"children":78242},{"style":222},[78243],{"type":26,"value":37029},{"type":21,"tag":209,"props":78245,"children":78247},{"class":211,"line":78246},253,[78248,78252,78256,78260],{"type":21,"tag":209,"props":78249,"children":78250},{"style":263},[78251],{"type":26,"value":51473},{"type":21,"tag":209,"props":78253,"children":78254},{"style":222},[78255],{"type":26,"value":378},{"type":21,"tag":209,"props":78257,"children":78258},{"style":360},[78259],{"type":26,"value":32649},{"type":21,"tag":209,"props":78261,"children":78262},{"style":222},[78263],{"type":26,"value":4842},{"type":21,"tag":209,"props":78265,"children":78267},{"class":211,"line":78266},254,[78268],{"type":21,"tag":209,"props":78269,"children":78270},{"style":222},[78271],{"type":26,"value":331},{"type":21,"tag":209,"props":78273,"children":78275},{"class":211,"line":78274},255,[78276],{"type":21,"tag":209,"props":78277,"children":78278},{"style":222},[78279],{"type":26,"value":340},{"type":21,"tag":209,"props":78281,"children":78283},{"class":211,"line":78282},256,[78284],{"type":21,"tag":209,"props":78285,"children":78286},{"emptyLinePlaceholder":248},[78287],{"type":26,"value":251},{"type":21,"tag":209,"props":78289,"children":78291},{"class":211,"line":78290},257,[78292],{"type":21,"tag":209,"props":78293,"children":78294},{"style":448},[78295],{"type":26,"value":731},{"type":21,"tag":209,"props":78297,"children":78299},{"class":211,"line":78298},258,[78300],{"type":21,"tag":209,"props":78301,"children":78302},{"style":448},[78303],{"type":26,"value":78304}," * Called when the full file has been uploaded.\n",{"type":21,"tag":209,"props":78306,"children":78308},{"class":211,"line":78307},259,[78309],{"type":21,"tag":209,"props":78310,"children":78311},{"style":448},[78312],{"type":26,"value":755},{"type":21,"tag":209,"props":78314,"children":78316},{"class":211,"line":78315},260,[78317,78321,78325,78329,78333,78337,78341,78345],{"type":21,"tag":209,"props":78318,"children":78319},{"style":263},[78320],{"type":26,"value":61180},{"type":21,"tag":209,"props":78322,"children":78323},{"style":222},[78324],{"type":26,"value":378},{"type":21,"tag":209,"props":78326,"children":78327},{"style":263},[78328],{"type":26,"value":37016},{"type":21,"tag":209,"props":78330,"children":78331},{"style":222},[78332],{"type":26,"value":378},{"type":21,"tag":209,"props":78334,"children":78335},{"style":360},[78336],{"type":26,"value":78001},{"type":21,"tag":209,"props":78338,"children":78339},{"style":216},[78340],{"type":26,"value":271},{"type":21,"tag":209,"props":78342,"children":78343},{"style":216},[78344],{"type":26,"value":4766},{"type":21,"tag":209,"props":78346,"children":78347},{"style":222},[78348],{"type":26,"value":2561},{"type":21,"tag":209,"props":78350,"children":78352},{"class":211,"line":78351},261,[78353,78357,78361,78365,78369,78374,78378,78382],{"type":21,"tag":209,"props":78354,"children":78355},{"style":263},[78356],{"type":26,"value":51112},{"type":21,"tag":209,"props":78358,"children":78359},{"style":222},[78360],{"type":26,"value":61531},{"type":21,"tag":209,"props":78362,"children":78363},{"style":360},[78364],{"type":26,"value":5590},{"type":21,"tag":209,"props":78366,"children":78367},{"style":222},[78368],{"type":26,"value":61541},{"type":21,"tag":209,"props":78370,"children":78371},{"style":263},[78372],{"type":26,"value":78373},"FILE_UPLOAD_FINISHED",{"type":21,"tag":209,"props":78375,"children":78376},{"style":222},[78377],{"type":26,"value":61551},{"type":21,"tag":209,"props":78379,"children":78380},{"style":263},[78381],{"type":26,"value":2508},{"type":21,"tag":209,"props":78383,"children":78384},{"style":222},[78385],{"type":26,"value":78070},{"type":21,"tag":209,"props":78387,"children":78389},{"class":211,"line":78388},262,[78390,78395,78399,78404,78408],{"type":21,"tag":209,"props":78391,"children":78392},{"style":222},[78393],{"type":26,"value":78394},"        file_size:",{"type":21,"tag":209,"props":78396,"children":78397},{"style":263},[78398],{"type":26,"value":2508},{"type":21,"tag":209,"props":78400,"children":78401},{"style":222},[78402],{"type":26,"value":78403},".file.size, file_type:",{"type":21,"tag":209,"props":78405,"children":78406},{"style":263},[78407],{"type":26,"value":2508},{"type":21,"tag":209,"props":78409,"children":78410},{"style":222},[78411],{"type":26,"value":78412},".file.type,\n",{"type":21,"tag":209,"props":78414,"children":78416},{"class":211,"line":78415},263,[78417,78421,78425,78429,78433,78437,78441],{"type":21,"tag":209,"props":78418,"children":78419},{"style":222},[78420],{"type":26,"value":78079},{"type":21,"tag":209,"props":78422,"children":78423},{"style":263},[78424],{"type":26,"value":2508},{"type":21,"tag":209,"props":78426,"children":78427},{"style":222},[78428],{"type":26,"value":378},{"type":21,"tag":209,"props":78430,"children":78431},{"style":360},[78432],{"type":26,"value":78092},{"type":21,"tag":209,"props":78434,"children":78435},{"style":222},[78436],{"type":26,"value":368},{"type":21,"tag":209,"props":78438,"children":78439},{"style":263},[78440],{"type":26,"value":2508},{"type":21,"tag":209,"props":78442,"children":78443},{"style":222},[78444],{"type":26,"value":78445},".xhr.responseText)});\n",{"type":21,"tag":209,"props":78447,"children":78449},{"class":211,"line":78448},264,[78450],{"type":21,"tag":209,"props":78451,"children":78452},{"style":222},[78453],{"type":26,"value":340},{"type":21,"tag":209,"props":78455,"children":78457},{"class":211,"line":78456},265,[78458],{"type":21,"tag":209,"props":78459,"children":78460},{"emptyLinePlaceholder":248},[78461],{"type":26,"value":251},{"type":21,"tag":209,"props":78463,"children":78465},{"class":211,"line":78464},266,[78466],{"type":21,"tag":209,"props":78467,"children":78468},{"style":448},[78469],{"type":26,"value":731},{"type":21,"tag":209,"props":78471,"children":78473},{"class":211,"line":78472},267,[78474],{"type":21,"tag":209,"props":78475,"children":78476},{"style":448},[78477],{"type":26,"value":78478}," * Try to parse the response as a JSON, and on failure return the error and the plaintext.\n",{"type":21,"tag":209,"props":78480,"children":78482},{"class":211,"line":78481},268,[78483,78487,78491],{"type":21,"tag":209,"props":78484,"children":78485},{"style":448},[78486],{"type":26,"value":11233},{"type":21,"tag":209,"props":78488,"children":78489},{"style":216},[78490],{"type":26,"value":4718},{"type":21,"tag":209,"props":78492,"children":78493},{"style":222},[78494],{"type":26,"value":14128},{"type":21,"tag":209,"props":78496,"children":78498},{"class":211,"line":78497},269,[78499,78503,78507],{"type":21,"tag":209,"props":78500,"children":78501},{"style":448},[78502],{"type":26,"value":11233},{"type":21,"tag":209,"props":78504,"children":78505},{"style":216},[78506],{"type":26,"value":4740},{"type":21,"tag":209,"props":78508,"children":78509},{"style":360},[78510],{"type":26,"value":78511}," {Object}\n",{"type":21,"tag":209,"props":78513,"children":78515},{"class":211,"line":78514},270,[78516],{"type":21,"tag":209,"props":78517,"children":78518},{"style":448},[78519],{"type":26,"value":755},{"type":21,"tag":209,"props":78521,"children":78523},{"class":211,"line":78522},271,[78524,78528,78532,78536,78540,78544,78548,78552,78556,78560],{"type":21,"tag":209,"props":78525,"children":78526},{"style":263},[78527],{"type":26,"value":61180},{"type":21,"tag":209,"props":78529,"children":78530},{"style":222},[78531],{"type":26,"value":378},{"type":21,"tag":209,"props":78533,"children":78534},{"style":263},[78535],{"type":26,"value":37016},{"type":21,"tag":209,"props":78537,"children":78538},{"style":222},[78539],{"type":26,"value":378},{"type":21,"tag":209,"props":78541,"children":78542},{"style":360},[78543],{"type":26,"value":78092},{"type":21,"tag":209,"props":78545,"children":78546},{"style":216},[78547],{"type":26,"value":271},{"type":21,"tag":209,"props":78549,"children":78550},{"style":216},[78551],{"type":26,"value":4766},{"type":21,"tag":209,"props":78553,"children":78554},{"style":222},[78555],{"type":26,"value":368},{"type":21,"tag":209,"props":78557,"children":78558},{"style":400},[78559],{"type":26,"value":12498},{"type":21,"tag":209,"props":78561,"children":78562},{"style":222},[78563],{"type":26,"value":10112},{"type":21,"tag":209,"props":78565,"children":78567},{"class":211,"line":78566},272,[78568],{"type":21,"tag":209,"props":78569,"children":78570},{"style":222},[78571],{"type":26,"value":7414},{"type":21,"tag":209,"props":78573,"children":78575},{"class":211,"line":78574},273,[78576,78580],{"type":21,"tag":209,"props":78577,"children":78578},{"style":216},[78579],{"type":26,"value":10405},{"type":21,"tag":209,"props":78581,"children":78582},{"style":222},[78583],{"type":26,"value":14556},{"type":21,"tag":209,"props":78585,"children":78587},{"class":211,"line":78586},274,[78588,78592],{"type":21,"tag":209,"props":78589,"children":78590},{"style":216},[78591],{"type":26,"value":10041},{"type":21,"tag":209,"props":78593,"children":78594},{"style":222},[78595],{"type":26,"value":7414},{"type":21,"tag":209,"props":78597,"children":78599},{"class":211,"line":78598},275,[78600,78605,78609,78613,78617,78621,78625,78629],{"type":21,"tag":209,"props":78601,"children":78602},{"style":222},[78603],{"type":26,"value":78604},"        response ",{"type":21,"tag":209,"props":78606,"children":78607},{"style":216},[78608],{"type":26,"value":1432},{"type":21,"tag":209,"props":78610,"children":78611},{"style":263},[78612],{"type":26,"value":17712},{"type":21,"tag":209,"props":78614,"children":78615},{"style":222},[78616],{"type":26,"value":378},{"type":21,"tag":209,"props":78618,"children":78619},{"style":360},[78620],{"type":26,"value":17721},{"type":21,"tag":209,"props":78622,"children":78623},{"style":222},[78624],{"type":26,"value":368},{"type":21,"tag":209,"props":78626,"children":78627},{"style":263},[78628],{"type":26,"value":2508},{"type":21,"tag":209,"props":78630,"children":78631},{"style":222},[78632],{"type":26,"value":78633},".xhr.responseText);\n",{"type":21,"tag":209,"props":78635,"children":78637},{"class":211,"line":78636},276,[78638,78643,78647],{"type":21,"tag":209,"props":78639,"children":78640},{"style":222},[78641],{"type":26,"value":78642},"    }",{"type":21,"tag":209,"props":78644,"children":78645},{"style":216},[78646],{"type":26,"value":6823},{"type":21,"tag":209,"props":78648,"children":78649},{"style":222},[78650],{"type":26,"value":30897},{"type":21,"tag":209,"props":78652,"children":78654},{"class":211,"line":78653},277,[78655,78659,78663,78668,78672],{"type":21,"tag":209,"props":78656,"children":78657},{"style":222},[78658],{"type":26,"value":78604},{"type":21,"tag":209,"props":78660,"children":78661},{"style":216},[78662],{"type":26,"value":1432},{"type":21,"tag":209,"props":78664,"children":78665},{"style":222},[78666],{"type":26,"value":78667}," {error:e, text:",{"type":21,"tag":209,"props":78669,"children":78670},{"style":263},[78671],{"type":26,"value":2508},{"type":21,"tag":209,"props":78673,"children":78674},{"style":222},[78675],{"type":26,"value":78676},".xhr.responseText};\n",{"type":21,"tag":209,"props":78678,"children":78680},{"class":211,"line":78679},278,[78681],{"type":21,"tag":209,"props":78682,"children":78683},{"style":222},[78684],{"type":26,"value":331},{"type":21,"tag":209,"props":78686,"children":78688},{"class":211,"line":78687},279,[78689,78693],{"type":21,"tag":209,"props":78690,"children":78691},{"style":216},[78692],{"type":26,"value":1298},{"type":21,"tag":209,"props":78694,"children":78695},{"style":222},[78696],{"type":26,"value":14556},{"type":21,"tag":209,"props":78698,"children":78700},{"class":211,"line":78699},280,[78701],{"type":21,"tag":209,"props":78702,"children":78703},{"style":222},[78704],{"type":26,"value":7798},{"type":21,"tag":209,"props":78706,"children":78708},{"class":211,"line":78707},281,[78709],{"type":21,"tag":209,"props":78710,"children":78711},{"emptyLinePlaceholder":248},[78712],{"type":26,"value":251},{"type":21,"tag":209,"props":78714,"children":78716},{"class":211,"line":78715},282,[78717],{"type":21,"tag":209,"props":78718,"children":78719},{"style":448},[78720],{"type":26,"value":731},{"type":21,"tag":209,"props":78722,"children":78724},{"class":211,"line":78723},283,[78725],{"type":21,"tag":209,"props":78726,"children":78727},{"style":448},[78728],{"type":26,"value":78729}," * Pause the upload (works for chunked uploads only).\n",{"type":21,"tag":209,"props":78731,"children":78733},{"class":211,"line":78732},284,[78734],{"type":21,"tag":209,"props":78735,"children":78736},{"style":448},[78737],{"type":26,"value":755},{"type":21,"tag":209,"props":78739,"children":78741},{"class":211,"line":78740},285,[78742,78746,78750,78754,78758,78763,78767,78771],{"type":21,"tag":209,"props":78743,"children":78744},{"style":263},[78745],{"type":26,"value":61180},{"type":21,"tag":209,"props":78747,"children":78748},{"style":222},[78749],{"type":26,"value":378},{"type":21,"tag":209,"props":78751,"children":78752},{"style":263},[78753],{"type":26,"value":37016},{"type":21,"tag":209,"props":78755,"children":78756},{"style":222},[78757],{"type":26,"value":378},{"type":21,"tag":209,"props":78759,"children":78760},{"style":360},[78761],{"type":26,"value":78762},"pause",{"type":21,"tag":209,"props":78764,"children":78765},{"style":216},[78766],{"type":26,"value":271},{"type":21,"tag":209,"props":78768,"children":78769},{"style":216},[78770],{"type":26,"value":4766},{"type":21,"tag":209,"props":78772,"children":78773},{"style":222},[78774],{"type":26,"value":2561},{"type":21,"tag":209,"props":78776,"children":78778},{"class":211,"line":78777},286,[78779,78783,78787,78791,78795],{"type":21,"tag":209,"props":78780,"children":78781},{"style":263},[78782],{"type":26,"value":51112},{"type":21,"tag":209,"props":78784,"children":78785},{"style":222},[78786],{"type":26,"value":71323},{"type":21,"tag":209,"props":78788,"children":78789},{"style":216},[78790],{"type":26,"value":1432},{"type":21,"tag":209,"props":78792,"children":78793},{"style":263},[78794],{"type":26,"value":6243},{"type":21,"tag":209,"props":78796,"children":78797},{"style":222},[78798],{"type":26,"value":241},{"type":21,"tag":209,"props":78800,"children":78802},{"class":211,"line":78801},287,[78803,78807,78811,78815,78819,78824,78829,78833,78838,78842],{"type":21,"tag":209,"props":78804,"children":78805},{"style":263},[78806],{"type":26,"value":51112},{"type":21,"tag":209,"props":78808,"children":78809},{"style":222},[78810],{"type":26,"value":61531},{"type":21,"tag":209,"props":78812,"children":78813},{"style":360},[78814],{"type":26,"value":61536},{"type":21,"tag":209,"props":78816,"children":78817},{"style":222},[78818],{"type":26,"value":61541},{"type":21,"tag":209,"props":78820,"children":78821},{"style":263},[78822],{"type":26,"value":78823},"FILE_UPLOAD_PAUSE",{"type":21,"tag":209,"props":78825,"children":78826},{"style":222},[78827],{"type":26,"value":78828},", current_range:{start:",{"type":21,"tag":209,"props":78830,"children":78831},{"style":263},[78832],{"type":26,"value":2508},{"type":21,"tag":209,"props":78834,"children":78835},{"style":222},[78836],{"type":26,"value":78837},".start, end:",{"type":21,"tag":209,"props":78839,"children":78840},{"style":263},[78841],{"type":26,"value":2508},{"type":21,"tag":209,"props":78843,"children":78844},{"style":222},[78845],{"type":26,"value":78846},".end,\n",{"type":21,"tag":209,"props":78848,"children":78850},{"class":211,"line":78849},288,[78851,78856,78860],{"type":21,"tag":209,"props":78852,"children":78853},{"style":222},[78854],{"type":26,"value":78855},"        total:",{"type":21,"tag":209,"props":78857,"children":78858},{"style":263},[78859],{"type":26,"value":2508},{"type":21,"tag":209,"props":78861,"children":78862},{"style":222},[78863],{"type":26,"value":78864},".file.size}});\n",{"type":21,"tag":209,"props":78866,"children":78868},{"class":211,"line":78867},289,[78869],{"type":21,"tag":209,"props":78870,"children":78871},{"style":222},[78872],{"type":26,"value":7798},{"type":21,"tag":209,"props":78874,"children":78876},{"class":211,"line":78875},290,[78877],{"type":21,"tag":209,"props":78878,"children":78879},{"emptyLinePlaceholder":248},[78880],{"type":26,"value":251},{"type":21,"tag":209,"props":78882,"children":78884},{"class":211,"line":78883},291,[78885],{"type":21,"tag":209,"props":78886,"children":78887},{"style":448},[78888],{"type":26,"value":731},{"type":21,"tag":209,"props":78890,"children":78892},{"class":211,"line":78891},292,[78893],{"type":21,"tag":209,"props":78894,"children":78895},{"style":448},[78896],{"type":26,"value":78897}," * Resume the upload (works for chunked uploads only).\n",{"type":21,"tag":209,"props":78899,"children":78901},{"class":211,"line":78900},293,[78902],{"type":21,"tag":209,"props":78903,"children":78904},{"style":448},[78905],{"type":26,"value":755},{"type":21,"tag":209,"props":78907,"children":78909},{"class":211,"line":78908},294,[78910,78914,78918,78922,78926,78930,78934,78938],{"type":21,"tag":209,"props":78911,"children":78912},{"style":263},[78913],{"type":26,"value":61180},{"type":21,"tag":209,"props":78915,"children":78916},{"style":222},[78917],{"type":26,"value":378},{"type":21,"tag":209,"props":78919,"children":78920},{"style":263},[78921],{"type":26,"value":37016},{"type":21,"tag":209,"props":78923,"children":78924},{"style":222},[78925],{"type":26,"value":378},{"type":21,"tag":209,"props":78927,"children":78928},{"style":360},[78929],{"type":26,"value":6124},{"type":21,"tag":209,"props":78931,"children":78932},{"style":216},[78933],{"type":26,"value":271},{"type":21,"tag":209,"props":78935,"children":78936},{"style":216},[78937],{"type":26,"value":4766},{"type":21,"tag":209,"props":78939,"children":78940},{"style":222},[78941],{"type":26,"value":2561},{"type":21,"tag":209,"props":78943,"children":78945},{"class":211,"line":78944},295,[78946,78950,78954,78958],{"type":21,"tag":209,"props":78947,"children":78948},{"style":216},[78949],{"type":26,"value":10853},{"type":21,"tag":209,"props":78951,"children":78952},{"style":222},[78953],{"type":26,"value":4776},{"type":21,"tag":209,"props":78955,"children":78956},{"style":263},[78957],{"type":26,"value":2508},{"type":21,"tag":209,"props":78959,"children":78960},{"style":222},[78961],{"type":26,"value":78235},{"type":21,"tag":209,"props":78963,"children":78965},{"class":211,"line":78964},296,[78966],{"type":21,"tag":209,"props":78967,"children":78968},{"style":222},[78969],{"type":26,"value":37029},{"type":21,"tag":209,"props":78971,"children":78973},{"class":211,"line":78972},297,[78974,78978,78982,78986,78990],{"type":21,"tag":209,"props":78975,"children":78976},{"style":263},[78977],{"type":26,"value":51473},{"type":21,"tag":209,"props":78979,"children":78980},{"style":222},[78981],{"type":26,"value":71323},{"type":21,"tag":209,"props":78983,"children":78984},{"style":216},[78985],{"type":26,"value":1432},{"type":21,"tag":209,"props":78987,"children":78988},{"style":263},[78989],{"type":26,"value":5455},{"type":21,"tag":209,"props":78991,"children":78992},{"style":222},[78993],{"type":26,"value":241},{"type":21,"tag":209,"props":78995,"children":78997},{"class":211,"line":78996},298,[78998,79002,79006,79010,79014,79019,79023,79027,79031,79035],{"type":21,"tag":209,"props":78999,"children":79000},{"style":263},[79001],{"type":26,"value":51473},{"type":21,"tag":209,"props":79003,"children":79004},{"style":222},[79005],{"type":26,"value":61531},{"type":21,"tag":209,"props":79007,"children":79008},{"style":360},[79009],{"type":26,"value":61536},{"type":21,"tag":209,"props":79011,"children":79012},{"style":222},[79013],{"type":26,"value":61541},{"type":21,"tag":209,"props":79015,"children":79016},{"style":263},[79017],{"type":26,"value":79018},"FILE_UPLOAD_RESUME",{"type":21,"tag":209,"props":79020,"children":79021},{"style":222},[79022],{"type":26,"value":78828},{"type":21,"tag":209,"props":79024,"children":79025},{"style":263},[79026],{"type":26,"value":2508},{"type":21,"tag":209,"props":79028,"children":79029},{"style":222},[79030],{"type":26,"value":78837},{"type":21,"tag":209,"props":79032,"children":79033},{"style":263},[79034],{"type":26,"value":2508},{"type":21,"tag":209,"props":79036,"children":79037},{"style":222},[79038],{"type":26,"value":78846},{"type":21,"tag":209,"props":79040,"children":79042},{"class":211,"line":79041},299,[79043,79048,79052],{"type":21,"tag":209,"props":79044,"children":79045},{"style":222},[79046],{"type":26,"value":79047},"            total:",{"type":21,"tag":209,"props":79049,"children":79050},{"style":263},[79051],{"type":26,"value":2508},{"type":21,"tag":209,"props":79053,"children":79054},{"style":222},[79055],{"type":26,"value":78864},{"type":21,"tag":209,"props":79057,"children":79059},{"class":211,"line":79058},300,[79060,79064,79068,79072],{"type":21,"tag":209,"props":79061,"children":79062},{"style":263},[79063],{"type":26,"value":51473},{"type":21,"tag":209,"props":79065,"children":79066},{"style":222},[79067],{"type":26,"value":378},{"type":21,"tag":209,"props":79069,"children":79070},{"style":360},[79071],{"type":26,"value":32649},{"type":21,"tag":209,"props":79073,"children":79074},{"style":222},[79075],{"type":26,"value":4842},{"type":21,"tag":209,"props":79077,"children":79079},{"class":211,"line":79078},301,[79080],{"type":21,"tag":209,"props":79081,"children":79082},{"style":222},[79083],{"type":26,"value":331},{"type":21,"tag":209,"props":79085,"children":79087},{"class":211,"line":79086},302,[79088],{"type":21,"tag":209,"props":79089,"children":79090},{"style":222},[79091],{"type":26,"value":7798},{"type":21,"tag":209,"props":79093,"children":79095},{"class":211,"line":79094},303,[79096],{"type":21,"tag":209,"props":79097,"children":79098},{"emptyLinePlaceholder":248},[79099],{"type":26,"value":251},{"type":21,"tag":209,"props":79101,"children":79103},{"class":211,"line":79102},304,[79104],{"type":21,"tag":209,"props":79105,"children":79106},{"style":448},[79107],{"type":26,"value":731},{"type":21,"tag":209,"props":79109,"children":79111},{"class":211,"line":79110},305,[79112],{"type":21,"tag":209,"props":79113,"children":79114},{"style":448},[79115],{"type":26,"value":79116}," * Deferred wrapper for file reader.\n",{"type":21,"tag":209,"props":79118,"children":79120},{"class":211,"line":79119},306,[79121,79125,79129],{"type":21,"tag":209,"props":79122,"children":79123},{"style":448},[79124],{"type":26,"value":11233},{"type":21,"tag":209,"props":79126,"children":79127},{"style":216},[79128],{"type":26,"value":4718},{"type":21,"tag":209,"props":79130,"children":79131},{"style":222},[79132],{"type":26,"value":72389},{"type":21,"tag":209,"props":79134,"children":79136},{"class":211,"line":79135},307,[79137,79141,79145],{"type":21,"tag":209,"props":79138,"children":79139},{"style":448},[79140],{"type":26,"value":11233},{"type":21,"tag":209,"props":79142,"children":79143},{"style":216},[79144],{"type":26,"value":4718},{"type":21,"tag":209,"props":79146,"children":79147},{"style":222},[79148],{"type":26,"value":71142},{"type":21,"tag":209,"props":79150,"children":79152},{"class":211,"line":79151},308,[79153,79157,79161,79165],{"type":21,"tag":209,"props":79154,"children":79155},{"style":448},[79156],{"type":26,"value":11233},{"type":21,"tag":209,"props":79158,"children":79159},{"style":216},[79160],{"type":26,"value":4740},{"type":21,"tag":209,"props":79162,"children":79163},{"style":360},[79164],{"type":26,"value":67802},{"type":21,"tag":209,"props":79166,"children":79167},{"style":448},[79168],{"type":26,"value":72424},{"type":21,"tag":209,"props":79170,"children":79172},{"class":211,"line":79171},309,[79173,79177],{"type":21,"tag":209,"props":79174,"children":79175},{"style":448},[79176],{"type":26,"value":11233},{"type":21,"tag":209,"props":79178,"children":79179},{"style":216},[79180],{"type":26,"value":46286},{"type":21,"tag":209,"props":79182,"children":79184},{"class":211,"line":79183},310,[79185],{"type":21,"tag":209,"props":79186,"children":79187},{"style":448},[79188],{"type":26,"value":755},{"type":21,"tag":209,"props":79190,"children":79192},{"class":211,"line":79191},311,[79193,79197,79201,79205,79209,79213,79217],{"type":21,"tag":209,"props":79194,"children":79195},{"style":216},[79196],{"type":26,"value":5370},{"type":21,"tag":209,"props":79198,"children":79199},{"style":360},[79200],{"type":26,"value":58025},{"type":21,"tag":209,"props":79202,"children":79203},{"style":222},[79204],{"type":26,"value":368},{"type":21,"tag":209,"props":79206,"children":79207},{"style":400},[79208],{"type":26,"value":32672},{"type":21,"tag":209,"props":79210,"children":79211},{"style":222},[79212],{"type":26,"value":408},{"type":21,"tag":209,"props":79214,"children":79215},{"style":400},[79216],{"type":26,"value":19799},{"type":21,"tag":209,"props":79218,"children":79219},{"style":222},[79220],{"type":26,"value":2369},{"type":21,"tag":209,"props":79222,"children":79224},{"class":211,"line":79223},312,[79225,79229,79233,79237,79241,79245],{"type":21,"tag":209,"props":79226,"children":79227},{"style":263},[79228],{"type":26,"value":51112},{"type":21,"tag":209,"props":79230,"children":79231},{"style":222},[79232],{"type":26,"value":71253},{"type":21,"tag":209,"props":79234,"children":79235},{"style":216},[79236],{"type":26,"value":1432},{"type":21,"tag":209,"props":79238,"children":79239},{"style":222},[79240],{"type":26,"value":26905},{"type":21,"tag":209,"props":79242,"children":79243},{"style":360},[79244],{"type":26,"value":26910},{"type":21,"tag":209,"props":79246,"children":79247},{"style":222},[79248],{"type":26,"value":4842},{"type":21,"tag":209,"props":79250,"children":79252},{"class":211,"line":79251},313,[79253,79257,79261,79265,79269,79273],{"type":21,"tag":209,"props":79254,"children":79255},{"style":263},[79256],{"type":26,"value":51112},{"type":21,"tag":209,"props":79258,"children":79259},{"style":222},[79260],{"type":26,"value":72512},{"type":21,"tag":209,"props":79262,"children":79263},{"style":216},[79264],{"type":26,"value":1432},{"type":21,"tag":209,"props":79266,"children":79267},{"style":216},[79268],{"type":26,"value":4667},{"type":21,"tag":209,"props":79270,"children":79271},{"style":360},[79272],{"type":26,"value":72525},{"type":21,"tag":209,"props":79274,"children":79275},{"style":222},[79276],{"type":26,"value":4842},{"type":21,"tag":209,"props":79278,"children":79280},{"class":211,"line":79279},314,[79281,79285,79289,79293],{"type":21,"tag":209,"props":79282,"children":79283},{"style":263},[79284],{"type":26,"value":51112},{"type":21,"tag":209,"props":79286,"children":79287},{"style":222},[79288],{"type":26,"value":71281},{"type":21,"tag":209,"props":79290,"children":79291},{"style":216},[79292],{"type":26,"value":1432},{"type":21,"tag":209,"props":79294,"children":79295},{"style":222},[79296],{"type":26,"value":71290},{"type":21,"tag":209,"props":79298,"children":79300},{"class":211,"line":79299},315,[79301,79305,79309,79313],{"type":21,"tag":209,"props":79302,"children":79303},{"style":263},[79304],{"type":26,"value":51112},{"type":21,"tag":209,"props":79306,"children":79307},{"style":222},[79308],{"type":26,"value":72560},{"type":21,"tag":209,"props":79310,"children":79311},{"style":216},[79312],{"type":26,"value":1432},{"type":21,"tag":209,"props":79314,"children":79315},{"style":222},[79316],{"type":26,"value":72569},{"type":21,"tag":209,"props":79318,"children":79320},{"class":211,"line":79319},316,[79321],{"type":21,"tag":209,"props":79322,"children":79323},{"emptyLinePlaceholder":248},[79324],{"type":26,"value":251},{"type":21,"tag":209,"props":79326,"children":79328},{"class":211,"line":79327},317,[79329,79333,79337,79341],{"type":21,"tag":209,"props":79330,"children":79331},{"style":263},[79332],{"type":26,"value":51112},{"type":21,"tag":209,"props":79334,"children":79335},{"style":222},[79336],{"type":26,"value":378},{"type":21,"tag":209,"props":79338,"children":79339},{"style":360},[79340],{"type":26,"value":72592},{"type":21,"tag":209,"props":79342,"children":79343},{"style":222},[79344],{"type":26,"value":4842},{"type":21,"tag":209,"props":79346,"children":79348},{"class":211,"line":79347},318,[79349,79353],{"type":21,"tag":209,"props":79350,"children":79351},{"style":263},[79352],{"type":26,"value":51112},{"type":21,"tag":209,"props":79354,"children":79355},{"style":222},[79356],{"type":26,"value":72608},{"type":21,"tag":209,"props":79358,"children":79360},{"class":211,"line":79359},319,[79361],{"type":21,"tag":209,"props":79362,"children":79363},{"emptyLinePlaceholder":248},[79364],{"type":26,"value":251},{"type":21,"tag":209,"props":79366,"children":79368},{"class":211,"line":79367},320,[79369,79373,79377,79381,79385],{"type":21,"tag":209,"props":79370,"children":79371},{"style":216},[79372],{"type":26,"value":1298},{"type":21,"tag":209,"props":79374,"children":79375},{"style":263},[79376],{"type":26,"value":17698},{"type":21,"tag":209,"props":79378,"children":79379},{"style":222},[79380],{"type":26,"value":61531},{"type":21,"tag":209,"props":79382,"children":79383},{"style":360},[79384],{"type":26,"value":27809},{"type":21,"tag":209,"props":79386,"children":79387},{"style":222},[79388],{"type":26,"value":4842},{"type":21,"tag":209,"props":79390,"children":79392},{"class":211,"line":79391},321,[79393],{"type":21,"tag":209,"props":79394,"children":79395},{"style":222},[79396],{"type":26,"value":7798},{"type":21,"tag":209,"props":79398,"children":79400},{"class":211,"line":79399},322,[79401],{"type":21,"tag":209,"props":79402,"children":79403},{"emptyLinePlaceholder":248},[79404],{"type":26,"value":251},{"type":21,"tag":209,"props":79406,"children":79408},{"class":211,"line":79407},323,[79409],{"type":21,"tag":209,"props":79410,"children":79411},{"style":448},[79412],{"type":26,"value":731},{"type":21,"tag":209,"props":79414,"children":79416},{"class":211,"line":79415},324,[79417],{"type":21,"tag":209,"props":79418,"children":79419},{"style":448},[79420],{"type":26,"value":72667},{"type":21,"tag":209,"props":79422,"children":79424},{"class":211,"line":79423},325,[79425],{"type":21,"tag":209,"props":79426,"children":79427},{"style":448},[79428],{"type":26,"value":72675},{"type":21,"tag":209,"props":79430,"children":79432},{"class":211,"line":79431},326,[79433],{"type":21,"tag":209,"props":79434,"children":79435},{"style":448},[79436],{"type":26,"value":755},{"type":21,"tag":209,"props":79438,"children":79440},{"class":211,"line":79439},327,[79441,79445,79449,79453,79457,79461,79465,79469],{"type":21,"tag":209,"props":79442,"children":79443},{"style":263},[79444],{"type":26,"value":72690},{"type":21,"tag":209,"props":79446,"children":79447},{"style":222},[79448],{"type":26,"value":378},{"type":21,"tag":209,"props":79450,"children":79451},{"style":263},[79452],{"type":26,"value":37016},{"type":21,"tag":209,"props":79454,"children":79455},{"style":222},[79456],{"type":26,"value":378},{"type":21,"tag":209,"props":79458,"children":79459},{"style":360},[79460],{"type":26,"value":72592},{"type":21,"tag":209,"props":79462,"children":79463},{"style":216},[79464],{"type":26,"value":271},{"type":21,"tag":209,"props":79466,"children":79467},{"style":216},[79468],{"type":26,"value":4766},{"type":21,"tag":209,"props":79470,"children":79471},{"style":222},[79472],{"type":26,"value":2561},{"type":21,"tag":209,"props":79474,"children":79476},{"class":211,"line":79475},328,[79477,79481,79485,79489,79493],{"type":21,"tag":209,"props":79478,"children":79479},{"style":216},[79480],{"type":26,"value":10405},{"type":21,"tag":209,"props":79482,"children":79483},{"style":222},[79484],{"type":26,"value":57248},{"type":21,"tag":209,"props":79486,"children":79487},{"style":216},[79488],{"type":26,"value":1432},{"type":21,"tag":209,"props":79490,"children":79491},{"style":263},[79492],{"type":26,"value":17698},{"type":21,"tag":209,"props":79494,"children":79495},{"style":222},[79496],{"type":26,"value":241},{"type":21,"tag":209,"props":79498,"children":79500},{"class":211,"line":79499},329,[79501],{"type":21,"tag":209,"props":79502,"children":79503},{"emptyLinePlaceholder":248},[79504],{"type":26,"value":251},{"type":21,"tag":209,"props":79506,"children":79508},{"class":211,"line":79507},330,[79509,79513,79517,79521,79525,79529,79533,79537,79541,79545],{"type":21,"tag":209,"props":79510,"children":79511},{"style":263},[79512],{"type":26,"value":51112},{"type":21,"tag":209,"props":79514,"children":79515},{"style":222},[79516],{"type":26,"value":72760},{"type":21,"tag":209,"props":79518,"children":79519},{"style":360},[79520],{"type":26,"value":6424},{"type":21,"tag":209,"props":79522,"children":79523},{"style":222},[79524],{"type":26,"value":368},{"type":21,"tag":209,"props":79526,"children":79527},{"style":233},[79528],{"type":26,"value":17784},{"type":21,"tag":209,"props":79530,"children":79531},{"style":222},[79532],{"type":26,"value":408},{"type":21,"tag":209,"props":79534,"children":79535},{"style":216},[79536],{"type":26,"value":5370},{"type":21,"tag":209,"props":79538,"children":79539},{"style":222},[79540],{"type":26,"value":368},{"type":21,"tag":209,"props":79542,"children":79543},{"style":400},[79544],{"type":26,"value":10794},{"type":21,"tag":209,"props":79546,"children":79547},{"style":222},[79548],{"type":26,"value":2369},{"type":21,"tag":209,"props":79550,"children":79552},{"class":211,"line":79551},331,[79553,79557,79561,79565],{"type":21,"tag":209,"props":79554,"children":79555},{"style":216},[79556],{"type":26,"value":5925},{"type":21,"tag":209,"props":79558,"children":79559},{"style":222},[79560],{"type":26,"value":72804},{"type":21,"tag":209,"props":79562,"children":79563},{"style":216},[79564],{"type":26,"value":1432},{"type":21,"tag":209,"props":79566,"children":79567},{"style":222},[79568],{"type":26,"value":72813},{"type":21,"tag":209,"props":79570,"children":79572},{"class":211,"line":79571},332,[79573,79577,79581],{"type":21,"tag":209,"props":79574,"children":79575},{"style":222},[79576],{"type":26,"value":72821},{"type":21,"tag":209,"props":79578,"children":79579},{"style":216},[79580],{"type":26,"value":1432},{"type":21,"tag":209,"props":79582,"children":79583},{"style":222},[79584],{"type":26,"value":72830},{"type":21,"tag":209,"props":79586,"children":79588},{"class":211,"line":79587},333,[79589,79593,79597,79601,79605,79609,79613,79617,79621],{"type":21,"tag":209,"props":79590,"children":79591},{"style":222},[79592],{"type":26,"value":72838},{"type":21,"tag":209,"props":79594,"children":79595},{"style":216},[79596],{"type":26,"value":1432},{"type":21,"tag":209,"props":79598,"children":79599},{"style":233},[79600],{"type":26,"value":72847},{"type":21,"tag":209,"props":79602,"children":79603},{"style":216},[79604],{"type":26,"value":10237},{"type":21,"tag":209,"props":79606,"children":79607},{"style":263},[79608],{"type":26,"value":2508},{"type":21,"tag":209,"props":79610,"children":79611},{"style":222},[79612],{"type":26,"value":72860},{"type":21,"tag":209,"props":79614,"children":79615},{"style":216},[79616],{"type":26,"value":10237},{"type":21,"tag":209,"props":79618,"children":79619},{"style":233},[79620],{"type":26,"value":72869},{"type":21,"tag":209,"props":79622,"children":79623},{"style":222},[79624],{"type":26,"value":241},{"type":21,"tag":209,"props":79626,"children":79628},{"class":211,"line":79627},334,[79629,79633],{"type":21,"tag":209,"props":79630,"children":79631},{"style":216},[79632],{"type":26,"value":72881},{"type":21,"tag":209,"props":79634,"children":79635},{"style":222},[79636],{"type":26,"value":72886},{"type":21,"tag":209,"props":79638,"children":79640},{"class":211,"line":79639},335,[79641],{"type":21,"tag":209,"props":79642,"children":79643},{"style":222},[79644],{"type":26,"value":7561},{"type":21,"tag":209,"props":79646,"children":79648},{"class":211,"line":79647},336,[79649,79653,79657,79661],{"type":21,"tag":209,"props":79650,"children":79651},{"style":216},[79652],{"type":26,"value":72901},{"type":21,"tag":209,"props":79654,"children":79655},{"style":222},[79656],{"type":26,"value":72906},{"type":21,"tag":209,"props":79658,"children":79659},{"style":263},[79660],{"type":26,"value":72911},{"type":21,"tag":209,"props":79662,"children":79663},{"style":222},[79664],{"type":26,"value":844},{"type":21,"tag":209,"props":79666,"children":79668},{"class":211,"line":79667},337,[79669,79673,79677,79681],{"type":21,"tag":209,"props":79670,"children":79671},{"style":222},[79672],{"type":26,"value":72923},{"type":21,"tag":209,"props":79674,"children":79675},{"style":216},[79676],{"type":26,"value":13131},{"type":21,"tag":209,"props":79678,"children":79679},{"style":233},[79680],{"type":26,"value":72932},{"type":21,"tag":209,"props":79682,"children":79683},{"style":222},[79684],{"type":26,"value":241},{"type":21,"tag":209,"props":79686,"children":79688},{"class":211,"line":79687},338,[79689,79693],{"type":21,"tag":209,"props":79690,"children":79691},{"style":216},[79692],{"type":26,"value":72944},{"type":21,"tag":209,"props":79694,"children":79695},{"style":222},[79696],{"type":26,"value":241},{"type":21,"tag":209,"props":79698,"children":79700},{"class":211,"line":79699},339,[79701,79705,79709,79713],{"type":21,"tag":209,"props":79702,"children":79703},{"style":216},[79704],{"type":26,"value":72901},{"type":21,"tag":209,"props":79706,"children":79707},{"style":222},[79708],{"type":26,"value":72906},{"type":21,"tag":209,"props":79710,"children":79711},{"style":263},[79712],{"type":26,"value":72964},{"type":21,"tag":209,"props":79714,"children":79715},{"style":222},[79716],{"type":26,"value":844},{"type":21,"tag":209,"props":79718,"children":79720},{"class":211,"line":79719},340,[79721,79725,79729,79733],{"type":21,"tag":209,"props":79722,"children":79723},{"style":222},[79724],{"type":26,"value":72923},{"type":21,"tag":209,"props":79726,"children":79727},{"style":216},[79728],{"type":26,"value":13131},{"type":21,"tag":209,"props":79730,"children":79731},{"style":233},[79732],{"type":26,"value":72984},{"type":21,"tag":209,"props":79734,"children":79735},{"style":222},[79736],{"type":26,"value":241},{"type":21,"tag":209,"props":79738,"children":79740},{"class":211,"line":79739},341,[79741,79745],{"type":21,"tag":209,"props":79742,"children":79743},{"style":216},[79744],{"type":26,"value":72944},{"type":21,"tag":209,"props":79746,"children":79747},{"style":222},[79748],{"type":26,"value":241},{"type":21,"tag":209,"props":79750,"children":79752},{"class":211,"line":79751},342,[79753,79757,79761,79765],{"type":21,"tag":209,"props":79754,"children":79755},{"style":216},[79756],{"type":26,"value":72901},{"type":21,"tag":209,"props":79758,"children":79759},{"style":222},[79760],{"type":26,"value":72906},{"type":21,"tag":209,"props":79762,"children":79763},{"style":263},[79764],{"type":26,"value":73015},{"type":21,"tag":209,"props":79766,"children":79767},{"style":222},[79768],{"type":26,"value":844},{"type":21,"tag":209,"props":79770,"children":79772},{"class":211,"line":79771},343,[79773,79777,79781,79785],{"type":21,"tag":209,"props":79774,"children":79775},{"style":222},[79776],{"type":26,"value":72923},{"type":21,"tag":209,"props":79778,"children":79779},{"style":216},[79780],{"type":26,"value":13131},{"type":21,"tag":209,"props":79782,"children":79783},{"style":233},[79784],{"type":26,"value":73035},{"type":21,"tag":209,"props":79786,"children":79787},{"style":222},[79788],{"type":26,"value":241},{"type":21,"tag":209,"props":79790,"children":79792},{"class":211,"line":79791},344,[79793,79797],{"type":21,"tag":209,"props":79794,"children":79795},{"style":216},[79796],{"type":26,"value":72944},{"type":21,"tag":209,"props":79798,"children":79799},{"style":222},[79800],{"type":26,"value":241},{"type":21,"tag":209,"props":79802,"children":79804},{"class":211,"line":79803},345,[79805,79809],{"type":21,"tag":209,"props":79806,"children":79807},{"style":216},[79808],{"type":26,"value":73058},{"type":21,"tag":209,"props":79810,"children":79811},{"style":222},[79812],{"type":26,"value":844},{"type":21,"tag":209,"props":79814,"children":79816},{"class":211,"line":79815},346,[79817,79821,79825,79829],{"type":21,"tag":209,"props":79818,"children":79819},{"style":222},[79820],{"type":26,"value":72923},{"type":21,"tag":209,"props":79822,"children":79823},{"style":216},[79824],{"type":26,"value":13131},{"type":21,"tag":209,"props":79826,"children":79827},{"style":233},[79828],{"type":26,"value":73078},{"type":21,"tag":209,"props":79830,"children":79831},{"style":222},[79832],{"type":26,"value":241},{"type":21,"tag":209,"props":79834,"children":79836},{"class":211,"line":79835},347,[79837,79841],{"type":21,"tag":209,"props":79838,"children":79839},{"style":216},[79840],{"type":26,"value":72944},{"type":21,"tag":209,"props":79842,"children":79843},{"style":222},[79844],{"type":26,"value":241},{"type":21,"tag":209,"props":79846,"children":79848},{"class":211,"line":79847},348,[79849],{"type":21,"tag":209,"props":79850,"children":79851},{"style":222},[79852],{"type":26,"value":2235},{"type":21,"tag":209,"props":79854,"children":79856},{"class":211,"line":79855},349,[79857,79861,79865,79869,79873],{"type":21,"tag":209,"props":79858,"children":79859},{"style":222},[79860],{"type":26,"value":73108},{"type":21,"tag":209,"props":79862,"children":79863},{"style":360},[79864],{"type":26,"value":5599},{"type":21,"tag":209,"props":79866,"children":79867},{"style":222},[79868],{"type":26,"value":61541},{"type":21,"tag":209,"props":79870,"children":79871},{"style":263},[79872],{"type":26,"value":73121},{"type":21,"tag":209,"props":79874,"children":79875},{"style":222},[79876],{"type":26,"value":73126},{"type":21,"tag":209,"props":79878,"children":79880},{"class":211,"line":79879},350,[79881,79885,79889],{"type":21,"tag":209,"props":79882,"children":79883},{"style":222},[79884],{"type":26,"value":73134},{"type":21,"tag":209,"props":79886,"children":79887},{"style":263},[79888],{"type":26,"value":27598},{"type":21,"tag":209,"props":79890,"children":79891},{"style":222},[79892],{"type":26,"value":2608},{"type":21,"tag":209,"props":79894,"children":79896},{"class":211,"line":79895},351,[79897],{"type":21,"tag":209,"props":79898,"children":79899},{"emptyLinePlaceholder":248},[79900],{"type":26,"value":251},{"type":21,"tag":209,"props":79902,"children":79904},{"class":211,"line":79903},352,[79905,79909,79913,79917,79921,79925,79929,79933,79937,79941],{"type":21,"tag":209,"props":79906,"children":79907},{"style":263},[79908],{"type":26,"value":51112},{"type":21,"tag":209,"props":79910,"children":79911},{"style":222},[79912],{"type":26,"value":72760},{"type":21,"tag":209,"props":79914,"children":79915},{"style":360},[79916],{"type":26,"value":6424},{"type":21,"tag":209,"props":79918,"children":79919},{"style":222},[79920],{"type":26,"value":368},{"type":21,"tag":209,"props":79922,"children":79923},{"style":233},[79924],{"type":26,"value":71597},{"type":21,"tag":209,"props":79926,"children":79927},{"style":222},[79928],{"type":26,"value":408},{"type":21,"tag":209,"props":79930,"children":79931},{"style":216},[79932],{"type":26,"value":5370},{"type":21,"tag":209,"props":79934,"children":79935},{"style":222},[79936],{"type":26,"value":368},{"type":21,"tag":209,"props":79938,"children":79939},{"style":400},[79940],{"type":26,"value":10794},{"type":21,"tag":209,"props":79942,"children":79943},{"style":222},[79944],{"type":26,"value":2369},{"type":21,"tag":209,"props":79946,"children":79948},{"class":211,"line":79947},353,[79949,79953],{"type":21,"tag":209,"props":79950,"children":79951},{"style":216},[79952],{"type":26,"value":5803},{"type":21,"tag":209,"props":79954,"children":79955},{"style":222},[79956],{"type":26,"value":61229},{"type":21,"tag":209,"props":79958,"children":79960},{"class":211,"line":79959},354,[79961],{"type":21,"tag":209,"props":79962,"children":79963},{"style":222},[79964],{"type":26,"value":7561},{"type":21,"tag":209,"props":79966,"children":79968},{"class":211,"line":79967},355,[79969,79973,79977,79981,79985],{"type":21,"tag":209,"props":79970,"children":79971},{"style":222},[79972],{"type":26,"value":73218},{"type":21,"tag":209,"props":79974,"children":79975},{"style":360},[79976],{"type":26,"value":61536},{"type":21,"tag":209,"props":79978,"children":79979},{"style":222},[79980],{"type":26,"value":61541},{"type":21,"tag":209,"props":79982,"children":79983},{"style":263},[79984],{"type":26,"value":73231},{"type":21,"tag":209,"props":79986,"children":79987},{"style":222},[79988],{"type":26,"value":73236},{"type":21,"tag":209,"props":79990,"children":79992},{"class":211,"line":79991},356,[79993,79997,80001],{"type":21,"tag":209,"props":79994,"children":79995},{"style":222},[79996],{"type":26,"value":73244},{"type":21,"tag":209,"props":79998,"children":79999},{"style":216},[80000],{"type":26,"value":9749},{"type":21,"tag":209,"props":80002,"children":80003},{"style":222},[80004],{"type":26,"value":73253},{"type":21,"tag":209,"props":80006,"children":80008},{"class":211,"line":80007},357,[80009],{"type":21,"tag":209,"props":80010,"children":80011},{"style":222},[80012],{"type":26,"value":2235},{"type":21,"tag":209,"props":80014,"children":80016},{"class":211,"line":80015},358,[80017],{"type":21,"tag":209,"props":80018,"children":80019},{"style":222},[80020],{"type":26,"value":3391},{"type":21,"tag":209,"props":80022,"children":80024},{"class":211,"line":80023},359,[80025],{"type":21,"tag":209,"props":80026,"children":80027},{"emptyLinePlaceholder":248},[80028],{"type":26,"value":251},{"type":21,"tag":209,"props":80030,"children":80032},{"class":211,"line":80031},360,[80033,80037,80041,80045,80049,80053,80057,80061,80065,80069],{"type":21,"tag":209,"props":80034,"children":80035},{"style":263},[80036],{"type":26,"value":51112},{"type":21,"tag":209,"props":80038,"children":80039},{"style":222},[80040],{"type":26,"value":72760},{"type":21,"tag":209,"props":80042,"children":80043},{"style":360},[80044],{"type":26,"value":6424},{"type":21,"tag":209,"props":80046,"children":80047},{"style":222},[80048],{"type":26,"value":368},{"type":21,"tag":209,"props":80050,"children":80051},{"style":233},[80052],{"type":26,"value":73298},{"type":21,"tag":209,"props":80054,"children":80055},{"style":222},[80056],{"type":26,"value":408},{"type":21,"tag":209,"props":80058,"children":80059},{"style":216},[80060],{"type":26,"value":5370},{"type":21,"tag":209,"props":80062,"children":80063},{"style":222},[80064],{"type":26,"value":368},{"type":21,"tag":209,"props":80066,"children":80067},{"style":400},[80068],{"type":26,"value":10794},{"type":21,"tag":209,"props":80070,"children":80071},{"style":222},[80072],{"type":26,"value":2369},{"type":21,"tag":209,"props":80074,"children":80076},{"class":211,"line":80075},361,[80077,80081,80085,80089,80093,80097],{"type":21,"tag":209,"props":80078,"children":80079},{"style":216},[80080],{"type":26,"value":5803},{"type":21,"tag":209,"props":80082,"children":80083},{"style":222},[80084],{"type":26,"value":73330},{"type":21,"tag":209,"props":80086,"children":80087},{"style":216},[80088],{"type":26,"value":12908},{"type":21,"tag":209,"props":80090,"children":80091},{"style":222},[80092],{"type":26,"value":73339},{"type":21,"tag":209,"props":80094,"children":80095},{"style":263},[80096],{"type":26,"value":73344},{"type":21,"tag":209,"props":80098,"children":80099},{"style":222},[80100],{"type":26,"value":10112},{"type":21,"tag":209,"props":80102,"children":80104},{"class":211,"line":80103},362,[80105],{"type":21,"tag":209,"props":80106,"children":80107},{"style":222},[80108],{"type":26,"value":7561},{"type":21,"tag":209,"props":80110,"children":80112},{"class":211,"line":80111},363,[80113,80117,80121,80125,80129],{"type":21,"tag":209,"props":80114,"children":80115},{"style":222},[80116],{"type":26,"value":73218},{"type":21,"tag":209,"props":80118,"children":80119},{"style":360},[80120],{"type":26,"value":5590},{"type":21,"tag":209,"props":80122,"children":80123},{"style":222},[80124],{"type":26,"value":61541},{"type":21,"tag":209,"props":80126,"children":80127},{"style":263},[80128],{"type":26,"value":73375},{"type":21,"tag":209,"props":80130,"children":80131},{"style":222},[80132],{"type":26,"value":304},{"type":21,"tag":209,"props":80134,"children":80136},{"class":211,"line":80135},364,[80137],{"type":21,"tag":209,"props":80138,"children":80139},{"style":222},[80140],{"type":26,"value":73387},{"type":21,"tag":209,"props":80142,"children":80144},{"class":211,"line":80143},365,[80145],{"type":21,"tag":209,"props":80146,"children":80147},{"style":222},[80148],{"type":26,"value":73395},{"type":21,"tag":209,"props":80150,"children":80152},{"class":211,"line":80151},366,[80153],{"type":21,"tag":209,"props":80154,"children":80155},{"style":222},[80156],{"type":26,"value":2235},{"type":21,"tag":209,"props":80158,"children":80160},{"class":211,"line":80159},367,[80161,80165,80169],{"type":21,"tag":209,"props":80162,"children":80163},{"style":222},[80164],{"type":26,"value":73134},{"type":21,"tag":209,"props":80166,"children":80167},{"style":263},[80168],{"type":26,"value":27598},{"type":21,"tag":209,"props":80170,"children":80171},{"style":222},[80172],{"type":26,"value":2608},{"type":21,"tag":209,"props":80174,"children":80176},{"class":211,"line":80175},368,[80177],{"type":21,"tag":209,"props":80178,"children":80179},{"style":222},[80180],{"type":26,"value":340},{"type":21,"tag":209,"props":80182,"children":80184},{"class":211,"line":80183},369,[80185],{"type":21,"tag":209,"props":80186,"children":80187},{"emptyLinePlaceholder":248},[80188],{"type":26,"value":251},{"type":21,"tag":209,"props":80190,"children":80192},{"class":211,"line":80191},370,[80193],{"type":21,"tag":209,"props":80194,"children":80195},{"style":448},[80196],{"type":26,"value":731},{"type":21,"tag":209,"props":80198,"children":80200},{"class":211,"line":80199},371,[80201],{"type":21,"tag":209,"props":80202,"children":80203},{"style":448},[80204],{"type":26,"value":80205}," * Entry point for calling the reader/uploader, with the element to be used as input specified.\n",{"type":21,"tag":209,"props":80207,"children":80209},{"class":211,"line":80208},372,[80210],{"type":21,"tag":209,"props":80211,"children":80212},{"style":448},[80213],{"type":26,"value":80214}," * Usage:\n",{"type":21,"tag":209,"props":80216,"children":80218},{"class":211,"line":80217},373,[80219],{"type":21,"tag":209,"props":80220,"children":80221},{"style":448},[80222],{"type":26,"value":80223}," * $('#input').hup({options}).on('events') --OR--\n",{"type":21,"tag":209,"props":80225,"children":80227},{"class":211,"line":80226},374,[80228],{"type":21,"tag":209,"props":80229,"children":80230},{"style":448},[80231],{"type":26,"value":80232}," * $('.inputs').hup({options}).on('events')\n",{"type":21,"tag":209,"props":80234,"children":80236},{"class":211,"line":80235},375,[80237,80241,80245],{"type":21,"tag":209,"props":80238,"children":80239},{"style":448},[80240],{"type":26,"value":11233},{"type":21,"tag":209,"props":80242,"children":80243},{"style":216},[80244],{"type":26,"value":4718},{"type":21,"tag":209,"props":80246,"children":80247},{"style":222},[80248],{"type":26,"value":71126},{"type":21,"tag":209,"props":80250,"children":80252},{"class":211,"line":80251},376,[80253,80257,80261,80266],{"type":21,"tag":209,"props":80254,"children":80255},{"style":448},[80256],{"type":26,"value":11233},{"type":21,"tag":209,"props":80258,"children":80259},{"style":216},[80260],{"type":26,"value":4740},{"type":21,"tag":209,"props":80262,"children":80263},{"style":360},[80264],{"type":26,"value":80265}," {Hup}",{"type":21,"tag":209,"props":80267,"children":80268},{"style":448},[80269],{"type":26,"value":80270}," Promise deferred from Hup.\n",{"type":21,"tag":209,"props":80272,"children":80274},{"class":211,"line":80273},377,[80275],{"type":21,"tag":209,"props":80276,"children":80277},{"style":448},[80278],{"type":26,"value":755},{"type":21,"tag":209,"props":80280,"children":80282},{"class":211,"line":80281},378,[80283,80288,80293,80297,80301,80305,80309],{"type":21,"tag":209,"props":80284,"children":80285},{"style":222},[80286],{"type":26,"value":80287},"$.fn.",{"type":21,"tag":209,"props":80289,"children":80290},{"style":360},[80291],{"type":26,"value":80292},"hup",{"type":21,"tag":209,"props":80294,"children":80295},{"style":216},[80296],{"type":26,"value":271},{"type":21,"tag":209,"props":80298,"children":80299},{"style":216},[80300],{"type":26,"value":4766},{"type":21,"tag":209,"props":80302,"children":80303},{"style":222},[80304],{"type":26,"value":368},{"type":21,"tag":209,"props":80306,"children":80307},{"style":400},[80308],{"type":26,"value":29825},{"type":21,"tag":209,"props":80310,"children":80311},{"style":222},[80312],{"type":26,"value":2369},{"type":21,"tag":209,"props":80314,"children":80316},{"class":211,"line":80315},379,[80317,80321,80326,80330,80335,80339],{"type":21,"tag":209,"props":80318,"children":80319},{"style":216},[80320],{"type":26,"value":10405},{"type":21,"tag":209,"props":80322,"children":80323},{"style":222},[80324],{"type":26,"value":80325}," options ",{"type":21,"tag":209,"props":80327,"children":80328},{"style":216},[80329],{"type":26,"value":1432},{"type":21,"tag":209,"props":80331,"children":80332},{"style":222},[80333],{"type":26,"value":80334}," (options ",{"type":21,"tag":209,"props":80336,"children":80337},{"style":216},[80338],{"type":26,"value":4677},{"type":21,"tag":209,"props":80340,"children":80341},{"style":222},[80342],{"type":26,"value":80343}," {});\n",{"type":21,"tag":209,"props":80345,"children":80347},{"class":211,"line":80346},380,[80348,80352,80356,80360,80364,80368,80372],{"type":21,"tag":209,"props":80349,"children":80350},{"style":216},[80351],{"type":26,"value":1298},{"type":21,"tag":209,"props":80353,"children":80354},{"style":263},[80355],{"type":26,"value":17698},{"type":21,"tag":209,"props":80357,"children":80358},{"style":222},[80359],{"type":26,"value":378},{"type":21,"tag":209,"props":80361,"children":80362},{"style":360},[80363],{"type":26,"value":50014},{"type":21,"tag":209,"props":80365,"children":80366},{"style":222},[80367],{"type":26,"value":368},{"type":21,"tag":209,"props":80369,"children":80370},{"style":216},[80371],{"type":26,"value":5370},{"type":21,"tag":209,"props":80373,"children":80374},{"style":222},[80375],{"type":26,"value":2561},{"type":21,"tag":209,"props":80377,"children":80379},{"class":211,"line":80378},381,[80380,80385,80389,80393],{"type":21,"tag":209,"props":80381,"children":80382},{"style":222},[80383],{"type":26,"value":80384},"        options.input ",{"type":21,"tag":209,"props":80386,"children":80387},{"style":216},[80388],{"type":26,"value":1432},{"type":21,"tag":209,"props":80390,"children":80391},{"style":263},[80392],{"type":26,"value":17698},{"type":21,"tag":209,"props":80394,"children":80395},{"style":222},[80396],{"type":26,"value":241},{"type":21,"tag":209,"props":80398,"children":80400},{"class":211,"line":80399},382,[80401,80405,80409,80413,80417,80421,80425],{"type":21,"tag":209,"props":80402,"children":80403},{"style":216},[80404],{"type":26,"value":5925},{"type":21,"tag":209,"props":80406,"children":80407},{"style":222},[80408],{"type":26,"value":50079},{"type":21,"tag":209,"props":80410,"children":80411},{"style":216},[80412],{"type":26,"value":1432},{"type":21,"tag":209,"props":80414,"children":80415},{"style":360},[80416],{"type":26,"value":49968},{"type":21,"tag":209,"props":80418,"children":80419},{"style":222},[80420],{"type":26,"value":368},{"type":21,"tag":209,"props":80422,"children":80423},{"style":263},[80424],{"type":26,"value":2508},{"type":21,"tag":209,"props":80426,"children":80427},{"style":222},[80428],{"type":26,"value":10277},{"type":21,"tag":209,"props":80430,"children":80432},{"class":211,"line":80431},383,[80433,80438,80442,80446,80450,80454,80459],{"type":21,"tag":209,"props":80434,"children":80435},{"style":222},[80436],{"type":26,"value":80437},"            hup ",{"type":21,"tag":209,"props":80439,"children":80440},{"style":216},[80441],{"type":26,"value":1432},{"type":21,"tag":209,"props":80443,"children":80444},{"style":222},[80445],{"type":26,"value":50116},{"type":21,"tag":209,"props":80447,"children":80448},{"style":360},[80449],{"type":26,"value":2863},{"type":21,"tag":209,"props":80451,"children":80452},{"style":222},[80453],{"type":26,"value":368},{"type":21,"tag":209,"props":80455,"children":80456},{"style":233},[80457],{"type":26,"value":80458},"'hup'",{"type":21,"tag":209,"props":80460,"children":80461},{"style":222},[80462],{"type":26,"value":2608},{"type":21,"tag":209,"props":80464,"children":80466},{"class":211,"line":80465},384,[80467,80471,80475,80479],{"type":21,"tag":209,"props":80468,"children":80469},{"style":216},[80470],{"type":26,"value":5803},{"type":21,"tag":209,"props":80472,"children":80473},{"style":222},[80474],{"type":26,"value":4776},{"type":21,"tag":209,"props":80476,"children":80477},{"style":216},[80478],{"type":26,"value":15052},{"type":21,"tag":209,"props":80480,"children":80481},{"style":222},[80482],{"type":26,"value":80483},"hup)\n",{"type":21,"tag":209,"props":80485,"children":80487},{"class":211,"line":80486},385,[80488],{"type":21,"tag":209,"props":80489,"children":80490},{"style":222},[80491],{"type":26,"value":7561},{"type":21,"tag":209,"props":80493,"children":80495},{"class":211,"line":80494},386,[80496,80501,80505,80509,80513,80517,80521,80525],{"type":21,"tag":209,"props":80497,"children":80498},{"style":222},[80499],{"type":26,"value":80500},"            $this.",{"type":21,"tag":209,"props":80502,"children":80503},{"style":360},[80504],{"type":26,"value":2863},{"type":21,"tag":209,"props":80506,"children":80507},{"style":222},[80508],{"type":26,"value":368},{"type":21,"tag":209,"props":80510,"children":80511},{"style":233},[80512],{"type":26,"value":80458},{"type":21,"tag":209,"props":80514,"children":80515},{"style":222},[80516],{"type":26,"value":408},{"type":21,"tag":209,"props":80518,"children":80519},{"style":216},[80520],{"type":26,"value":21569},{"type":21,"tag":209,"props":80522,"children":80523},{"style":360},[80524],{"type":26,"value":73618},{"type":21,"tag":209,"props":80526,"children":80527},{"style":222},[80528],{"type":26,"value":80529},"(options));\n",{"type":21,"tag":209,"props":80531,"children":80533},{"class":211,"line":80532},387,[80534],{"type":21,"tag":209,"props":80535,"children":80536},{"style":222},[80537],{"type":26,"value":2235},{"type":21,"tag":209,"props":80539,"children":80541},{"class":211,"line":80540},388,[80542,80546,80551,80556,80560,80564],{"type":21,"tag":209,"props":80543,"children":80544},{"style":216},[80545],{"type":26,"value":26146},{"type":21,"tag":209,"props":80547,"children":80548},{"style":216},[80549],{"type":26,"value":80550}," if",{"type":21,"tag":209,"props":80552,"children":80553},{"style":222},[80554],{"type":26,"value":80555}," (hup ",{"type":21,"tag":209,"props":80557,"children":80558},{"style":216},[80559],{"type":26,"value":49963},{"type":21,"tag":209,"props":80561,"children":80562},{"style":360},[80563],{"type":26,"value":73618},{"type":21,"tag":209,"props":80565,"children":80566},{"style":222},[80567],{"type":26,"value":10112},{"type":21,"tag":209,"props":80569,"children":80571},{"class":211,"line":80570},389,[80572],{"type":21,"tag":209,"props":80573,"children":80574},{"style":222},[80575],{"type":26,"value":7561},{"type":21,"tag":209,"props":80577,"children":80579},{"class":211,"line":80578},390,[80580,80585,80589],{"type":21,"tag":209,"props":80581,"children":80582},{"style":222},[80583],{"type":26,"value":80584},"            hup.",{"type":21,"tag":209,"props":80586,"children":80587},{"style":360},[80588],{"type":26,"value":51199},{"type":21,"tag":209,"props":80590,"children":80591},{"style":222},[80592],{"type":26,"value":73650},{"type":21,"tag":209,"props":80594,"children":80596},{"class":211,"line":80595},391,[80597],{"type":21,"tag":209,"props":80598,"children":80599},{"style":222},[80600],{"type":26,"value":2235},{"type":21,"tag":209,"props":80602,"children":80604},{"class":211,"line":80603},392,[80605],{"type":21,"tag":209,"props":80606,"children":80607},{"style":222},[80608],{"type":26,"value":3391},{"type":21,"tag":209,"props":80610,"children":80612},{"class":211,"line":80611},393,[80613],{"type":21,"tag":209,"props":80614,"children":80615},{"style":222},[80616],{"type":26,"value":340},{"type":21,"tag":209,"props":80618,"children":80620},{"class":211,"line":80619},394,[80621],{"type":21,"tag":209,"props":80622,"children":80623},{"style":222},[80624],{"type":26,"value":50721},{"type":21,"tag":3490,"props":80626,"children":80627},{},[80628],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":80630},[80631,80632,80633,80634],{"id":70577,"depth":244,"text":70580},{"id":71072,"depth":244,"text":71075},{"id":72310,"depth":244,"text":72313},{"id":14920,"depth":244,"text":14923},"content:ckeefer:2014-2:ajax-upload-2.md","ckeefer/2014-2/ajax-upload-2.md","ckeefer/2014-2/ajax-upload-2",{"user":3518,"name":3519},{"_path":80640,"_dir":80641,"_draft":7,"_partial":7,"_locale":8,"title":80642,"description":80643,"publishDate":80644,"categories":80645,"tags":80646,"image":80648,"excerpt":80643,"body":80649,"_type":3511,"_id":84027,"_source":3513,"_file":84028,"_stem":84029,"_extension":3516,"author":84030},"/ckeefer/2013-3/ajax-upload","2013-3","Ajax Upload Part I: Framed (and jQuery Deferred)","Inevitably, people want their files on the Internet. If your project is about cute cats, someone will task you with allowing users to upload photos of their cats, videos of their cats, long rambling audio clips in which they attempt to convince their cat to stop attacking the microphone, etcetera. If your project is about the nature and proclivities of mold, someone, somewhere will want to share detailed photographic evidence of their mold problem. The need to upload files is a given.","2013-03-20",[46735],[12,13804,80647],"html5","/ckeefer/2013-3/img/upframe.jpg",{"type":18,"children":80650,"toc":84020},[80651,80665,80687,80692,80697,80703,80708,80713,80897,80902,81248,81253,81259,81264,81278,81398,81410,81416,81421,81683,81695,81853,81858,82231,82236,82554,82559,82565,82570,82576,82581,84016],{"type":21,"tag":22,"props":80652,"children":80653},{},[80654,80656,80663],{"type":26,"value":80655},"Inevitably, people want their files on the Internet. If your project is about cute cats, someone will task you with allowing users to upload photos of their cats, videos of their cats, long rambling audio clips in which they attempt to convince their cat to stop attacking the microphone, etcetera. If your project is about the nature and proclivities of mold, ",{"type":21,"tag":29,"props":80657,"children":80660},{"href":80658,"rel":80659},"http://beta.photobucket.com/img/mold+spores/",[93],[80661],{"type":26,"value":80662},"someone, somewhere",{"type":26,"value":80664}," will want to share detailed photographic evidence of their mold problem. The need to upload files is a given.",{"type":21,"tag":22,"props":80666,"children":80667},{},[80668,80670,80677,80679,80685],{"type":26,"value":80669},"Despite that, uploading files has long been one of the roughest aspects of interaction with the web – requiring form submission, and the requisite UI-lockup and page reload, or else some form of plugin intervention (such as Flash). ",{"type":21,"tag":29,"props":80671,"children":80674},{"href":80672,"rel":80673},"http://www.w3.org/TR/XMLHttpRequest2/",[93],[80675],{"type":26,"value":80676},"This is changing",{"type":26,"value":80678}," – with the new XMLHttpRequest level 2 spec, coupled with the ",{"type":21,"tag":29,"props":80680,"children":80682},{"href":72330,"rel":80681},[93],[80683],{"type":26,"value":80684},"File API",{"type":26,"value":80686},", all supporting browsers will be able to cleanly and neatly retrieve a file from the user's local file system and upload it to the web – no page reloads, beautifully asynchronous. We will be focusing on just how to take advantage of these new developments in part II.",{"type":21,"tag":22,"props":80688,"children":80689},{},[80690],{"type":26,"value":80691},"For now, though, let's say you have to support an older browser (\u003C= IE9, for instance). You don't want to have to employ Flash – its a security risk (a topic for another post), and not supported by all mobile browsers or devices; but you want to avoid the deleterious standard behaviour of a form submission. Or maybe there's some other need for a form submission that works like an ajax request (I'll get into that later).",{"type":21,"tag":22,"props":80693,"children":80694},{},[80695],{"type":26,"value":80696},"Aha, I say – its time for a little iframe trick, then.",{"type":21,"tag":3549,"props":80698,"children":80700},{"id":80699},"the-trick",[80701],{"type":26,"value":80702},"The Trick",{"type":21,"tag":22,"props":80704,"children":80705},{},[80706],{"type":26,"value":80707},"Situation: We need to submit a form transparently (to the user), and get the result (so that we know when our file has finished uploading, for instance). We don't want to lock up the UI or reload the page. So, instead of submitting our form within the page, we will submit it within an iframe.",{"type":21,"tag":22,"props":80709,"children":80710},{},[80711],{"type":26,"value":80712},"Say you have a form like this:",{"type":21,"tag":200,"props":80714,"children":80716},{"className":7947,"code":80715,"language":7949,"meta":8,"style":8},"\u003Cform id=\"uploadForm\" action=\"/upload/url\" enctype=\"multipart/form-data\" method=\"POST\">\n    \u003Cinput type=\"file\" name=\"uploadLocalImage\" accept=\"image/*\" />\n    \u003Cinput type=\"submit\" value=\"Submit\" />\n\u003C/form>\n",[80717],{"type":21,"tag":63,"props":80718,"children":80719},{"__ignoreMap":8},[80720,80788,80842,80882],{"type":21,"tag":209,"props":80721,"children":80722},{"class":211,"line":212},[80723,80727,80731,80735,80739,80744,80748,80752,80757,80762,80766,80771,80775,80779,80784],{"type":21,"tag":209,"props":80724,"children":80725},{"style":222},[80726],{"type":26,"value":1985},{"type":21,"tag":209,"props":80728,"children":80729},{"style":1988},[80730],{"type":26,"value":24477},{"type":21,"tag":209,"props":80732,"children":80733},{"style":360},[80734],{"type":26,"value":24498},{"type":21,"tag":209,"props":80736,"children":80737},{"style":222},[80738],{"type":26,"value":1432},{"type":21,"tag":209,"props":80740,"children":80741},{"style":233},[80742],{"type":26,"value":80743},"\"uploadForm\"",{"type":21,"tag":209,"props":80745,"children":80746},{"style":360},[80747],{"type":26,"value":33852},{"type":21,"tag":209,"props":80749,"children":80750},{"style":222},[80751],{"type":26,"value":1432},{"type":21,"tag":209,"props":80753,"children":80754},{"style":233},[80755],{"type":26,"value":80756},"\"/upload/url\"",{"type":21,"tag":209,"props":80758,"children":80759},{"style":360},[80760],{"type":26,"value":80761}," enctype",{"type":21,"tag":209,"props":80763,"children":80764},{"style":222},[80765],{"type":26,"value":1432},{"type":21,"tag":209,"props":80767,"children":80768},{"style":233},[80769],{"type":26,"value":80770},"\"multipart/form-data\"",{"type":21,"tag":209,"props":80772,"children":80773},{"style":360},[80774],{"type":26,"value":33898},{"type":21,"tag":209,"props":80776,"children":80777},{"style":222},[80778],{"type":26,"value":1432},{"type":21,"tag":209,"props":80780,"children":80781},{"style":233},[80782],{"type":26,"value":80783},"\"POST\"",{"type":21,"tag":209,"props":80785,"children":80786},{"style":222},[80787],{"type":26,"value":1996},{"type":21,"tag":209,"props":80789,"children":80790},{"class":211,"line":244},[80791,80795,80799,80803,80807,80811,80815,80819,80824,80829,80833,80838],{"type":21,"tag":209,"props":80792,"children":80793},{"style":222},[80794],{"type":26,"value":2004},{"type":21,"tag":209,"props":80796,"children":80797},{"style":1988},[80798],{"type":26,"value":34026},{"type":21,"tag":209,"props":80800,"children":80801},{"style":360},[80802],{"type":26,"value":24544},{"type":21,"tag":209,"props":80804,"children":80805},{"style":222},[80806],{"type":26,"value":1432},{"type":21,"tag":209,"props":80808,"children":80809},{"style":233},[80810],{"type":26,"value":70659},{"type":21,"tag":209,"props":80812,"children":80813},{"style":360},[80814],{"type":26,"value":8099},{"type":21,"tag":209,"props":80816,"children":80817},{"style":222},[80818],{"type":26,"value":1432},{"type":21,"tag":209,"props":80820,"children":80821},{"style":233},[80822],{"type":26,"value":80823},"\"uploadLocalImage\"",{"type":21,"tag":209,"props":80825,"children":80826},{"style":360},[80827],{"type":26,"value":80828}," accept",{"type":21,"tag":209,"props":80830,"children":80831},{"style":222},[80832],{"type":26,"value":1432},{"type":21,"tag":209,"props":80834,"children":80835},{"style":233},[80836],{"type":26,"value":80837},"\"image/*\"",{"type":21,"tag":209,"props":80839,"children":80840},{"style":222},[80841],{"type":26,"value":8127},{"type":21,"tag":209,"props":80843,"children":80844},{"class":211,"line":254},[80845,80849,80853,80857,80861,80865,80869,80873,80878],{"type":21,"tag":209,"props":80846,"children":80847},{"style":222},[80848],{"type":26,"value":2004},{"type":21,"tag":209,"props":80850,"children":80851},{"style":1988},[80852],{"type":26,"value":34026},{"type":21,"tag":209,"props":80854,"children":80855},{"style":360},[80856],{"type":26,"value":24544},{"type":21,"tag":209,"props":80858,"children":80859},{"style":222},[80860],{"type":26,"value":1432},{"type":21,"tag":209,"props":80862,"children":80863},{"style":233},[80864],{"type":26,"value":24553},{"type":21,"tag":209,"props":80866,"children":80867},{"style":360},[80868],{"type":26,"value":34080},{"type":21,"tag":209,"props":80870,"children":80871},{"style":222},[80872],{"type":26,"value":1432},{"type":21,"tag":209,"props":80874,"children":80875},{"style":233},[80876],{"type":26,"value":80877},"\"Submit\"",{"type":21,"tag":209,"props":80879,"children":80880},{"style":222},[80881],{"type":26,"value":8127},{"type":21,"tag":209,"props":80883,"children":80884},{"class":211,"line":279},[80885,80889,80893],{"type":21,"tag":209,"props":80886,"children":80887},{"style":222},[80888],{"type":26,"value":2024},{"type":21,"tag":209,"props":80890,"children":80891},{"style":1988},[80892],{"type":26,"value":24477},{"type":21,"tag":209,"props":80894,"children":80895},{"style":222},[80896],{"type":26,"value":1996},{"type":21,"tag":22,"props":80898,"children":80899},{},[80900],{"type":26,"value":80901},"The user selects the file they want to upload, and clicks submit. We want to upload the file, and expect a json response telling us something (new location of the file, number of MB left for uploading files, etc.)",{"type":21,"tag":200,"props":80903,"children":80905},{"className":9044,"code":80904,"language":9046,"meta":8,"style":8},"$('#uploadForm').on('submit', function(event){\n// Check to see if target is defined before we cancel the default event - this allows us to use the html5 checkValidity function on a form if we so desire, or perform any other checks.\nif ($(this).attr('target') === undefined)\n{\n    event.preventDefault();\n    this.checkValidity(); // See \u003Ca href=\"http://www.whatwg.org/specs/web-apps/current-work/multipage/forms.html#dom-form- checkvalidity\">checkValidity\u003C/a>; for more details. This probably isn't necessary on a file upload, but might be desirable for other form submissions.\n$.transparentSubmit({\n    dataType:'json',\n    form:this\n}).done(function(response){\n// Woo, completed successfully! Do something with the response.\n    console.log(response);\n}).fail(function(e){\n// Aww, our call failed. :( Do something with the failure message.\n    console.log(e);\n});\n}\n});\n",[80906],{"type":21,"tag":63,"props":80907,"children":80908},{"__ignoreMap":8},[80909,80962,80970,81028,81035,81050,81075,81091,81106,81119,81150,81158,81173,81204,81212,81227,81234,81241],{"type":21,"tag":209,"props":80910,"children":80911},{"class":211,"line":212},[80912,80916,80920,80925,80929,80933,80937,80942,80946,80950,80954,80958],{"type":21,"tag":209,"props":80913,"children":80914},{"style":360},[80915],{"type":26,"value":10250},{"type":21,"tag":209,"props":80917,"children":80918},{"style":222},[80919],{"type":26,"value":368},{"type":21,"tag":209,"props":80921,"children":80922},{"style":233},[80923],{"type":26,"value":80924},"'#uploadForm'",{"type":21,"tag":209,"props":80926,"children":80927},{"style":222},[80928],{"type":26,"value":2699},{"type":21,"tag":209,"props":80930,"children":80931},{"style":360},[80932],{"type":26,"value":363},{"type":21,"tag":209,"props":80934,"children":80935},{"style":222},[80936],{"type":26,"value":368},{"type":21,"tag":209,"props":80938,"children":80939},{"style":233},[80940],{"type":26,"value":80941},"'submit'",{"type":21,"tag":209,"props":80943,"children":80944},{"style":222},[80945],{"type":26,"value":408},{"type":21,"tag":209,"props":80947,"children":80948},{"style":216},[80949],{"type":26,"value":5370},{"type":21,"tag":209,"props":80951,"children":80952},{"style":222},[80953],{"type":26,"value":368},{"type":21,"tag":209,"props":80955,"children":80956},{"style":400},[80957],{"type":26,"value":10794},{"type":21,"tag":209,"props":80959,"children":80960},{"style":222},[80961],{"type":26,"value":2369},{"type":21,"tag":209,"props":80963,"children":80964},{"class":211,"line":244},[80965],{"type":21,"tag":209,"props":80966,"children":80967},{"style":448},[80968],{"type":26,"value":80969},"// Check to see if target is defined before we cancel the default event - this allows us to use the html5 checkValidity function on a form if we so desire, or perform any other checks.\n",{"type":21,"tag":209,"props":80971,"children":80972},{"class":211,"line":254},[80973,80977,80981,80985,80989,80993,80997,81002,81006,81011,81015,81019,81024],{"type":21,"tag":209,"props":80974,"children":80975},{"style":216},[80976],{"type":26,"value":43437},{"type":21,"tag":209,"props":80978,"children":80979},{"style":222},[80980],{"type":26,"value":4776},{"type":21,"tag":209,"props":80982,"children":80983},{"style":360},[80984],{"type":26,"value":10250},{"type":21,"tag":209,"props":80986,"children":80987},{"style":222},[80988],{"type":26,"value":368},{"type":21,"tag":209,"props":80990,"children":80991},{"style":263},[80992],{"type":26,"value":2508},{"type":21,"tag":209,"props":80994,"children":80995},{"style":222},[80996],{"type":26,"value":2699},{"type":21,"tag":209,"props":80998,"children":80999},{"style":360},[81000],{"type":26,"value":81001},"attr",{"type":21,"tag":209,"props":81003,"children":81004},{"style":222},[81005],{"type":26,"value":368},{"type":21,"tag":209,"props":81007,"children":81008},{"style":233},[81009],{"type":26,"value":81010},"'target'",{"type":21,"tag":209,"props":81012,"children":81013},{"style":222},[81014],{"type":26,"value":432},{"type":21,"tag":209,"props":81016,"children":81017},{"style":216},[81018],{"type":26,"value":6102},{"type":21,"tag":209,"props":81020,"children":81021},{"style":263},[81022],{"type":26,"value":81023}," undefined",{"type":21,"tag":209,"props":81025,"children":81026},{"style":222},[81027],{"type":26,"value":10112},{"type":21,"tag":209,"props":81029,"children":81030},{"class":211,"line":279},[81031],{"type":21,"tag":209,"props":81032,"children":81033},{"style":222},[81034],{"type":26,"value":7414},{"type":21,"tag":209,"props":81036,"children":81037},{"class":211,"line":288},[81038,81042,81046],{"type":21,"tag":209,"props":81039,"children":81040},{"style":222},[81041],{"type":26,"value":11587},{"type":21,"tag":209,"props":81043,"children":81044},{"style":360},[81045],{"type":26,"value":70849},{"type":21,"tag":209,"props":81047,"children":81048},{"style":222},[81049],{"type":26,"value":4842},{"type":21,"tag":209,"props":81051,"children":81052},{"class":211,"line":307},[81053,81057,81061,81066,81070],{"type":21,"tag":209,"props":81054,"children":81055},{"style":263},[81056],{"type":26,"value":51112},{"type":21,"tag":209,"props":81058,"children":81059},{"style":222},[81060],{"type":26,"value":378},{"type":21,"tag":209,"props":81062,"children":81063},{"style":360},[81064],{"type":26,"value":81065},"checkValidity",{"type":21,"tag":209,"props":81067,"children":81068},{"style":222},[81069],{"type":26,"value":38473},{"type":21,"tag":209,"props":81071,"children":81072},{"style":448},[81073],{"type":26,"value":81074},"// See \u003Ca href=\"http://www.whatwg.org/specs/web-apps/current-work/multipage/forms.html#dom-form- checkvalidity\">checkValidity\u003C/a>; for more details. This probably isn't necessary on a file upload, but might be desirable for other form submissions.\n",{"type":21,"tag":209,"props":81076,"children":81077},{"class":211,"line":325},[81078,81082,81087],{"type":21,"tag":209,"props":81079,"children":81080},{"style":222},[81081],{"type":26,"value":17973},{"type":21,"tag":209,"props":81083,"children":81084},{"style":360},[81085],{"type":26,"value":81086},"transparentSubmit",{"type":21,"tag":209,"props":81088,"children":81089},{"style":222},[81090],{"type":26,"value":17983},{"type":21,"tag":209,"props":81092,"children":81093},{"class":211,"line":334},[81094,81098,81102],{"type":21,"tag":209,"props":81095,"children":81096},{"style":222},[81097],{"type":26,"value":18024},{"type":21,"tag":209,"props":81099,"children":81100},{"style":233},[81101],{"type":26,"value":24189},{"type":21,"tag":209,"props":81103,"children":81104},{"style":222},[81105],{"type":26,"value":304},{"type":21,"tag":209,"props":81107,"children":81108},{"class":211,"line":343},[81109,81114],{"type":21,"tag":209,"props":81110,"children":81111},{"style":222},[81112],{"type":26,"value":81113},"    form:",{"type":21,"tag":209,"props":81115,"children":81116},{"style":263},[81117],{"type":26,"value":81118},"this\n",{"type":21,"tag":209,"props":81120,"children":81121},{"class":211,"line":351},[81122,81126,81130,81134,81138,81142,81146],{"type":21,"tag":209,"props":81123,"children":81124},{"style":222},[81125],{"type":26,"value":18037},{"type":21,"tag":209,"props":81127,"children":81128},{"style":360},[81129],{"type":26,"value":18042},{"type":21,"tag":209,"props":81131,"children":81132},{"style":222},[81133],{"type":26,"value":368},{"type":21,"tag":209,"props":81135,"children":81136},{"style":216},[81137],{"type":26,"value":5370},{"type":21,"tag":209,"props":81139,"children":81140},{"style":222},[81141],{"type":26,"value":368},{"type":21,"tag":209,"props":81143,"children":81144},{"style":400},[81145],{"type":26,"value":12498},{"type":21,"tag":209,"props":81147,"children":81148},{"style":222},[81149],{"type":26,"value":2369},{"type":21,"tag":209,"props":81151,"children":81152},{"class":211,"line":444},[81153],{"type":21,"tag":209,"props":81154,"children":81155},{"style":448},[81156],{"type":26,"value":81157},"// Woo, completed successfully! Do something with the response.\n",{"type":21,"tag":209,"props":81159,"children":81160},{"class":211,"line":454},[81161,81165,81169],{"type":21,"tag":209,"props":81162,"children":81163},{"style":222},[81164],{"type":26,"value":1054},{"type":21,"tag":209,"props":81166,"children":81167},{"style":360},[81168],{"type":26,"value":1059},{"type":21,"tag":209,"props":81170,"children":81171},{"style":222},[81172],{"type":26,"value":14890},{"type":21,"tag":209,"props":81174,"children":81175},{"class":211,"line":463},[81176,81180,81184,81188,81192,81196,81200],{"type":21,"tag":209,"props":81177,"children":81178},{"style":222},[81179],{"type":26,"value":18037},{"type":21,"tag":209,"props":81181,"children":81182},{"style":360},[81183],{"type":26,"value":18091},{"type":21,"tag":209,"props":81185,"children":81186},{"style":222},[81187],{"type":26,"value":368},{"type":21,"tag":209,"props":81189,"children":81190},{"style":216},[81191],{"type":26,"value":5370},{"type":21,"tag":209,"props":81193,"children":81194},{"style":222},[81195],{"type":26,"value":368},{"type":21,"tag":209,"props":81197,"children":81198},{"style":400},[81199],{"type":26,"value":5947},{"type":21,"tag":209,"props":81201,"children":81202},{"style":222},[81203],{"type":26,"value":2369},{"type":21,"tag":209,"props":81205,"children":81206},{"class":211,"line":472},[81207],{"type":21,"tag":209,"props":81208,"children":81209},{"style":448},[81210],{"type":26,"value":81211},"// Aww, our call failed. :( Do something with the failure message.\n",{"type":21,"tag":209,"props":81213,"children":81214},{"class":211,"line":480},[81215,81219,81223],{"type":21,"tag":209,"props":81216,"children":81217},{"style":222},[81218],{"type":26,"value":1054},{"type":21,"tag":209,"props":81220,"children":81221},{"style":360},[81222],{"type":26,"value":1059},{"type":21,"tag":209,"props":81224,"children":81225},{"style":222},[81226],{"type":26,"value":30925},{"type":21,"tag":209,"props":81228,"children":81229},{"class":211,"line":489},[81230],{"type":21,"tag":209,"props":81231,"children":81232},{"style":222},[81233],{"type":26,"value":469},{"type":21,"tag":209,"props":81235,"children":81236},{"class":211,"line":847},[81237],{"type":21,"tag":209,"props":81238,"children":81239},{"style":222},[81240],{"type":26,"value":7798},{"type":21,"tag":209,"props":81242,"children":81243},{"class":211,"line":860},[81244],{"type":21,"tag":209,"props":81245,"children":81246},{"style":222},[81247],{"type":26,"value":469},{"type":21,"tag":22,"props":81249,"children":81250},{},[81251],{"type":26,"value":81252},"Looks pretty simple, right? It's missing something, though - what's this $.transparentSubmit thing? It might look familiar if you're used to $.ajax - we're using the same nice, neat callback style via $.Deferred.",{"type":21,"tag":3549,"props":81254,"children":81256},{"id":81255},"aside-deferred",[81257],{"type":26,"value":81258},"Aside: $.Deferred",{"type":21,"tag":22,"props":81260,"children":81261},{},[81262],{"type":26,"value":81263},"jQuery offers us a very powerful tool for perfoming asynchronous calls, following the Promise pattern, in the form of $.Deferred. jQuery's ajax implements deferred as a way of offering us chainable callbacks (in the form of .done on success, .fail on failure, .always no matter the result, as well as waiting on multiple sucessful calls with .when, and chaining calls together with .then).",{"type":21,"tag":22,"props":81265,"children":81266},{},[81267,81269,81276],{"type":26,"value":81268},"This is all kinds of good, and could fill a post on its own (see ",{"type":21,"tag":29,"props":81270,"children":81273},{"href":81271,"rel":81272},"http://www.html5rocks.com/en/tutorials/async/deferred/",[93],[81274],{"type":26,"value":81275},"this post",{"type":26,"value":81277}," for example). For now, suffice to say that since we want our transparent form submission to work like an ajax call, it makes perfect sense for it to look and operate like one, too. It opens up neat possibilities - say we need the results of our form submission and a seperate ajax call before we proceed:",{"type":21,"tag":200,"props":81279,"children":81281},{"className":9044,"code":81280,"language":9046,"meta":8,"style":8},"$.when($('#myForm').transparentSubmit({}), $.ajax({url:'/ajax/page'}))\n.done(function(res1, res2){\n// Do something with the responses from both of our asynch calls\n});\n\n",[81282],{"type":21,"tag":63,"props":81283,"children":81284},{"__ignoreMap":8},[81285,81344,81383,81391],{"type":21,"tag":209,"props":81286,"children":81287},{"class":211,"line":212},[81288,81292,81296,81300,81304,81308,81313,81317,81321,81326,81330,81334,81339],{"type":21,"tag":209,"props":81289,"children":81290},{"style":222},[81291],{"type":26,"value":17973},{"type":21,"tag":209,"props":81293,"children":81294},{"style":360},[81295],{"type":26,"value":40615},{"type":21,"tag":209,"props":81297,"children":81298},{"style":222},[81299],{"type":26,"value":368},{"type":21,"tag":209,"props":81301,"children":81302},{"style":360},[81303],{"type":26,"value":10250},{"type":21,"tag":209,"props":81305,"children":81306},{"style":222},[81307],{"type":26,"value":368},{"type":21,"tag":209,"props":81309,"children":81310},{"style":233},[81311],{"type":26,"value":81312},"'#myForm'",{"type":21,"tag":209,"props":81314,"children":81315},{"style":222},[81316],{"type":26,"value":2699},{"type":21,"tag":209,"props":81318,"children":81319},{"style":360},[81320],{"type":26,"value":81086},{"type":21,"tag":209,"props":81322,"children":81323},{"style":222},[81324],{"type":26,"value":81325},"({}), $.",{"type":21,"tag":209,"props":81327,"children":81328},{"style":360},[81329],{"type":26,"value":17978},{"type":21,"tag":209,"props":81331,"children":81332},{"style":222},[81333],{"type":26,"value":43039},{"type":21,"tag":209,"props":81335,"children":81336},{"style":233},[81337],{"type":26,"value":81338},"'/ajax/page'",{"type":21,"tag":209,"props":81340,"children":81341},{"style":222},[81342],{"type":26,"value":81343},"}))\n",{"type":21,"tag":209,"props":81345,"children":81346},{"class":211,"line":244},[81347,81351,81355,81359,81363,81367,81371,81375,81379],{"type":21,"tag":209,"props":81348,"children":81349},{"style":222},[81350],{"type":26,"value":378},{"type":21,"tag":209,"props":81352,"children":81353},{"style":360},[81354],{"type":26,"value":18042},{"type":21,"tag":209,"props":81356,"children":81357},{"style":222},[81358],{"type":26,"value":368},{"type":21,"tag":209,"props":81360,"children":81361},{"style":216},[81362],{"type":26,"value":5370},{"type":21,"tag":209,"props":81364,"children":81365},{"style":222},[81366],{"type":26,"value":368},{"type":21,"tag":209,"props":81368,"children":81369},{"style":400},[81370],{"type":26,"value":3341},{"type":21,"tag":209,"props":81372,"children":81373},{"style":222},[81374],{"type":26,"value":408},{"type":21,"tag":209,"props":81376,"children":81377},{"style":400},[81378],{"type":26,"value":3350},{"type":21,"tag":209,"props":81380,"children":81381},{"style":222},[81382],{"type":26,"value":2369},{"type":21,"tag":209,"props":81384,"children":81385},{"class":211,"line":254},[81386],{"type":21,"tag":209,"props":81387,"children":81388},{"style":448},[81389],{"type":26,"value":81390},"// Do something with the responses from both of our asynch calls\n",{"type":21,"tag":209,"props":81392,"children":81393},{"class":211,"line":279},[81394],{"type":21,"tag":209,"props":81395,"children":81396},{"style":222},[81397],{"type":26,"value":469},{"type":21,"tag":22,"props":81399,"children":81400},{},[81401,81402,81408],{"type":26,"value":40078},{"type":21,"tag":29,"props":81403,"children":81405},{"href":39305,"rel":81404},[93],[81406],{"type":26,"value":81407},"jQuery docs",{"type":26,"value":81409}," for more details.",{"type":21,"tag":3549,"props":81411,"children":81413},{"id":81412},"breakdown",[81414],{"type":26,"value":81415},"Breakdown",{"type":21,"tag":22,"props":81417,"children":81418},{},[81419],{"type":26,"value":81420},"So just how does this transparentSubmit thing work, then? Let's go through it a few pieces at a time.",{"type":21,"tag":200,"props":81422,"children":81424},{"className":9044,"code":81423,"language":9046,"meta":8,"style":8},"var defer = $.Deferred(),\noptions = $.extend({\n    dataType:'json'\n}, (options || {})),\nname = 'target-'+Math.random().toString(36).substring(7),\nhiframe = $(''),\nform = $(options.form),\ncleanup = function(){\n    hiframe.remove();\n    delete frames[name];\n};\n",[81425],{"type":21,"tag":63,"props":81426,"children":81427},{"__ignoreMap":8},[81428,81455,81479,81490,81507,81578,81606,81627,81647,81663,81676],{"type":21,"tag":209,"props":81429,"children":81430},{"class":211,"line":212},[81431,81435,81439,81443,81447,81451],{"type":21,"tag":209,"props":81432,"children":81433},{"style":216},[81434],{"type":26,"value":8996},{"type":21,"tag":209,"props":81436,"children":81437},{"style":222},[81438],{"type":26,"value":28080},{"type":21,"tag":209,"props":81440,"children":81441},{"style":216},[81442],{"type":26,"value":1432},{"type":21,"tag":209,"props":81444,"children":81445},{"style":222},[81446],{"type":26,"value":26905},{"type":21,"tag":209,"props":81448,"children":81449},{"style":360},[81450],{"type":26,"value":26910},{"type":21,"tag":209,"props":81452,"children":81453},{"style":222},[81454],{"type":26,"value":5405},{"type":21,"tag":209,"props":81456,"children":81457},{"class":211,"line":244},[81458,81463,81467,81471,81475],{"type":21,"tag":209,"props":81459,"children":81460},{"style":222},[81461],{"type":26,"value":81462},"options ",{"type":21,"tag":209,"props":81464,"children":81465},{"style":216},[81466],{"type":26,"value":1432},{"type":21,"tag":209,"props":81468,"children":81469},{"style":222},[81470],{"type":26,"value":26905},{"type":21,"tag":209,"props":81472,"children":81473},{"style":360},[81474],{"type":26,"value":38684},{"type":21,"tag":209,"props":81476,"children":81477},{"style":222},[81478],{"type":26,"value":17983},{"type":21,"tag":209,"props":81480,"children":81481},{"class":211,"line":254},[81482,81486],{"type":21,"tag":209,"props":81483,"children":81484},{"style":222},[81485],{"type":26,"value":18024},{"type":21,"tag":209,"props":81487,"children":81488},{"style":233},[81489],{"type":26,"value":18029},{"type":21,"tag":209,"props":81491,"children":81492},{"class":211,"line":279},[81493,81498,81502],{"type":21,"tag":209,"props":81494,"children":81495},{"style":222},[81496],{"type":26,"value":81497},"}, (options ",{"type":21,"tag":209,"props":81499,"children":81500},{"style":216},[81501],{"type":26,"value":4677},{"type":21,"tag":209,"props":81503,"children":81504},{"style":222},[81505],{"type":26,"value":81506}," {})),\n",{"type":21,"tag":209,"props":81508,"children":81509},{"class":211,"line":288},[81510,81515,81519,81524,81528,81533,81538,81542,81547,81551,81556,81560,81565,81569,81574],{"type":21,"tag":209,"props":81511,"children":81512},{"style":222},[81513],{"type":26,"value":81514},"name ",{"type":21,"tag":209,"props":81516,"children":81517},{"style":216},[81518],{"type":26,"value":1432},{"type":21,"tag":209,"props":81520,"children":81521},{"style":233},[81522],{"type":26,"value":81523}," 'target-'",{"type":21,"tag":209,"props":81525,"children":81526},{"style":216},[81527],{"type":26,"value":10237},{"type":21,"tag":209,"props":81529,"children":81530},{"style":222},[81531],{"type":26,"value":81532},"Math.",{"type":21,"tag":209,"props":81534,"children":81535},{"style":360},[81536],{"type":26,"value":81537},"random",{"type":21,"tag":209,"props":81539,"children":81540},{"style":222},[81541],{"type":26,"value":11910},{"type":21,"tag":209,"props":81543,"children":81544},{"style":360},[81545],{"type":26,"value":81546},"toString",{"type":21,"tag":209,"props":81548,"children":81549},{"style":222},[81550],{"type":26,"value":368},{"type":21,"tag":209,"props":81552,"children":81553},{"style":263},[81554],{"type":26,"value":81555},"36",{"type":21,"tag":209,"props":81557,"children":81558},{"style":222},[81559],{"type":26,"value":2699},{"type":21,"tag":209,"props":81561,"children":81562},{"style":360},[81563],{"type":26,"value":81564},"substring",{"type":21,"tag":209,"props":81566,"children":81567},{"style":222},[81568],{"type":26,"value":368},{"type":21,"tag":209,"props":81570,"children":81571},{"style":263},[81572],{"type":26,"value":81573},"7",{"type":21,"tag":209,"props":81575,"children":81576},{"style":222},[81577],{"type":26,"value":10277},{"type":21,"tag":209,"props":81579,"children":81580},{"class":211,"line":307},[81581,81586,81590,81594,81598,81602],{"type":21,"tag":209,"props":81582,"children":81583},{"style":222},[81584],{"type":26,"value":81585},"hiframe ",{"type":21,"tag":209,"props":81587,"children":81588},{"style":216},[81589],{"type":26,"value":1432},{"type":21,"tag":209,"props":81591,"children":81592},{"style":360},[81593],{"type":26,"value":49968},{"type":21,"tag":209,"props":81595,"children":81596},{"style":222},[81597],{"type":26,"value":368},{"type":21,"tag":209,"props":81599,"children":81600},{"style":233},[81601],{"type":26,"value":20111},{"type":21,"tag":209,"props":81603,"children":81604},{"style":222},[81605],{"type":26,"value":10277},{"type":21,"tag":209,"props":81607,"children":81608},{"class":211,"line":325},[81609,81614,81618,81622],{"type":21,"tag":209,"props":81610,"children":81611},{"style":222},[81612],{"type":26,"value":81613},"form ",{"type":21,"tag":209,"props":81615,"children":81616},{"style":216},[81617],{"type":26,"value":1432},{"type":21,"tag":209,"props":81619,"children":81620},{"style":360},[81621],{"type":26,"value":49968},{"type":21,"tag":209,"props":81623,"children":81624},{"style":222},[81625],{"type":26,"value":81626},"(options.form),\n",{"type":21,"tag":209,"props":81628,"children":81629},{"class":211,"line":334},[81630,81635,81639,81643],{"type":21,"tag":209,"props":81631,"children":81632},{"style":360},[81633],{"type":26,"value":81634},"cleanup",{"type":21,"tag":209,"props":81636,"children":81637},{"style":216},[81638],{"type":26,"value":271},{"type":21,"tag":209,"props":81640,"children":81641},{"style":216},[81642],{"type":26,"value":4766},{"type":21,"tag":209,"props":81644,"children":81645},{"style":222},[81646],{"type":26,"value":2561},{"type":21,"tag":209,"props":81648,"children":81649},{"class":211,"line":343},[81650,81655,81659],{"type":21,"tag":209,"props":81651,"children":81652},{"style":222},[81653],{"type":26,"value":81654},"    hiframe.",{"type":21,"tag":209,"props":81656,"children":81657},{"style":360},[81658],{"type":26,"value":52368},{"type":21,"tag":209,"props":81660,"children":81661},{"style":222},[81662],{"type":26,"value":4842},{"type":21,"tag":209,"props":81664,"children":81665},{"class":211,"line":351},[81666,81671],{"type":21,"tag":209,"props":81667,"children":81668},{"style":216},[81669],{"type":26,"value":81670},"    delete",{"type":21,"tag":209,"props":81672,"children":81673},{"style":222},[81674],{"type":26,"value":81675}," frames[name];\n",{"type":21,"tag":209,"props":81677,"children":81678},{"class":211,"line":444},[81679],{"type":21,"tag":209,"props":81680,"children":81681},{"style":222},[81682],{"type":26,"value":340},{"type":21,"tag":22,"props":81684,"children":81685},{},[81686,81688,81693],{"type":26,"value":81687},"At the top we declare our deferred object, get options (which are passed to our plugin function, or else is made an empty object), set a name for the frame, create said iframe, get the form and declare an inline function to do some house-keeping. ",{"type":21,"tag":5270,"props":81689,"children":81690},{},[81691],{"type":26,"value":81692},"Note",{"type":26,"value":81694},": name is assigned a value from Math.random converted to a string using base 36 (0-9a-z) to generate a 5 letter random string we append to 'target-'. This isn't strictly necessary - originally, using the same name for more than one frame would cause us problems, but this is resolved by the call in cleanup to delete the named frame. I've left it in as a neat little trick that someone might be interested in!",{"type":21,"tag":200,"props":81696,"children":81698},{"className":9044,"code":81697,"language":9046,"meta":8,"style":8},"if (!form.length || form[0].tagName !== 'FORM')\n{\ndefer.reject(\"No form element specified to submit.\");\nreturn defer.promise();\n}\n\nform.attr('target', name).append(hiframe);\n",[81699],{"type":21,"tag":63,"props":81700,"children":81701},{"__ignoreMap":8},[81702,81756,81763,81787,81806,81813,81820],{"type":21,"tag":209,"props":81703,"children":81704},{"class":211,"line":212},[81705,81709,81713,81717,81722,81726,81730,81735,81739,81743,81747,81752],{"type":21,"tag":209,"props":81706,"children":81707},{"style":216},[81708],{"type":26,"value":43437},{"type":21,"tag":209,"props":81710,"children":81711},{"style":222},[81712],{"type":26,"value":4776},{"type":21,"tag":209,"props":81714,"children":81715},{"style":216},[81716],{"type":26,"value":15052},{"type":21,"tag":209,"props":81718,"children":81719},{"style":222},[81720],{"type":26,"value":81721},"form.",{"type":21,"tag":209,"props":81723,"children":81724},{"style":263},[81725],{"type":26,"value":36467},{"type":21,"tag":209,"props":81727,"children":81728},{"style":216},[81729],{"type":26,"value":18721},{"type":21,"tag":209,"props":81731,"children":81732},{"style":222},[81733],{"type":26,"value":81734}," form[",{"type":21,"tag":209,"props":81736,"children":81737},{"style":263},[81738],{"type":26,"value":6048},{"type":21,"tag":209,"props":81740,"children":81741},{"style":222},[81742],{"type":26,"value":74457},{"type":21,"tag":209,"props":81744,"children":81745},{"style":216},[81746],{"type":26,"value":12011},{"type":21,"tag":209,"props":81748,"children":81749},{"style":233},[81750],{"type":26,"value":81751}," 'FORM'",{"type":21,"tag":209,"props":81753,"children":81754},{"style":222},[81755],{"type":26,"value":10112},{"type":21,"tag":209,"props":81757,"children":81758},{"class":211,"line":244},[81759],{"type":21,"tag":209,"props":81760,"children":81761},{"style":222},[81762],{"type":26,"value":7414},{"type":21,"tag":209,"props":81764,"children":81765},{"class":211,"line":254},[81766,81770,81774,81778,81783],{"type":21,"tag":209,"props":81767,"children":81768},{"style":222},[81769],{"type":26,"value":39480},{"type":21,"tag":209,"props":81771,"children":81772},{"style":360},[81773],{"type":26,"value":5599},{"type":21,"tag":209,"props":81775,"children":81776},{"style":222},[81777],{"type":26,"value":368},{"type":21,"tag":209,"props":81779,"children":81780},{"style":233},[81781],{"type":26,"value":81782},"\"No form element specified to submit.\"",{"type":21,"tag":209,"props":81784,"children":81785},{"style":222},[81786],{"type":26,"value":2608},{"type":21,"tag":209,"props":81788,"children":81789},{"class":211,"line":279},[81790,81794,81798,81802],{"type":21,"tag":209,"props":81791,"children":81792},{"style":216},[81793],{"type":26,"value":5813},{"type":21,"tag":209,"props":81795,"children":81796},{"style":222},[81797],{"type":26,"value":28259},{"type":21,"tag":209,"props":81799,"children":81800},{"style":360},[81801],{"type":26,"value":27809},{"type":21,"tag":209,"props":81803,"children":81804},{"style":222},[81805],{"type":26,"value":4842},{"type":21,"tag":209,"props":81807,"children":81808},{"class":211,"line":288},[81809],{"type":21,"tag":209,"props":81810,"children":81811},{"style":222},[81812],{"type":26,"value":7798},{"type":21,"tag":209,"props":81814,"children":81815},{"class":211,"line":307},[81816],{"type":21,"tag":209,"props":81817,"children":81818},{"emptyLinePlaceholder":248},[81819],{"type":26,"value":251},{"type":21,"tag":209,"props":81821,"children":81822},{"class":211,"line":325},[81823,81827,81831,81835,81839,81844,81848],{"type":21,"tag":209,"props":81824,"children":81825},{"style":222},[81826],{"type":26,"value":81721},{"type":21,"tag":209,"props":81828,"children":81829},{"style":360},[81830],{"type":26,"value":81001},{"type":21,"tag":209,"props":81832,"children":81833},{"style":222},[81834],{"type":26,"value":368},{"type":21,"tag":209,"props":81836,"children":81837},{"style":233},[81838],{"type":26,"value":81010},{"type":21,"tag":209,"props":81840,"children":81841},{"style":222},[81842],{"type":26,"value":81843},", name).",{"type":21,"tag":209,"props":81845,"children":81846},{"style":360},[81847],{"type":26,"value":51794},{"type":21,"tag":209,"props":81849,"children":81850},{"style":222},[81851],{"type":26,"value":81852},"(hiframe);\n",{"type":21,"tag":22,"props":81854,"children":81855},{},[81856],{"type":26,"value":81857},"We make sure that form is in the DOM and is a form, or else call reject on our deferred object (triggering any .fail attached to our promise). Then, we set the target attribute on the form to point at our iframe, and append the iframe to the form.",{"type":21,"tag":200,"props":81859,"children":81861},{"className":9044,"code":81860,"language":9046,"meta":8,"style":8},"hiframe.on('load', function(){\nvar res;\n\nform.removeAttr('target');\n\ntry{\nif (options.dataType.indexOf('json') != -1)\n{\n    res = frames[name].document.getElementsByTagName(\"pre\")[0].innerHTML;\n}\nelse\n{\n    res = frames[name].document.getElementsByTagName('body')[0].innerHTML;\n}\n}catch(e){\n    // Failed to receive anything in the body of the frame\n    cleanup();\n    defer.reject(\"Failed to receive response in form target \"+name+\": \"+e.message);\n    return;\n}\ncleanup();\n",[81862],{"type":21,"tag":63,"props":81863,"children":81864},{"__ignoreMap":8},[81865,81897,81908,81915,81939,81946,81957,82002,82009,82053,82060,82068,82075,82114,82121,82136,82144,82156,82202,82213,82220],{"type":21,"tag":209,"props":81866,"children":81867},{"class":211,"line":212},[81868,81873,81877,81881,81885,81889,81893],{"type":21,"tag":209,"props":81869,"children":81870},{"style":222},[81871],{"type":26,"value":81872},"hiframe.",{"type":21,"tag":209,"props":81874,"children":81875},{"style":360},[81876],{"type":26,"value":363},{"type":21,"tag":209,"props":81878,"children":81879},{"style":222},[81880],{"type":26,"value":368},{"type":21,"tag":209,"props":81882,"children":81883},{"style":233},[81884],{"type":26,"value":11055},{"type":21,"tag":209,"props":81886,"children":81887},{"style":222},[81888],{"type":26,"value":408},{"type":21,"tag":209,"props":81890,"children":81891},{"style":216},[81892],{"type":26,"value":5370},{"type":21,"tag":209,"props":81894,"children":81895},{"style":222},[81896],{"type":26,"value":2561},{"type":21,"tag":209,"props":81898,"children":81899},{"class":211,"line":244},[81900,81904],{"type":21,"tag":209,"props":81901,"children":81902},{"style":216},[81903],{"type":26,"value":8996},{"type":21,"tag":209,"props":81905,"children":81906},{"style":222},[81907],{"type":26,"value":1442},{"type":21,"tag":209,"props":81909,"children":81910},{"class":211,"line":254},[81911],{"type":21,"tag":209,"props":81912,"children":81913},{"emptyLinePlaceholder":248},[81914],{"type":26,"value":251},{"type":21,"tag":209,"props":81916,"children":81917},{"class":211,"line":279},[81918,81922,81927,81931,81935],{"type":21,"tag":209,"props":81919,"children":81920},{"style":222},[81921],{"type":26,"value":81721},{"type":21,"tag":209,"props":81923,"children":81924},{"style":360},[81925],{"type":26,"value":81926},"removeAttr",{"type":21,"tag":209,"props":81928,"children":81929},{"style":222},[81930],{"type":26,"value":368},{"type":21,"tag":209,"props":81932,"children":81933},{"style":233},[81934],{"type":26,"value":81010},{"type":21,"tag":209,"props":81936,"children":81937},{"style":222},[81938],{"type":26,"value":2608},{"type":21,"tag":209,"props":81940,"children":81941},{"class":211,"line":288},[81942],{"type":21,"tag":209,"props":81943,"children":81944},{"emptyLinePlaceholder":248},[81945],{"type":26,"value":251},{"type":21,"tag":209,"props":81947,"children":81948},{"class":211,"line":307},[81949,81953],{"type":21,"tag":209,"props":81950,"children":81951},{"style":216},[81952],{"type":26,"value":68147},{"type":21,"tag":209,"props":81954,"children":81955},{"style":222},[81956],{"type":26,"value":7414},{"type":21,"tag":209,"props":81958,"children":81959},{"class":211,"line":325},[81960,81964,81969,81973,81977,81981,81985,81990,81994,81998],{"type":21,"tag":209,"props":81961,"children":81962},{"style":216},[81963],{"type":26,"value":43437},{"type":21,"tag":209,"props":81965,"children":81966},{"style":222},[81967],{"type":26,"value":81968}," (options.dataType.",{"type":21,"tag":209,"props":81970,"children":81971},{"style":360},[81972],{"type":26,"value":12392},{"type":21,"tag":209,"props":81974,"children":81975},{"style":222},[81976],{"type":26,"value":368},{"type":21,"tag":209,"props":81978,"children":81979},{"style":233},[81980],{"type":26,"value":24189},{"type":21,"tag":209,"props":81982,"children":81983},{"style":222},[81984],{"type":26,"value":432},{"type":21,"tag":209,"props":81986,"children":81987},{"style":216},[81988],{"type":26,"value":81989},"!=",{"type":21,"tag":209,"props":81991,"children":81992},{"style":216},[81993],{"type":26,"value":12414},{"type":21,"tag":209,"props":81995,"children":81996},{"style":263},[81997],{"type":26,"value":3224},{"type":21,"tag":209,"props":81999,"children":82000},{"style":222},[82001],{"type":26,"value":10112},{"type":21,"tag":209,"props":82003,"children":82004},{"class":211,"line":334},[82005],{"type":21,"tag":209,"props":82006,"children":82007},{"style":222},[82008],{"type":26,"value":7414},{"type":21,"tag":209,"props":82010,"children":82011},{"class":211,"line":343},[82012,82017,82021,82026,82031,82035,82040,82044,82048],{"type":21,"tag":209,"props":82013,"children":82014},{"style":222},[82015],{"type":26,"value":82016},"    res ",{"type":21,"tag":209,"props":82018,"children":82019},{"style":216},[82020],{"type":26,"value":1432},{"type":21,"tag":209,"props":82022,"children":82023},{"style":222},[82024],{"type":26,"value":82025}," frames[name].document.",{"type":21,"tag":209,"props":82027,"children":82028},{"style":360},[82029],{"type":26,"value":82030},"getElementsByTagName",{"type":21,"tag":209,"props":82032,"children":82033},{"style":222},[82034],{"type":26,"value":368},{"type":21,"tag":209,"props":82036,"children":82037},{"style":233},[82038],{"type":26,"value":82039},"\"pre\"",{"type":21,"tag":209,"props":82041,"children":82042},{"style":222},[82043],{"type":26,"value":24289},{"type":21,"tag":209,"props":82045,"children":82046},{"style":263},[82047],{"type":26,"value":6048},{"type":21,"tag":209,"props":82049,"children":82050},{"style":222},[82051],{"type":26,"value":82052},"].innerHTML;\n",{"type":21,"tag":209,"props":82054,"children":82055},{"class":211,"line":351},[82056],{"type":21,"tag":209,"props":82057,"children":82058},{"style":222},[82059],{"type":26,"value":7798},{"type":21,"tag":209,"props":82061,"children":82062},{"class":211,"line":444},[82063],{"type":21,"tag":209,"props":82064,"children":82065},{"style":216},[82066],{"type":26,"value":82067},"else\n",{"type":21,"tag":209,"props":82069,"children":82070},{"class":211,"line":454},[82071],{"type":21,"tag":209,"props":82072,"children":82073},{"style":222},[82074],{"type":26,"value":7414},{"type":21,"tag":209,"props":82076,"children":82077},{"class":211,"line":463},[82078,82082,82086,82090,82094,82098,82102,82106,82110],{"type":21,"tag":209,"props":82079,"children":82080},{"style":222},[82081],{"type":26,"value":82016},{"type":21,"tag":209,"props":82083,"children":82084},{"style":216},[82085],{"type":26,"value":1432},{"type":21,"tag":209,"props":82087,"children":82088},{"style":222},[82089],{"type":26,"value":82025},{"type":21,"tag":209,"props":82091,"children":82092},{"style":360},[82093],{"type":26,"value":82030},{"type":21,"tag":209,"props":82095,"children":82096},{"style":222},[82097],{"type":26,"value":368},{"type":21,"tag":209,"props":82099,"children":82100},{"style":233},[82101],{"type":26,"value":52891},{"type":21,"tag":209,"props":82103,"children":82104},{"style":222},[82105],{"type":26,"value":24289},{"type":21,"tag":209,"props":82107,"children":82108},{"style":263},[82109],{"type":26,"value":6048},{"type":21,"tag":209,"props":82111,"children":82112},{"style":222},[82113],{"type":26,"value":82052},{"type":21,"tag":209,"props":82115,"children":82116},{"class":211,"line":472},[82117],{"type":21,"tag":209,"props":82118,"children":82119},{"style":222},[82120],{"type":26,"value":7798},{"type":21,"tag":209,"props":82122,"children":82123},{"class":211,"line":480},[82124,82128,82132],{"type":21,"tag":209,"props":82125,"children":82126},{"style":222},[82127],{"type":26,"value":68247},{"type":21,"tag":209,"props":82129,"children":82130},{"style":216},[82131],{"type":26,"value":6823},{"type":21,"tag":209,"props":82133,"children":82134},{"style":222},[82135],{"type":26,"value":30897},{"type":21,"tag":209,"props":82137,"children":82138},{"class":211,"line":489},[82139],{"type":21,"tag":209,"props":82140,"children":82141},{"style":448},[82142],{"type":26,"value":82143},"    // Failed to receive anything in the body of the frame\n",{"type":21,"tag":209,"props":82145,"children":82146},{"class":211,"line":847},[82147,82152],{"type":21,"tag":209,"props":82148,"children":82149},{"style":360},[82150],{"type":26,"value":82151},"    cleanup",{"type":21,"tag":209,"props":82153,"children":82154},{"style":222},[82155],{"type":26,"value":4842},{"type":21,"tag":209,"props":82157,"children":82158},{"class":211,"line":860},[82159,82163,82167,82171,82176,82180,82184,82188,82193,82197],{"type":21,"tag":209,"props":82160,"children":82161},{"style":222},[82162],{"type":26,"value":43816},{"type":21,"tag":209,"props":82164,"children":82165},{"style":360},[82166],{"type":26,"value":5599},{"type":21,"tag":209,"props":82168,"children":82169},{"style":222},[82170],{"type":26,"value":368},{"type":21,"tag":209,"props":82172,"children":82173},{"style":233},[82174],{"type":26,"value":82175},"\"Failed to receive response in form target \"",{"type":21,"tag":209,"props":82177,"children":82178},{"style":216},[82179],{"type":26,"value":10237},{"type":21,"tag":209,"props":82181,"children":82182},{"style":222},[82183],{"type":26,"value":7820},{"type":21,"tag":209,"props":82185,"children":82186},{"style":216},[82187],{"type":26,"value":10237},{"type":21,"tag":209,"props":82189,"children":82190},{"style":233},[82191],{"type":26,"value":82192},"\": \"",{"type":21,"tag":209,"props":82194,"children":82195},{"style":216},[82196],{"type":26,"value":10237},{"type":21,"tag":209,"props":82198,"children":82199},{"style":222},[82200],{"type":26,"value":82201},"e.message);\n",{"type":21,"tag":209,"props":82203,"children":82204},{"class":211,"line":877},[82205,82209],{"type":21,"tag":209,"props":82206,"children":82207},{"style":216},[82208],{"type":26,"value":1298},{"type":21,"tag":209,"props":82210,"children":82211},{"style":222},[82212],{"type":26,"value":241},{"type":21,"tag":209,"props":82214,"children":82215},{"class":211,"line":889},[82216],{"type":21,"tag":209,"props":82217,"children":82218},{"style":222},[82219],{"type":26,"value":7798},{"type":21,"tag":209,"props":82221,"children":82222},{"class":211,"line":902},[82223,82227],{"type":21,"tag":209,"props":82224,"children":82225},{"style":360},[82226],{"type":26,"value":81634},{"type":21,"tag":209,"props":82228,"children":82229},{"style":222},[82230],{"type":26,"value":4842},{"type":21,"tag":22,"props":82232,"children":82233},{},[82234],{"type":26,"value":82235},"Now, we add a listener to the 'load' event for the iframe. When that event is triggered, after the upload is finished, or the form has been successfully submitted, we remove the target from the form (so its ready to be checked previous to submission again), and try and get the content returned from the server we submitted to that will have been loaded into the iframe, based on the dataType we set as an option when calling $.transparentSubmit.",{"type":21,"tag":200,"props":82237,"children":82239},{"className":9044,"code":82238,"language":9046,"meta":8,"style":8},"if (options.dataType.indexOf('json') != -1)\n{\ntry{\n    res = $.parseJSON(res);\n}catch(e){\n    defer.reject(\"Failed to parse response into JSON: \"+e.message);\n    return;\n}\n}\nelse if (options.dataType.indexOf('html') != -1)\n{\nres = $.parseHTML(res);\n}\ndefer.resolve(res);\n});\n\nform.submit();\n\nreturn defer.promise();\n",[82240],{"type":21,"tag":63,"props":82241,"children":82242},{"__ignoreMap":8},[82243,82286,82293,82304,82328,82343,82371,82382,82389,82396,82444,82451,82476,82483,82498,82505,82512,82528,82535],{"type":21,"tag":209,"props":82244,"children":82245},{"class":211,"line":212},[82246,82250,82254,82258,82262,82266,82270,82274,82278,82282],{"type":21,"tag":209,"props":82247,"children":82248},{"style":216},[82249],{"type":26,"value":43437},{"type":21,"tag":209,"props":82251,"children":82252},{"style":222},[82253],{"type":26,"value":81968},{"type":21,"tag":209,"props":82255,"children":82256},{"style":360},[82257],{"type":26,"value":12392},{"type":21,"tag":209,"props":82259,"children":82260},{"style":222},[82261],{"type":26,"value":368},{"type":21,"tag":209,"props":82263,"children":82264},{"style":233},[82265],{"type":26,"value":24189},{"type":21,"tag":209,"props":82267,"children":82268},{"style":222},[82269],{"type":26,"value":432},{"type":21,"tag":209,"props":82271,"children":82272},{"style":216},[82273],{"type":26,"value":81989},{"type":21,"tag":209,"props":82275,"children":82276},{"style":216},[82277],{"type":26,"value":12414},{"type":21,"tag":209,"props":82279,"children":82280},{"style":263},[82281],{"type":26,"value":3224},{"type":21,"tag":209,"props":82283,"children":82284},{"style":222},[82285],{"type":26,"value":10112},{"type":21,"tag":209,"props":82287,"children":82288},{"class":211,"line":244},[82289],{"type":21,"tag":209,"props":82290,"children":82291},{"style":222},[82292],{"type":26,"value":7414},{"type":21,"tag":209,"props":82294,"children":82295},{"class":211,"line":254},[82296,82300],{"type":21,"tag":209,"props":82297,"children":82298},{"style":216},[82299],{"type":26,"value":68147},{"type":21,"tag":209,"props":82301,"children":82302},{"style":222},[82303],{"type":26,"value":7414},{"type":21,"tag":209,"props":82305,"children":82306},{"class":211,"line":279},[82307,82311,82315,82319,82324],{"type":21,"tag":209,"props":82308,"children":82309},{"style":222},[82310],{"type":26,"value":82016},{"type":21,"tag":209,"props":82312,"children":82313},{"style":216},[82314],{"type":26,"value":1432},{"type":21,"tag":209,"props":82316,"children":82317},{"style":222},[82318],{"type":26,"value":26905},{"type":21,"tag":209,"props":82320,"children":82321},{"style":360},[82322],{"type":26,"value":82323},"parseJSON",{"type":21,"tag":209,"props":82325,"children":82326},{"style":222},[82327],{"type":26,"value":25195},{"type":21,"tag":209,"props":82329,"children":82330},{"class":211,"line":288},[82331,82335,82339],{"type":21,"tag":209,"props":82332,"children":82333},{"style":222},[82334],{"type":26,"value":68247},{"type":21,"tag":209,"props":82336,"children":82337},{"style":216},[82338],{"type":26,"value":6823},{"type":21,"tag":209,"props":82340,"children":82341},{"style":222},[82342],{"type":26,"value":30897},{"type":21,"tag":209,"props":82344,"children":82345},{"class":211,"line":307},[82346,82350,82354,82358,82363,82367],{"type":21,"tag":209,"props":82347,"children":82348},{"style":222},[82349],{"type":26,"value":43816},{"type":21,"tag":209,"props":82351,"children":82352},{"style":360},[82353],{"type":26,"value":5599},{"type":21,"tag":209,"props":82355,"children":82356},{"style":222},[82357],{"type":26,"value":368},{"type":21,"tag":209,"props":82359,"children":82360},{"style":233},[82361],{"type":26,"value":82362},"\"Failed to parse response into JSON: \"",{"type":21,"tag":209,"props":82364,"children":82365},{"style":216},[82366],{"type":26,"value":10237},{"type":21,"tag":209,"props":82368,"children":82369},{"style":222},[82370],{"type":26,"value":82201},{"type":21,"tag":209,"props":82372,"children":82373},{"class":211,"line":325},[82374,82378],{"type":21,"tag":209,"props":82375,"children":82376},{"style":216},[82377],{"type":26,"value":1298},{"type":21,"tag":209,"props":82379,"children":82380},{"style":222},[82381],{"type":26,"value":241},{"type":21,"tag":209,"props":82383,"children":82384},{"class":211,"line":334},[82385],{"type":21,"tag":209,"props":82386,"children":82387},{"style":222},[82388],{"type":26,"value":7798},{"type":21,"tag":209,"props":82390,"children":82391},{"class":211,"line":343},[82392],{"type":21,"tag":209,"props":82393,"children":82394},{"style":222},[82395],{"type":26,"value":7798},{"type":21,"tag":209,"props":82397,"children":82398},{"class":211,"line":351},[82399,82403,82407,82411,82415,82419,82424,82428,82432,82436,82440],{"type":21,"tag":209,"props":82400,"children":82401},{"style":216},[82402],{"type":26,"value":62488},{"type":21,"tag":209,"props":82404,"children":82405},{"style":216},[82406],{"type":26,"value":80550},{"type":21,"tag":209,"props":82408,"children":82409},{"style":222},[82410],{"type":26,"value":81968},{"type":21,"tag":209,"props":82412,"children":82413},{"style":360},[82414],{"type":26,"value":12392},{"type":21,"tag":209,"props":82416,"children":82417},{"style":222},[82418],{"type":26,"value":368},{"type":21,"tag":209,"props":82420,"children":82421},{"style":233},[82422],{"type":26,"value":82423},"'html'",{"type":21,"tag":209,"props":82425,"children":82426},{"style":222},[82427],{"type":26,"value":432},{"type":21,"tag":209,"props":82429,"children":82430},{"style":216},[82431],{"type":26,"value":81989},{"type":21,"tag":209,"props":82433,"children":82434},{"style":216},[82435],{"type":26,"value":12414},{"type":21,"tag":209,"props":82437,"children":82438},{"style":263},[82439],{"type":26,"value":3224},{"type":21,"tag":209,"props":82441,"children":82442},{"style":222},[82443],{"type":26,"value":10112},{"type":21,"tag":209,"props":82445,"children":82446},{"class":211,"line":444},[82447],{"type":21,"tag":209,"props":82448,"children":82449},{"style":222},[82450],{"type":26,"value":7414},{"type":21,"tag":209,"props":82452,"children":82453},{"class":211,"line":454},[82454,82459,82463,82467,82472],{"type":21,"tag":209,"props":82455,"children":82456},{"style":222},[82457],{"type":26,"value":82458},"res ",{"type":21,"tag":209,"props":82460,"children":82461},{"style":216},[82462],{"type":26,"value":1432},{"type":21,"tag":209,"props":82464,"children":82465},{"style":222},[82466],{"type":26,"value":26905},{"type":21,"tag":209,"props":82468,"children":82469},{"style":360},[82470],{"type":26,"value":82471},"parseHTML",{"type":21,"tag":209,"props":82473,"children":82474},{"style":222},[82475],{"type":26,"value":25195},{"type":21,"tag":209,"props":82477,"children":82478},{"class":211,"line":463},[82479],{"type":21,"tag":209,"props":82480,"children":82481},{"style":222},[82482],{"type":26,"value":7798},{"type":21,"tag":209,"props":82484,"children":82485},{"class":211,"line":472},[82486,82490,82494],{"type":21,"tag":209,"props":82487,"children":82488},{"style":222},[82489],{"type":26,"value":39480},{"type":21,"tag":209,"props":82491,"children":82492},{"style":360},[82493],{"type":26,"value":5590},{"type":21,"tag":209,"props":82495,"children":82496},{"style":222},[82497],{"type":26,"value":25195},{"type":21,"tag":209,"props":82499,"children":82500},{"class":211,"line":480},[82501],{"type":21,"tag":209,"props":82502,"children":82503},{"style":222},[82504],{"type":26,"value":469},{"type":21,"tag":209,"props":82506,"children":82507},{"class":211,"line":489},[82508],{"type":21,"tag":209,"props":82509,"children":82510},{"emptyLinePlaceholder":248},[82511],{"type":26,"value":251},{"type":21,"tag":209,"props":82513,"children":82514},{"class":211,"line":847},[82515,82519,82524],{"type":21,"tag":209,"props":82516,"children":82517},{"style":222},[82518],{"type":26,"value":81721},{"type":21,"tag":209,"props":82520,"children":82521},{"style":360},[82522],{"type":26,"value":82523},"submit",{"type":21,"tag":209,"props":82525,"children":82526},{"style":222},[82527],{"type":26,"value":4842},{"type":21,"tag":209,"props":82529,"children":82530},{"class":211,"line":860},[82531],{"type":21,"tag":209,"props":82532,"children":82533},{"emptyLinePlaceholder":248},[82534],{"type":26,"value":251},{"type":21,"tag":209,"props":82536,"children":82537},{"class":211,"line":877},[82538,82542,82546,82550],{"type":21,"tag":209,"props":82539,"children":82540},{"style":216},[82541],{"type":26,"value":5813},{"type":21,"tag":209,"props":82543,"children":82544},{"style":222},[82545],{"type":26,"value":28259},{"type":21,"tag":209,"props":82547,"children":82548},{"style":360},[82549],{"type":26,"value":27809},{"type":21,"tag":209,"props":82551,"children":82552},{"style":222},[82553],{"type":26,"value":4842},{"type":21,"tag":22,"props":82555,"children":82556},{},[82557],{"type":26,"value":82558},"If we want to return json or html, then we try and parse it as such. Either way, we can now resolve our promise and return the response. Outside of the load event, after its declared, we make our call to submit the form, which will now target the iframe and submit seamlessly. Finally, we return our deferred promise.",{"type":21,"tag":3549,"props":82560,"children":82562},{"id":82561},"aside-other-uses",[82563],{"type":26,"value":82564},"Aside: Other Uses",{"type":21,"tag":22,"props":82566,"children":82567},{},[82568],{"type":26,"value":82569},"As mentioned previously, all of this is going away as far as file uploading is concerned as soon as all major browsers (and all the legacy browsers we have to support as web developers) gain support for XMLHttpRequest level 2 and the File API. This technique is useful for more than just file uploading, however. In a project I worked on recently, we wanted to submit billing details to a payment gateway without needing to pass said details through our server, and with the gateway only accepting form submission. This technique was the perfect way to submit said details directly to them, without the negative user experience that would normally come with a form submission.",{"type":21,"tag":3549,"props":82571,"children":82573},{"id":82572},"the-gist",[82574],{"type":26,"value":82575},"The Gist",{"type":21,"tag":22,"props":82577,"children":82578},{},[82579],{"type":26,"value":82580},"This is a neat technique which I suspect I will still be getting some use out of even after all the major browsers support ajax file uploading. Therefore, I wrote a little jquery plugin (the aforementioned $.transparentSubmit). Feel free to use it, add to it, deride it mercilessly, etc.",{"type":21,"tag":200,"props":82582,"children":82584},{"className":9044,"code":82583,"language":9046,"meta":8,"style":8},"/**\n * jQuery plugin for transparent submission of a form using an $.ajax-like interface.\n * Usage Examples:\n * $.transparentSubmit({dataType:'json', form:$('#myForm')})\n * $('#myForm').transparentSubmit({dataType:'html'})\n * Supports Deferred (.done, .fail, .when, etc.)\n */\n(function($){\n    $.transparentSubmit = function(options){\n        var defer = $.Deferred(), // Deferred object whose promise we will hook into when adding .done, etc to calls\n            options = $.extend({\n                dataType:'json'\n            }, (options || {})), // coerce options into being an object, extend defaults\n            name = 'target-'+Math.random().toString(36).substring(7), // assign a psuedo-random name to the frame\n            hiframe = $('\u003Ciframe id=\"'+name+'\" name=\"'+name+'\" src=\"about:blank\" ' +\n                'style=\"width:0;height:0;border:0px solid #fff;\">\u003C/iframe>'), // create invisible iframe - NOT display:none\n            form = $(options.form), // get form, make sure its a jquery object\n            cleanup = function(){\n                hiframe.remove();\n                delete frames[name];\n            }; // clean iframe away when we're finished with it\n        if (!form.length || form[0].tagName !== 'FORM'){ // if we don't have a form to submit, reject (call .fail)\n            defer.reject(\"No form element specified to submit.\");\n            return defer.promise();\n        }\n\n        form.attr('target', name).append(hiframe); // set target of form to iframe, and append iframe to the form\n\n        // On load event, grab and parse the contents of the iframe\n        hiframe.on('load', function(){\n            var res;\n\n            form.removeAttr('target');\n\n            try{\n                if (options.dataType.indexOf('json') != -1)\n                { // browsers will wrap a json return with \u003Cpre>\u003C/pre>\n                    res = frames[name].document.getElementsByTagName(\"pre\")[0].innerHTML;\n                }\n                else\n                {\n                    res = frames[name].document.getElementsByTagName('body')[0].innerHTML;\n                }\n            }catch(e){\n                // Failed to receive anything in the body of the frame\n                cleanup();\n                defer.reject(\"Failed to receive response in form target \"+name+\": \"+e.message);\n                return;\n            }\n\n            cleanup();\n\n            if (options.dataType.indexOf('json') != -1)\n            {\n                try{\n                    res = $.parseJSON(res);\n                }catch(e){\n                    defer.reject(\"Failed to parse response into JSON: \"+e.message);\n                    return;\n                }\n            }\n            else if (options.dataType.indexOf('html') != -1)\n            {\n                res = $.parseHTML(res);\n            }\n\n            defer.resolve(res); // Finished (call .done)\n        });\n\n        form.submit();\n\n        return defer.promise();\n    }\n\n/*\n* This allows us the option to call $('#myForm').transparentSubmit - as you can see, its just a slightly different form \n* to the plugin, which calls our transparentSubmit function as defined above.\n*/\n    $.fn.transparentSubmit = function(options){\n        options.form = this;\n        return $.transparentSubmit(options);\n    };\n})(jQuery);\n",[82585],{"type":21,"tag":63,"props":82586,"children":82587},{"__ignoreMap":8},[82588,82595,82603,82611,82619,82627,82635,82642,82665,82696,82729,82753,82765,82787,82856,82919,82936,82962,82982,82998,83010,83023,83079,83102,83121,83128,83135,83173,83180,83188,83220,83231,83238,83262,83269,83280,83323,83336,83376,83383,83391,83398,83437,83444,83460,83468,83480,83523,83534,83541,83548,83559,83566,83609,83616,83628,83651,83667,83694,83705,83712,83719,83767,83774,83798,83805,83812,83833,83840,83847,83862,83869,83888,83895,83902,83909,83917,83925,83932,83963,83983,84002,84009],{"type":21,"tag":209,"props":82589,"children":82590},{"class":211,"line":212},[82591],{"type":21,"tag":209,"props":82592,"children":82593},{"style":448},[82594],{"type":26,"value":731},{"type":21,"tag":209,"props":82596,"children":82597},{"class":211,"line":244},[82598],{"type":21,"tag":209,"props":82599,"children":82600},{"style":448},[82601],{"type":26,"value":82602}," * jQuery plugin for transparent submission of a form using an $.ajax-like interface.\n",{"type":21,"tag":209,"props":82604,"children":82605},{"class":211,"line":254},[82606],{"type":21,"tag":209,"props":82607,"children":82608},{"style":448},[82609],{"type":26,"value":82610}," * Usage Examples:\n",{"type":21,"tag":209,"props":82612,"children":82613},{"class":211,"line":279},[82614],{"type":21,"tag":209,"props":82615,"children":82616},{"style":448},[82617],{"type":26,"value":82618}," * $.transparentSubmit({dataType:'json', form:$('#myForm')})\n",{"type":21,"tag":209,"props":82620,"children":82621},{"class":211,"line":288},[82622],{"type":21,"tag":209,"props":82623,"children":82624},{"style":448},[82625],{"type":26,"value":82626}," * $('#myForm').transparentSubmit({dataType:'html'})\n",{"type":21,"tag":209,"props":82628,"children":82629},{"class":211,"line":307},[82630],{"type":21,"tag":209,"props":82631,"children":82632},{"style":448},[82633],{"type":26,"value":82634}," * Supports Deferred (.done, .fail, .when, etc.)\n",{"type":21,"tag":209,"props":82636,"children":82637},{"class":211,"line":325},[82638],{"type":21,"tag":209,"props":82639,"children":82640},{"style":448},[82641],{"type":26,"value":755},{"type":21,"tag":209,"props":82643,"children":82644},{"class":211,"line":334},[82645,82649,82653,82657,82661],{"type":21,"tag":209,"props":82646,"children":82647},{"style":222},[82648],{"type":26,"value":368},{"type":21,"tag":209,"props":82650,"children":82651},{"style":216},[82652],{"type":26,"value":5370},{"type":21,"tag":209,"props":82654,"children":82655},{"style":222},[82656],{"type":26,"value":368},{"type":21,"tag":209,"props":82658,"children":82659},{"style":400},[82660],{"type":26,"value":10250},{"type":21,"tag":209,"props":82662,"children":82663},{"style":222},[82664],{"type":26,"value":2369},{"type":21,"tag":209,"props":82666,"children":82667},{"class":211,"line":343},[82668,82672,82676,82680,82684,82688,82692],{"type":21,"tag":209,"props":82669,"children":82670},{"style":222},[82671],{"type":26,"value":31124},{"type":21,"tag":209,"props":82673,"children":82674},{"style":360},[82675],{"type":26,"value":81086},{"type":21,"tag":209,"props":82677,"children":82678},{"style":216},[82679],{"type":26,"value":271},{"type":21,"tag":209,"props":82681,"children":82682},{"style":216},[82683],{"type":26,"value":4766},{"type":21,"tag":209,"props":82685,"children":82686},{"style":222},[82687],{"type":26,"value":368},{"type":21,"tag":209,"props":82689,"children":82690},{"style":400},[82691],{"type":26,"value":29825},{"type":21,"tag":209,"props":82693,"children":82694},{"style":222},[82695],{"type":26,"value":2369},{"type":21,"tag":209,"props":82697,"children":82698},{"class":211,"line":351},[82699,82703,82707,82711,82715,82719,82724],{"type":21,"tag":209,"props":82700,"children":82701},{"style":216},[82702],{"type":26,"value":5925},{"type":21,"tag":209,"props":82704,"children":82705},{"style":222},[82706],{"type":26,"value":28080},{"type":21,"tag":209,"props":82708,"children":82709},{"style":216},[82710],{"type":26,"value":1432},{"type":21,"tag":209,"props":82712,"children":82713},{"style":222},[82714],{"type":26,"value":26905},{"type":21,"tag":209,"props":82716,"children":82717},{"style":360},[82718],{"type":26,"value":26910},{"type":21,"tag":209,"props":82720,"children":82721},{"style":222},[82722],{"type":26,"value":82723},"(), ",{"type":21,"tag":209,"props":82725,"children":82726},{"style":448},[82727],{"type":26,"value":82728},"// Deferred object whose promise we will hook into when adding .done, etc to calls\n",{"type":21,"tag":209,"props":82730,"children":82731},{"class":211,"line":444},[82732,82737,82741,82745,82749],{"type":21,"tag":209,"props":82733,"children":82734},{"style":222},[82735],{"type":26,"value":82736},"            options ",{"type":21,"tag":209,"props":82738,"children":82739},{"style":216},[82740],{"type":26,"value":1432},{"type":21,"tag":209,"props":82742,"children":82743},{"style":222},[82744],{"type":26,"value":26905},{"type":21,"tag":209,"props":82746,"children":82747},{"style":360},[82748],{"type":26,"value":38684},{"type":21,"tag":209,"props":82750,"children":82751},{"style":222},[82752],{"type":26,"value":17983},{"type":21,"tag":209,"props":82754,"children":82755},{"class":211,"line":454},[82756,82761],{"type":21,"tag":209,"props":82757,"children":82758},{"style":222},[82759],{"type":26,"value":82760},"                dataType:",{"type":21,"tag":209,"props":82762,"children":82763},{"style":233},[82764],{"type":26,"value":18029},{"type":21,"tag":209,"props":82766,"children":82767},{"class":211,"line":463},[82768,82773,82777,82782],{"type":21,"tag":209,"props":82769,"children":82770},{"style":222},[82771],{"type":26,"value":82772},"            }, (options ",{"type":21,"tag":209,"props":82774,"children":82775},{"style":216},[82776],{"type":26,"value":4677},{"type":21,"tag":209,"props":82778,"children":82779},{"style":222},[82780],{"type":26,"value":82781}," {})), ",{"type":21,"tag":209,"props":82783,"children":82784},{"style":448},[82785],{"type":26,"value":82786},"// coerce options into being an object, extend defaults\n",{"type":21,"tag":209,"props":82788,"children":82789},{"class":211,"line":472},[82790,82795,82799,82803,82807,82811,82815,82819,82823,82827,82831,82835,82839,82843,82847,82851],{"type":21,"tag":209,"props":82791,"children":82792},{"style":222},[82793],{"type":26,"value":82794},"            name ",{"type":21,"tag":209,"props":82796,"children":82797},{"style":216},[82798],{"type":26,"value":1432},{"type":21,"tag":209,"props":82800,"children":82801},{"style":233},[82802],{"type":26,"value":81523},{"type":21,"tag":209,"props":82804,"children":82805},{"style":216},[82806],{"type":26,"value":10237},{"type":21,"tag":209,"props":82808,"children":82809},{"style":222},[82810],{"type":26,"value":81532},{"type":21,"tag":209,"props":82812,"children":82813},{"style":360},[82814],{"type":26,"value":81537},{"type":21,"tag":209,"props":82816,"children":82817},{"style":222},[82818],{"type":26,"value":11910},{"type":21,"tag":209,"props":82820,"children":82821},{"style":360},[82822],{"type":26,"value":81546},{"type":21,"tag":209,"props":82824,"children":82825},{"style":222},[82826],{"type":26,"value":368},{"type":21,"tag":209,"props":82828,"children":82829},{"style":263},[82830],{"type":26,"value":81555},{"type":21,"tag":209,"props":82832,"children":82833},{"style":222},[82834],{"type":26,"value":2699},{"type":21,"tag":209,"props":82836,"children":82837},{"style":360},[82838],{"type":26,"value":81564},{"type":21,"tag":209,"props":82840,"children":82841},{"style":222},[82842],{"type":26,"value":368},{"type":21,"tag":209,"props":82844,"children":82845},{"style":263},[82846],{"type":26,"value":81573},{"type":21,"tag":209,"props":82848,"children":82849},{"style":222},[82850],{"type":26,"value":54894},{"type":21,"tag":209,"props":82852,"children":82853},{"style":448},[82854],{"type":26,"value":82855},"// assign a psuedo-random name to the frame\n",{"type":21,"tag":209,"props":82857,"children":82858},{"class":211,"line":480},[82859,82864,82868,82872,82876,82881,82885,82889,82893,82898,82902,82906,82910,82915],{"type":21,"tag":209,"props":82860,"children":82861},{"style":222},[82862],{"type":26,"value":82863},"            hiframe ",{"type":21,"tag":209,"props":82865,"children":82866},{"style":216},[82867],{"type":26,"value":1432},{"type":21,"tag":209,"props":82869,"children":82870},{"style":360},[82871],{"type":26,"value":49968},{"type":21,"tag":209,"props":82873,"children":82874},{"style":222},[82875],{"type":26,"value":368},{"type":21,"tag":209,"props":82877,"children":82878},{"style":233},[82879],{"type":26,"value":82880},"'\u003Ciframe id=\"'",{"type":21,"tag":209,"props":82882,"children":82883},{"style":216},[82884],{"type":26,"value":10237},{"type":21,"tag":209,"props":82886,"children":82887},{"style":222},[82888],{"type":26,"value":7820},{"type":21,"tag":209,"props":82890,"children":82891},{"style":216},[82892],{"type":26,"value":10237},{"type":21,"tag":209,"props":82894,"children":82895},{"style":233},[82896],{"type":26,"value":82897},"'\" name=\"'",{"type":21,"tag":209,"props":82899,"children":82900},{"style":216},[82901],{"type":26,"value":10237},{"type":21,"tag":209,"props":82903,"children":82904},{"style":222},[82905],{"type":26,"value":7820},{"type":21,"tag":209,"props":82907,"children":82908},{"style":216},[82909],{"type":26,"value":10237},{"type":21,"tag":209,"props":82911,"children":82912},{"style":233},[82913],{"type":26,"value":82914},"'\" src=\"about:blank\" '",{"type":21,"tag":209,"props":82916,"children":82917},{"style":216},[82918],{"type":26,"value":15642},{"type":21,"tag":209,"props":82920,"children":82921},{"class":211,"line":489},[82922,82927,82931],{"type":21,"tag":209,"props":82923,"children":82924},{"style":233},[82925],{"type":26,"value":82926},"                'style=\"width:0;height:0;border:0px solid #fff;\">\u003C/iframe>'",{"type":21,"tag":209,"props":82928,"children":82929},{"style":222},[82930],{"type":26,"value":54894},{"type":21,"tag":209,"props":82932,"children":82933},{"style":448},[82934],{"type":26,"value":82935},"// create invisible iframe - NOT display:none\n",{"type":21,"tag":209,"props":82937,"children":82938},{"class":211,"line":847},[82939,82944,82948,82952,82957],{"type":21,"tag":209,"props":82940,"children":82941},{"style":222},[82942],{"type":26,"value":82943},"            form ",{"type":21,"tag":209,"props":82945,"children":82946},{"style":216},[82947],{"type":26,"value":1432},{"type":21,"tag":209,"props":82949,"children":82950},{"style":360},[82951],{"type":26,"value":49968},{"type":21,"tag":209,"props":82953,"children":82954},{"style":222},[82955],{"type":26,"value":82956},"(options.form), ",{"type":21,"tag":209,"props":82958,"children":82959},{"style":448},[82960],{"type":26,"value":82961},"// get form, make sure its a jquery object\n",{"type":21,"tag":209,"props":82963,"children":82964},{"class":211,"line":860},[82965,82970,82974,82978],{"type":21,"tag":209,"props":82966,"children":82967},{"style":360},[82968],{"type":26,"value":82969},"            cleanup",{"type":21,"tag":209,"props":82971,"children":82972},{"style":216},[82973],{"type":26,"value":271},{"type":21,"tag":209,"props":82975,"children":82976},{"style":216},[82977],{"type":26,"value":4766},{"type":21,"tag":209,"props":82979,"children":82980},{"style":222},[82981],{"type":26,"value":2561},{"type":21,"tag":209,"props":82983,"children":82984},{"class":211,"line":877},[82985,82990,82994],{"type":21,"tag":209,"props":82986,"children":82987},{"style":222},[82988],{"type":26,"value":82989},"                hiframe.",{"type":21,"tag":209,"props":82991,"children":82992},{"style":360},[82993],{"type":26,"value":52368},{"type":21,"tag":209,"props":82995,"children":82996},{"style":222},[82997],{"type":26,"value":4842},{"type":21,"tag":209,"props":82999,"children":83000},{"class":211,"line":889},[83001,83006],{"type":21,"tag":209,"props":83002,"children":83003},{"style":216},[83004],{"type":26,"value":83005},"                delete",{"type":21,"tag":209,"props":83007,"children":83008},{"style":222},[83009],{"type":26,"value":81675},{"type":21,"tag":209,"props":83011,"children":83012},{"class":211,"line":902},[83013,83018],{"type":21,"tag":209,"props":83014,"children":83015},{"style":222},[83016],{"type":26,"value":83017},"            }; ",{"type":21,"tag":209,"props":83019,"children":83020},{"style":448},[83021],{"type":26,"value":83022},"// clean iframe away when we're finished with it\n",{"type":21,"tag":209,"props":83024,"children":83025},{"class":211,"line":914},[83026,83030,83034,83038,83042,83046,83050,83054,83058,83062,83066,83070,83074],{"type":21,"tag":209,"props":83027,"children":83028},{"style":216},[83029],{"type":26,"value":5803},{"type":21,"tag":209,"props":83031,"children":83032},{"style":222},[83033],{"type":26,"value":4776},{"type":21,"tag":209,"props":83035,"children":83036},{"style":216},[83037],{"type":26,"value":15052},{"type":21,"tag":209,"props":83039,"children":83040},{"style":222},[83041],{"type":26,"value":81721},{"type":21,"tag":209,"props":83043,"children":83044},{"style":263},[83045],{"type":26,"value":36467},{"type":21,"tag":209,"props":83047,"children":83048},{"style":216},[83049],{"type":26,"value":18721},{"type":21,"tag":209,"props":83051,"children":83052},{"style":222},[83053],{"type":26,"value":81734},{"type":21,"tag":209,"props":83055,"children":83056},{"style":263},[83057],{"type":26,"value":6048},{"type":21,"tag":209,"props":83059,"children":83060},{"style":222},[83061],{"type":26,"value":74457},{"type":21,"tag":209,"props":83063,"children":83064},{"style":216},[83065],{"type":26,"value":12011},{"type":21,"tag":209,"props":83067,"children":83068},{"style":233},[83069],{"type":26,"value":81751},{"type":21,"tag":209,"props":83071,"children":83072},{"style":222},[83073],{"type":26,"value":43930},{"type":21,"tag":209,"props":83075,"children":83076},{"style":448},[83077],{"type":26,"value":83078},"// if we don't have a form to submit, reject (call .fail)\n",{"type":21,"tag":209,"props":83080,"children":83081},{"class":211,"line":922},[83082,83086,83090,83094,83098],{"type":21,"tag":209,"props":83083,"children":83084},{"style":222},[83085],{"type":26,"value":30916},{"type":21,"tag":209,"props":83087,"children":83088},{"style":360},[83089],{"type":26,"value":5599},{"type":21,"tag":209,"props":83091,"children":83092},{"style":222},[83093],{"type":26,"value":368},{"type":21,"tag":209,"props":83095,"children":83096},{"style":233},[83097],{"type":26,"value":81782},{"type":21,"tag":209,"props":83099,"children":83100},{"style":222},[83101],{"type":26,"value":2608},{"type":21,"tag":209,"props":83103,"children":83104},{"class":211,"line":2312},[83105,83109,83113,83117],{"type":21,"tag":209,"props":83106,"children":83107},{"style":216},[83108],{"type":26,"value":5101},{"type":21,"tag":209,"props":83110,"children":83111},{"style":222},[83112],{"type":26,"value":28259},{"type":21,"tag":209,"props":83114,"children":83115},{"style":360},[83116],{"type":26,"value":27809},{"type":21,"tag":209,"props":83118,"children":83119},{"style":222},[83120],{"type":26,"value":4842},{"type":21,"tag":209,"props":83122,"children":83123},{"class":211,"line":2321},[83124],{"type":21,"tag":209,"props":83125,"children":83126},{"style":222},[83127],{"type":26,"value":2235},{"type":21,"tag":209,"props":83129,"children":83130},{"class":211,"line":2372},[83131],{"type":21,"tag":209,"props":83132,"children":83133},{"emptyLinePlaceholder":248},[83134],{"type":26,"value":251},{"type":21,"tag":209,"props":83136,"children":83137},{"class":211,"line":2381},[83138,83143,83147,83151,83155,83159,83163,83168],{"type":21,"tag":209,"props":83139,"children":83140},{"style":222},[83141],{"type":26,"value":83142},"        form.",{"type":21,"tag":209,"props":83144,"children":83145},{"style":360},[83146],{"type":26,"value":81001},{"type":21,"tag":209,"props":83148,"children":83149},{"style":222},[83150],{"type":26,"value":368},{"type":21,"tag":209,"props":83152,"children":83153},{"style":233},[83154],{"type":26,"value":81010},{"type":21,"tag":209,"props":83156,"children":83157},{"style":222},[83158],{"type":26,"value":81843},{"type":21,"tag":209,"props":83160,"children":83161},{"style":360},[83162],{"type":26,"value":51794},{"type":21,"tag":209,"props":83164,"children":83165},{"style":222},[83166],{"type":26,"value":83167},"(hiframe); ",{"type":21,"tag":209,"props":83169,"children":83170},{"style":448},[83171],{"type":26,"value":83172},"// set target of form to iframe, and append iframe to the form\n",{"type":21,"tag":209,"props":83174,"children":83175},{"class":211,"line":2389},[83176],{"type":21,"tag":209,"props":83177,"children":83178},{"emptyLinePlaceholder":248},[83179],{"type":26,"value":251},{"type":21,"tag":209,"props":83181,"children":83182},{"class":211,"line":2397},[83183],{"type":21,"tag":209,"props":83184,"children":83185},{"style":448},[83186],{"type":26,"value":83187},"        // On load event, grab and parse the contents of the iframe\n",{"type":21,"tag":209,"props":83189,"children":83190},{"class":211,"line":2406},[83191,83196,83200,83204,83208,83212,83216],{"type":21,"tag":209,"props":83192,"children":83193},{"style":222},[83194],{"type":26,"value":83195},"        hiframe.",{"type":21,"tag":209,"props":83197,"children":83198},{"style":360},[83199],{"type":26,"value":363},{"type":21,"tag":209,"props":83201,"children":83202},{"style":222},[83203],{"type":26,"value":368},{"type":21,"tag":209,"props":83205,"children":83206},{"style":233},[83207],{"type":26,"value":11055},{"type":21,"tag":209,"props":83209,"children":83210},{"style":222},[83211],{"type":26,"value":408},{"type":21,"tag":209,"props":83213,"children":83214},{"style":216},[83215],{"type":26,"value":5370},{"type":21,"tag":209,"props":83217,"children":83218},{"style":222},[83219],{"type":26,"value":2561},{"type":21,"tag":209,"props":83221,"children":83222},{"class":211,"line":2415},[83223,83227],{"type":21,"tag":209,"props":83224,"children":83225},{"style":216},[83226],{"type":26,"value":5959},{"type":21,"tag":209,"props":83228,"children":83229},{"style":222},[83230],{"type":26,"value":1442},{"type":21,"tag":209,"props":83232,"children":83233},{"class":211,"line":2424},[83234],{"type":21,"tag":209,"props":83235,"children":83236},{"emptyLinePlaceholder":248},[83237],{"type":26,"value":251},{"type":21,"tag":209,"props":83239,"children":83240},{"class":211,"line":2433},[83241,83246,83250,83254,83258],{"type":21,"tag":209,"props":83242,"children":83243},{"style":222},[83244],{"type":26,"value":83245},"            form.",{"type":21,"tag":209,"props":83247,"children":83248},{"style":360},[83249],{"type":26,"value":81926},{"type":21,"tag":209,"props":83251,"children":83252},{"style":222},[83253],{"type":26,"value":368},{"type":21,"tag":209,"props":83255,"children":83256},{"style":233},[83257],{"type":26,"value":81010},{"type":21,"tag":209,"props":83259,"children":83260},{"style":222},[83261],{"type":26,"value":2608},{"type":21,"tag":209,"props":83263,"children":83264},{"class":211,"line":2442},[83265],{"type":21,"tag":209,"props":83266,"children":83267},{"emptyLinePlaceholder":248},[83268],{"type":26,"value":251},{"type":21,"tag":209,"props":83270,"children":83271},{"class":211,"line":2471},[83272,83276],{"type":21,"tag":209,"props":83273,"children":83274},{"style":216},[83275],{"type":26,"value":16193},{"type":21,"tag":209,"props":83277,"children":83278},{"style":222},[83279],{"type":26,"value":7414},{"type":21,"tag":209,"props":83281,"children":83282},{"class":211,"line":2480},[83283,83287,83291,83295,83299,83303,83307,83311,83315,83319],{"type":21,"tag":209,"props":83284,"children":83285},{"style":216},[83286],{"type":26,"value":41955},{"type":21,"tag":209,"props":83288,"children":83289},{"style":222},[83290],{"type":26,"value":81968},{"type":21,"tag":209,"props":83292,"children":83293},{"style":360},[83294],{"type":26,"value":12392},{"type":21,"tag":209,"props":83296,"children":83297},{"style":222},[83298],{"type":26,"value":368},{"type":21,"tag":209,"props":83300,"children":83301},{"style":233},[83302],{"type":26,"value":24189},{"type":21,"tag":209,"props":83304,"children":83305},{"style":222},[83306],{"type":26,"value":432},{"type":21,"tag":209,"props":83308,"children":83309},{"style":216},[83310],{"type":26,"value":81989},{"type":21,"tag":209,"props":83312,"children":83313},{"style":216},[83314],{"type":26,"value":12414},{"type":21,"tag":209,"props":83316,"children":83317},{"style":263},[83318],{"type":26,"value":3224},{"type":21,"tag":209,"props":83320,"children":83321},{"style":222},[83322],{"type":26,"value":10112},{"type":21,"tag":209,"props":83324,"children":83325},{"class":211,"line":2489},[83326,83331],{"type":21,"tag":209,"props":83327,"children":83328},{"style":222},[83329],{"type":26,"value":83330},"                { ",{"type":21,"tag":209,"props":83332,"children":83333},{"style":448},[83334],{"type":26,"value":83335},"// browsers will wrap a json return with \u003Cpre>\u003C/pre>\n",{"type":21,"tag":209,"props":83337,"children":83338},{"class":211,"line":2516},[83339,83344,83348,83352,83356,83360,83364,83368,83372],{"type":21,"tag":209,"props":83340,"children":83341},{"style":222},[83342],{"type":26,"value":83343},"                    res ",{"type":21,"tag":209,"props":83345,"children":83346},{"style":216},[83347],{"type":26,"value":1432},{"type":21,"tag":209,"props":83349,"children":83350},{"style":222},[83351],{"type":26,"value":82025},{"type":21,"tag":209,"props":83353,"children":83354},{"style":360},[83355],{"type":26,"value":82030},{"type":21,"tag":209,"props":83357,"children":83358},{"style":222},[83359],{"type":26,"value":368},{"type":21,"tag":209,"props":83361,"children":83362},{"style":233},[83363],{"type":26,"value":82039},{"type":21,"tag":209,"props":83365,"children":83366},{"style":222},[83367],{"type":26,"value":24289},{"type":21,"tag":209,"props":83369,"children":83370},{"style":263},[83371],{"type":26,"value":6048},{"type":21,"tag":209,"props":83373,"children":83374},{"style":222},[83375],{"type":26,"value":82052},{"type":21,"tag":209,"props":83377,"children":83378},{"class":211,"line":2525},[83379],{"type":21,"tag":209,"props":83380,"children":83381},{"style":222},[83382],{"type":26,"value":16636},{"type":21,"tag":209,"props":83384,"children":83385},{"class":211,"line":2533},[83386],{"type":21,"tag":209,"props":83387,"children":83388},{"style":216},[83389],{"type":26,"value":83390},"                else\n",{"type":21,"tag":209,"props":83392,"children":83393},{"class":211,"line":2542},[83394],{"type":21,"tag":209,"props":83395,"children":83396},{"style":222},[83397],{"type":26,"value":56907},{"type":21,"tag":209,"props":83399,"children":83400},{"class":211,"line":2550},[83401,83405,83409,83413,83417,83421,83425,83429,83433],{"type":21,"tag":209,"props":83402,"children":83403},{"style":222},[83404],{"type":26,"value":83343},{"type":21,"tag":209,"props":83406,"children":83407},{"style":216},[83408],{"type":26,"value":1432},{"type":21,"tag":209,"props":83410,"children":83411},{"style":222},[83412],{"type":26,"value":82025},{"type":21,"tag":209,"props":83414,"children":83415},{"style":360},[83416],{"type":26,"value":82030},{"type":21,"tag":209,"props":83418,"children":83419},{"style":222},[83420],{"type":26,"value":368},{"type":21,"tag":209,"props":83422,"children":83423},{"style":233},[83424],{"type":26,"value":52891},{"type":21,"tag":209,"props":83426,"children":83427},{"style":222},[83428],{"type":26,"value":24289},{"type":21,"tag":209,"props":83430,"children":83431},{"style":263},[83432],{"type":26,"value":6048},{"type":21,"tag":209,"props":83434,"children":83435},{"style":222},[83436],{"type":26,"value":82052},{"type":21,"tag":209,"props":83438,"children":83439},{"class":211,"line":2564},[83440],{"type":21,"tag":209,"props":83441,"children":83442},{"style":222},[83443],{"type":26,"value":16636},{"type":21,"tag":209,"props":83445,"children":83446},{"class":211,"line":2611},[83447,83452,83456],{"type":21,"tag":209,"props":83448,"children":83449},{"style":222},[83450],{"type":26,"value":83451},"            }",{"type":21,"tag":209,"props":83453,"children":83454},{"style":216},[83455],{"type":26,"value":6823},{"type":21,"tag":209,"props":83457,"children":83458},{"style":222},[83459],{"type":26,"value":30897},{"type":21,"tag":209,"props":83461,"children":83462},{"class":211,"line":2619},[83463],{"type":21,"tag":209,"props":83464,"children":83465},{"style":448},[83466],{"type":26,"value":83467},"                // Failed to receive anything in the body of the frame\n",{"type":21,"tag":209,"props":83469,"children":83470},{"class":211,"line":2627},[83471,83476],{"type":21,"tag":209,"props":83472,"children":83473},{"style":360},[83474],{"type":26,"value":83475},"                cleanup",{"type":21,"tag":209,"props":83477,"children":83478},{"style":222},[83479],{"type":26,"value":4842},{"type":21,"tag":209,"props":83481,"children":83482},{"class":211,"line":2636},[83483,83487,83491,83495,83499,83503,83507,83511,83515,83519],{"type":21,"tag":209,"props":83484,"children":83485},{"style":222},[83486],{"type":26,"value":28462},{"type":21,"tag":209,"props":83488,"children":83489},{"style":360},[83490],{"type":26,"value":5599},{"type":21,"tag":209,"props":83492,"children":83493},{"style":222},[83494],{"type":26,"value":368},{"type":21,"tag":209,"props":83496,"children":83497},{"style":233},[83498],{"type":26,"value":82175},{"type":21,"tag":209,"props":83500,"children":83501},{"style":216},[83502],{"type":26,"value":10237},{"type":21,"tag":209,"props":83504,"children":83505},{"style":222},[83506],{"type":26,"value":7820},{"type":21,"tag":209,"props":83508,"children":83509},{"style":216},[83510],{"type":26,"value":10237},{"type":21,"tag":209,"props":83512,"children":83513},{"style":233},[83514],{"type":26,"value":82192},{"type":21,"tag":209,"props":83516,"children":83517},{"style":216},[83518],{"type":26,"value":10237},{"type":21,"tag":209,"props":83520,"children":83521},{"style":222},[83522],{"type":26,"value":82201},{"type":21,"tag":209,"props":83524,"children":83525},{"class":211,"line":2644},[83526,83530],{"type":21,"tag":209,"props":83527,"children":83528},{"style":216},[83529],{"type":26,"value":5653},{"type":21,"tag":209,"props":83531,"children":83532},{"style":222},[83533],{"type":26,"value":241},{"type":21,"tag":209,"props":83535,"children":83536},{"class":211,"line":2657},[83537],{"type":21,"tag":209,"props":83538,"children":83539},{"style":222},[83540],{"type":26,"value":6136},{"type":21,"tag":209,"props":83542,"children":83543},{"class":211,"line":2728},[83544],{"type":21,"tag":209,"props":83545,"children":83546},{"emptyLinePlaceholder":248},[83547],{"type":26,"value":251},{"type":21,"tag":209,"props":83549,"children":83550},{"class":211,"line":2758},[83551,83555],{"type":21,"tag":209,"props":83552,"children":83553},{"style":360},[83554],{"type":26,"value":82969},{"type":21,"tag":209,"props":83556,"children":83557},{"style":222},[83558],{"type":26,"value":4842},{"type":21,"tag":209,"props":83560,"children":83561},{"class":211,"line":2776},[83562],{"type":21,"tag":209,"props":83563,"children":83564},{"emptyLinePlaceholder":248},[83565],{"type":26,"value":251},{"type":21,"tag":209,"props":83567,"children":83568},{"class":211,"line":2785},[83569,83573,83577,83581,83585,83589,83593,83597,83601,83605],{"type":21,"tag":209,"props":83570,"children":83571},{"style":216},[83572],{"type":26,"value":6083},{"type":21,"tag":209,"props":83574,"children":83575},{"style":222},[83576],{"type":26,"value":81968},{"type":21,"tag":209,"props":83578,"children":83579},{"style":360},[83580],{"type":26,"value":12392},{"type":21,"tag":209,"props":83582,"children":83583},{"style":222},[83584],{"type":26,"value":368},{"type":21,"tag":209,"props":83586,"children":83587},{"style":233},[83588],{"type":26,"value":24189},{"type":21,"tag":209,"props":83590,"children":83591},{"style":222},[83592],{"type":26,"value":432},{"type":21,"tag":209,"props":83594,"children":83595},{"style":216},[83596],{"type":26,"value":81989},{"type":21,"tag":209,"props":83598,"children":83599},{"style":216},[83600],{"type":26,"value":12414},{"type":21,"tag":209,"props":83602,"children":83603},{"style":263},[83604],{"type":26,"value":3224},{"type":21,"tag":209,"props":83606,"children":83607},{"style":222},[83608],{"type":26,"value":10112},{"type":21,"tag":209,"props":83610,"children":83611},{"class":211,"line":2793},[83612],{"type":21,"tag":209,"props":83613,"children":83614},{"style":222},[83615],{"type":26,"value":16576},{"type":21,"tag":209,"props":83617,"children":83618},{"class":211,"line":2801},[83619,83624],{"type":21,"tag":209,"props":83620,"children":83621},{"style":216},[83622],{"type":26,"value":83623},"                try",{"type":21,"tag":209,"props":83625,"children":83626},{"style":222},[83627],{"type":26,"value":7414},{"type":21,"tag":209,"props":83629,"children":83630},{"class":211,"line":2809},[83631,83635,83639,83643,83647],{"type":21,"tag":209,"props":83632,"children":83633},{"style":222},[83634],{"type":26,"value":83343},{"type":21,"tag":209,"props":83636,"children":83637},{"style":216},[83638],{"type":26,"value":1432},{"type":21,"tag":209,"props":83640,"children":83641},{"style":222},[83642],{"type":26,"value":26905},{"type":21,"tag":209,"props":83644,"children":83645},{"style":360},[83646],{"type":26,"value":82323},{"type":21,"tag":209,"props":83648,"children":83649},{"style":222},[83650],{"type":26,"value":25195},{"type":21,"tag":209,"props":83652,"children":83653},{"class":211,"line":6219},[83654,83659,83663],{"type":21,"tag":209,"props":83655,"children":83656},{"style":222},[83657],{"type":26,"value":83658},"                }",{"type":21,"tag":209,"props":83660,"children":83661},{"style":216},[83662],{"type":26,"value":6823},{"type":21,"tag":209,"props":83664,"children":83665},{"style":222},[83666],{"type":26,"value":30897},{"type":21,"tag":209,"props":83668,"children":83669},{"class":211,"line":6228},[83670,83674,83678,83682,83686,83690],{"type":21,"tag":209,"props":83671,"children":83672},{"style":222},[83673],{"type":26,"value":29580},{"type":21,"tag":209,"props":83675,"children":83676},{"style":360},[83677],{"type":26,"value":5599},{"type":21,"tag":209,"props":83679,"children":83680},{"style":222},[83681],{"type":26,"value":368},{"type":21,"tag":209,"props":83683,"children":83684},{"style":233},[83685],{"type":26,"value":82362},{"type":21,"tag":209,"props":83687,"children":83688},{"style":216},[83689],{"type":26,"value":10237},{"type":21,"tag":209,"props":83691,"children":83692},{"style":222},[83693],{"type":26,"value":82201},{"type":21,"tag":209,"props":83695,"children":83696},{"class":211,"line":6250},[83697,83701],{"type":21,"tag":209,"props":83698,"children":83699},{"style":216},[83700],{"type":26,"value":12189},{"type":21,"tag":209,"props":83702,"children":83703},{"style":222},[83704],{"type":26,"value":241},{"type":21,"tag":209,"props":83706,"children":83707},{"class":211,"line":6258},[83708],{"type":21,"tag":209,"props":83709,"children":83710},{"style":222},[83711],{"type":26,"value":16636},{"type":21,"tag":209,"props":83713,"children":83714},{"class":211,"line":6267},[83715],{"type":21,"tag":209,"props":83716,"children":83717},{"style":222},[83718],{"type":26,"value":6136},{"type":21,"tag":209,"props":83720,"children":83721},{"class":211,"line":6303},[83722,83727,83731,83735,83739,83743,83747,83751,83755,83759,83763],{"type":21,"tag":209,"props":83723,"children":83724},{"style":216},[83725],{"type":26,"value":83726},"            else",{"type":21,"tag":209,"props":83728,"children":83729},{"style":216},[83730],{"type":26,"value":80550},{"type":21,"tag":209,"props":83732,"children":83733},{"style":222},[83734],{"type":26,"value":81968},{"type":21,"tag":209,"props":83736,"children":83737},{"style":360},[83738],{"type":26,"value":12392},{"type":21,"tag":209,"props":83740,"children":83741},{"style":222},[83742],{"type":26,"value":368},{"type":21,"tag":209,"props":83744,"children":83745},{"style":233},[83746],{"type":26,"value":82423},{"type":21,"tag":209,"props":83748,"children":83749},{"style":222},[83750],{"type":26,"value":432},{"type":21,"tag":209,"props":83752,"children":83753},{"style":216},[83754],{"type":26,"value":81989},{"type":21,"tag":209,"props":83756,"children":83757},{"style":216},[83758],{"type":26,"value":12414},{"type":21,"tag":209,"props":83760,"children":83761},{"style":263},[83762],{"type":26,"value":3224},{"type":21,"tag":209,"props":83764,"children":83765},{"style":222},[83766],{"type":26,"value":10112},{"type":21,"tag":209,"props":83768,"children":83769},{"class":211,"line":6336},[83770],{"type":21,"tag":209,"props":83771,"children":83772},{"style":222},[83773],{"type":26,"value":16576},{"type":21,"tag":209,"props":83775,"children":83776},{"class":211,"line":6369},[83777,83782,83786,83790,83794],{"type":21,"tag":209,"props":83778,"children":83779},{"style":222},[83780],{"type":26,"value":83781},"                res ",{"type":21,"tag":209,"props":83783,"children":83784},{"style":216},[83785],{"type":26,"value":1432},{"type":21,"tag":209,"props":83787,"children":83788},{"style":222},[83789],{"type":26,"value":26905},{"type":21,"tag":209,"props":83791,"children":83792},{"style":360},[83793],{"type":26,"value":82471},{"type":21,"tag":209,"props":83795,"children":83796},{"style":222},[83797],{"type":26,"value":25195},{"type":21,"tag":209,"props":83799,"children":83800},{"class":211,"line":6378},[83801],{"type":21,"tag":209,"props":83802,"children":83803},{"style":222},[83804],{"type":26,"value":6136},{"type":21,"tag":209,"props":83806,"children":83807},{"class":211,"line":6387},[83808],{"type":21,"tag":209,"props":83809,"children":83810},{"emptyLinePlaceholder":248},[83811],{"type":26,"value":251},{"type":21,"tag":209,"props":83813,"children":83814},{"class":211,"line":6395},[83815,83819,83823,83828],{"type":21,"tag":209,"props":83816,"children":83817},{"style":222},[83818],{"type":26,"value":30916},{"type":21,"tag":209,"props":83820,"children":83821},{"style":360},[83822],{"type":26,"value":5590},{"type":21,"tag":209,"props":83824,"children":83825},{"style":222},[83826],{"type":26,"value":83827},"(res); ",{"type":21,"tag":209,"props":83829,"children":83830},{"style":448},[83831],{"type":26,"value":83832},"// Finished (call .done)\n",{"type":21,"tag":209,"props":83834,"children":83835},{"class":211,"line":6404},[83836],{"type":21,"tag":209,"props":83837,"children":83838},{"style":222},[83839],{"type":26,"value":5114},{"type":21,"tag":209,"props":83841,"children":83842},{"class":211,"line":6413},[83843],{"type":21,"tag":209,"props":83844,"children":83845},{"emptyLinePlaceholder":248},[83846],{"type":26,"value":251},{"type":21,"tag":209,"props":83848,"children":83849},{"class":211,"line":6447},[83850,83854,83858],{"type":21,"tag":209,"props":83851,"children":83852},{"style":222},[83853],{"type":26,"value":83142},{"type":21,"tag":209,"props":83855,"children":83856},{"style":360},[83857],{"type":26,"value":82523},{"type":21,"tag":209,"props":83859,"children":83860},{"style":222},[83861],{"type":26,"value":4842},{"type":21,"tag":209,"props":83863,"children":83864},{"class":211,"line":6479},[83865],{"type":21,"tag":209,"props":83866,"children":83867},{"emptyLinePlaceholder":248},[83868],{"type":26,"value":251},{"type":21,"tag":209,"props":83870,"children":83871},{"class":211,"line":6511},[83872,83876,83880,83884],{"type":21,"tag":209,"props":83873,"children":83874},{"style":216},[83875],{"type":26,"value":3069},{"type":21,"tag":209,"props":83877,"children":83878},{"style":222},[83879],{"type":26,"value":28259},{"type":21,"tag":209,"props":83881,"children":83882},{"style":360},[83883],{"type":26,"value":27809},{"type":21,"tag":209,"props":83885,"children":83886},{"style":222},[83887],{"type":26,"value":4842},{"type":21,"tag":209,"props":83889,"children":83890},{"class":211,"line":6519},[83891],{"type":21,"tag":209,"props":83892,"children":83893},{"style":222},[83894],{"type":26,"value":331},{"type":21,"tag":209,"props":83896,"children":83897},{"class":211,"line":6527},[83898],{"type":21,"tag":209,"props":83899,"children":83900},{"emptyLinePlaceholder":248},[83901],{"type":26,"value":251},{"type":21,"tag":209,"props":83903,"children":83904},{"class":211,"line":6535},[83905],{"type":21,"tag":209,"props":83906,"children":83907},{"style":448},[83908],{"type":26,"value":51271},{"type":21,"tag":209,"props":83910,"children":83911},{"class":211,"line":6543},[83912],{"type":21,"tag":209,"props":83913,"children":83914},{"style":448},[83915],{"type":26,"value":83916},"* This allows us the option to call $('#myForm').transparentSubmit - as you can see, its just a slightly different form \n",{"type":21,"tag":209,"props":83918,"children":83919},{"class":211,"line":6552},[83920],{"type":21,"tag":209,"props":83921,"children":83922},{"style":448},[83923],{"type":26,"value":83924},"* to the plugin, which calls our transparentSubmit function as defined above.\n",{"type":21,"tag":209,"props":83926,"children":83927},{"class":211,"line":6572},[83928],{"type":21,"tag":209,"props":83929,"children":83930},{"style":448},[83931],{"type":26,"value":51174},{"type":21,"tag":209,"props":83933,"children":83934},{"class":211,"line":6589},[83935,83939,83943,83947,83951,83955,83959],{"type":21,"tag":209,"props":83936,"children":83937},{"style":222},[83938],{"type":26,"value":50646},{"type":21,"tag":209,"props":83940,"children":83941},{"style":360},[83942],{"type":26,"value":81086},{"type":21,"tag":209,"props":83944,"children":83945},{"style":216},[83946],{"type":26,"value":271},{"type":21,"tag":209,"props":83948,"children":83949},{"style":216},[83950],{"type":26,"value":4766},{"type":21,"tag":209,"props":83952,"children":83953},{"style":222},[83954],{"type":26,"value":368},{"type":21,"tag":209,"props":83956,"children":83957},{"style":400},[83958],{"type":26,"value":29825},{"type":21,"tag":209,"props":83960,"children":83961},{"style":222},[83962],{"type":26,"value":2369},{"type":21,"tag":209,"props":83964,"children":83965},{"class":211,"line":6597},[83966,83971,83975,83979],{"type":21,"tag":209,"props":83967,"children":83968},{"style":222},[83969],{"type":26,"value":83970},"        options.form ",{"type":21,"tag":209,"props":83972,"children":83973},{"style":216},[83974],{"type":26,"value":1432},{"type":21,"tag":209,"props":83976,"children":83977},{"style":263},[83978],{"type":26,"value":17698},{"type":21,"tag":209,"props":83980,"children":83981},{"style":222},[83982],{"type":26,"value":241},{"type":21,"tag":209,"props":83984,"children":83985},{"class":211,"line":6625},[83986,83990,83994,83998],{"type":21,"tag":209,"props":83987,"children":83988},{"style":216},[83989],{"type":26,"value":3069},{"type":21,"tag":209,"props":83991,"children":83992},{"style":222},[83993],{"type":26,"value":26905},{"type":21,"tag":209,"props":83995,"children":83996},{"style":360},[83997],{"type":26,"value":81086},{"type":21,"tag":209,"props":83999,"children":84000},{"style":222},[84001],{"type":26,"value":73650},{"type":21,"tag":209,"props":84003,"children":84004},{"class":211,"line":6648},[84005],{"type":21,"tag":209,"props":84006,"children":84007},{"style":222},[84008],{"type":26,"value":4850},{"type":21,"tag":209,"props":84010,"children":84011},{"class":211,"line":6670},[84012],{"type":21,"tag":209,"props":84013,"children":84014},{"style":222},[84015],{"type":26,"value":50721},{"type":21,"tag":3490,"props":84017,"children":84018},{},[84019],{"type":26,"value":3494},{"title":8,"searchDepth":254,"depth":254,"links":84021},[84022,84023,84024,84025,84026],{"id":80699,"depth":244,"text":80702},{"id":81255,"depth":244,"text":81258},{"id":81412,"depth":244,"text":81415},{"id":82561,"depth":244,"text":82564},{"id":82572,"depth":244,"text":82575},"content:ckeefer:2013-3:ajax-upload.md","ckeefer/2013-3/ajax-upload.md","ckeefer/2013-3/ajax-upload",{"user":3518,"name":3519},1780330263275]