|
3 | 3 | .factory('codepenDataAdapter', CodepenDataAdapter)
|
4 | 4 | .factory('codepen', ['$demoAngularScripts', '$document', 'codepenDataAdapter', Codepen]);
|
5 | 5 |
|
6 |
| - // Provides a service to open a code example in codepen. |
| 6 | + // Provides a service to open a code example in CodePen. |
7 | 7 | function Codepen($demoAngularScripts, $document, codepenDataAdapter) {
|
8 | 8 |
|
9 | 9 | // The following URL used to be HTTP and not HTTPS to allow us to do localhost testing
|
|
15 | 15 | editOnCodepen: editOnCodepen
|
16 | 16 | };
|
17 | 17 |
|
18 |
| - // Creates a codepen from the given demo model by posting to Codepen's API |
19 |
| - // using a hidden form. The hidden form is necessary to avoid a CORS issue. |
| 18 | + // Creates a CodePen from the given demo model by posting to CodePen's API |
| 19 | + // using a hidden form. The hidden form is necessary to avoid a CORS issue. |
20 | 20 | // See http://blog.codepen.io/documentation/api/prefill
|
21 | 21 | function editOnCodepen(demo) {
|
22 | 22 | var externalScripts = $demoAngularScripts.all();
|
23 |
| - externalScripts.push('https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.1/moment.js'); |
| 23 | + externalScripts.push('https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.js'); |
| 24 | + // Needed for contact chips demos |
| 25 | + externalScripts.push('https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.2/rollups/md5.js'); |
24 | 26 | var data = codepenDataAdapter.translate(demo, externalScripts);
|
25 | 27 | var form = buildForm(data);
|
26 | 28 | $document.find('body').append(form);
|
27 | 29 | form[0].submit();
|
28 | 30 | form.remove();
|
29 | 31 | }
|
30 | 32 |
|
31 |
| - // Builds a hidden form with data necessary to create a codepen. |
| 33 | + // Builds a hidden form with data necessary to create a CodePen. |
32 | 34 | function buildForm(data) {
|
33 | 35 | var form = angular.element(
|
34 | 36 | '<form style="display: none;" method="post" target="_blank" action="' +
|
|
40 | 42 | return form;
|
41 | 43 | }
|
42 | 44 |
|
43 |
| - // Recommended by Codepen to escape quotes. |
| 45 | + // Recommended by CodePen to escape quotes. |
44 | 46 | // See http://blog.codepen.io/documentation/api/prefill
|
45 | 47 | function escapeJsonQuotes(json) {
|
46 | 48 | return JSON.stringify(json)
|
47 | 49 | .replace(/'/g, "&apos;")
|
48 | 50 | .replace(/"/g, "&quot;")
|
49 | 51 | /**
|
50 |
| - * Codepen was unescaping < (<) and > (>) which caused, on some demos, |
| 52 | + * CodePen was unescaping < (<) and > (>) which caused, on some demos, |
51 | 53 | * an unclosed elements (like <md-select>).
|
52 | 54 | * Used different unicode lookalike characters so it won't be considered as an element
|
53 | 55 | */
|
|
56 | 58 | }
|
57 | 59 | }
|
58 | 60 |
|
59 |
| - // Translates demo metadata and files into Codepen's post form data. See api documentation for |
| 61 | + // Translates demo metadata and files into CodePen's post form data. See api documentation for |
60 | 62 | // additional fields not used by this service. http://blog.codepen.io/documentation/api/prefill
|
61 | 63 | function CodepenDataAdapter() {
|
62 | 64 |
|
|
70 | 72 | var UNSECURE_CACHE_JS = 'http://ngmaterial.assets.s3.amazonaws.com/svg-assets-cache.js';
|
71 | 73 | var ASSET_CACHE_JS = 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/t-114/svg-assets-cache.js';
|
72 | 74 |
|
73 |
| - |
74 | 75 | return {
|
75 | 76 | translate: translate
|
76 | 77 | };
|
77 | 78 |
|
78 |
| - // Translates a demo model to match Codepen's post data |
| 79 | + // Translates a demo model to match CodePen's post data |
79 | 80 | // See http://blog.codepen.io/documentation/api/prefill
|
80 | 81 | function translate(demo, externalScripts) {
|
81 | 82 | var files = demo.files;
|
|
93 | 94 | });
|
94 | 95 | }
|
95 | 96 |
|
96 |
| - // Modifies index.html with necessary changes in order to display correctly in codepen |
| 97 | + // Modifies index.html with necessary changes in order to display correctly in CodePen |
97 | 98 | // See each processor to determine how each modifies the html
|
98 | 99 | function processHtml(demo) {
|
99 | 100 |
|
|
132 | 133 |
|
133 | 134 | return content + '\n\n'+
|
134 | 135 | commentStart + '\n'+
|
135 |
| - 'Copyright 2018 Google LLC. All Rights Reserved. \n'+ |
| 136 | + 'Copyright 2020 Google LLC. All Rights Reserved. \n'+ |
136 | 137 | 'Use of this source code is governed by an MIT-style license that can be found\n'+
|
137 | 138 | 'in the LICENSE file at http://material.angularjs.org/HEAD/license.\n'+
|
138 | 139 | commentEnd;
|
|
142 | 143 | }
|
143 | 144 |
|
144 | 145 |
|
145 |
| - // Applies modifications the javascript prior to sending to codepen. |
146 |
| - // Currently merges js files and replaces the module with the Codepen |
147 |
| - // module. See documentation for replaceDemoModuleWithCodepenModule. |
| 146 | + // Applies modifications the JavaScript prior to sending to CodePen. |
| 147 | + // Currently merges js files and replaces the module with the CodePen |
| 148 | + // module. See documentation for replaceDemoModuleWithCodepenModule. |
148 | 149 | function processJs(jsFiles) {
|
149 | 150 | var mergedJs = mergeFiles(jsFiles).join(' ');
|
150 | 151 | var script = replaceDemoModuleWithCodepenModule(mergedJs);
|
|
158 | 159 | });
|
159 | 160 | }
|
160 | 161 |
|
161 |
| - // Adds class to parent element so that styles are applied correctly |
162 |
| - // Adds ng-app attribute. This is the same module name provided in the asset-cache.js |
| 162 | + // Adds class to parent element so that styles are applied correctly. |
| 163 | + // Adds ng-app attribute. This is the same module name provided in the asset-cache.js |
163 | 164 | function applyAngularAttributesToParentElement(html, demo) {
|
164 | 165 | var tmp;
|
165 | 166 |
|
166 | 167 | // Grab only the DIV for the demo...
|
167 |
| - angular.forEach(angular.element(html), function(it,key){ |
| 168 | + angular.forEach(angular.element(html), function(it, key) { |
168 | 169 | if ((it.nodeName != "SCRIPT") && (it.nodeName != "#text")) {
|
169 | 170 | tmp = angular.element(it);
|
170 | 171 | }
|
|
175 | 176 | return tmp[0].outerHTML;
|
176 | 177 | }
|
177 | 178 |
|
178 |
| - // Adds templates inline in the html, so that templates are cached in the example |
| 179 | + // Adds templates inline in the html, so that templates are cached in the example. |
179 | 180 | function insertTemplatesAsScriptTags(indexHtml, demo) {
|
180 | 181 | if (demo.files.html.length) {
|
181 | 182 | var tmp = angular.element(indexHtml);
|
|
190 | 191 | return indexHtml;
|
191 | 192 | }
|
192 | 193 |
|
193 |
| - // Escapes ampersands so that after codepen unescapes the html the escaped code block |
194 |
| - // uses the correct escaped characters |
| 194 | + // Escapes ampersands so that after CodePen unescapes the html the escaped code block |
| 195 | + // uses the correct escaped characters. |
195 | 196 | function htmlEscapeAmpersand(html) {
|
196 | 197 | return html
|
197 | 198 | .replace(/&/g, "&");
|
198 | 199 | }
|
199 | 200 |
|
200 |
| - // Required to make codePen work. Demos define their own module when running on the |
201 |
| - // docs site. In order to ensure the codepen example can use the svg-asset-cache.js, the |
| 201 | + // Required to make CodePen work. Demos define their own module when running on the |
| 202 | + // docs site. In order to ensure the CodePen example can use the svg-asset-cache.js, the |
202 | 203 | // module needs to match so that the $templateCache is populated with the necessary
|
203 | 204 | // assets.
|
204 |
| - |
205 | 205 | function replaceDemoModuleWithCodepenModule(file) {
|
206 | 206 | var matchAngularModule = /\.module\(('[^']*'|"[^"]*")\s*,(\s*\[([^\]]*)\]\s*\))/ig;
|
207 | 207 | var modules = "['ngMaterial', 'ngMessages', 'material.svgAssetsCache']";
|
208 | 208 |
|
209 |
| - // See scripts.js for list of external AngularJS libraries used for the demos |
| 209 | + // See scripts.js for list of external AngularJS libraries used for the demos. |
210 | 210 |
|
211 | 211 | return file.replace(matchAngularModule, ".module('MyApp', "+ modules + ")");
|
212 | 212 | }
|
|
0 commit comments