[go: nahoru, domu]

Skip to content

Commit

Permalink
modularization and more organized project structure
Browse files Browse the repository at this point in the history
  • Loading branch information
chessl committed Apr 2, 2022
1 parent b01ef6e commit 1b2abf0
Show file tree
Hide file tree
Showing 14 changed files with 3,756 additions and 224 deletions.
11 changes: 1 addition & 10 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -75,13 +75,4 @@ If this is _actually something you need_, I will eat my hat. 🎩

# Release

Compile code with [Closure Compiler](https://closure-compiler.appspot.com/home).

```
// ==ClosureCompiler==
// @compilation_level ADVANCED_OPTIMIZATIONS
// @output_file_name scoped.min.js
// ==/ClosureCompiler==
// code here
```
Compile code with `npm run build`.
2 changes: 1 addition & 1 deletion demo/test.html
Original file line number Diff line number Diff line change
Expand Up @@ -122,6 +122,6 @@ <h3>The following should not be colored (not scoped)</h3>
});
</script>

<script src="../scoped.min.js"></script>
<script src="../dist/scoped.js"></script>
</body>
</html>
85 changes: 35 additions & 50 deletions scoped.js → dist/scoped.js
Original file line number Diff line number Diff line change
@@ -1,42 +1,27 @@
/*
* Copyright 2017 Google Inc. All rights reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License"); you may not
* use this file except in compliance with the License. You may obtain a copy of
* the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations under
* the License.
*/

/**
* @fileoverview Polyfill for `<style scoped>`.
*/


(function() {
const s = document.createElement('style');
if ('scoped' in s) {
return; // do nothing
}
(function (factory) {
typeof define === 'function' && define.amd ? define(factory) :
factory();
}((function () { 'use strict';

const scopedCSSOptions = {
'applyToClass': false,
'prefix': '__scoped_',
};
// This monstrosity matches any valid `[foo="bar"]` block, with either quote style. Parenthesis
// have no special meaning within an attribute selector, and the complex regexp below mostly
// exists to allow \" or \' in string parts (e.g. `[foo="b\"ar"]`).
const attrRe = /^\[.*?(?:(["'])(?:.|\\\1)*\1.*)*\]/;
const walkSelectorRe = /([([,]|:scope\b)/; // "interesting" setups
const scopeRe = /^:scope\b/;

const s = document.createElement('style');
// are we in old IE/Firefox mode, where .selectorText can't be changed inline?
s.textContent = '.x{color:red;}';
document.head.appendChild(s);
s.sheet.cssRules[0].selectorText = '.change';
const writeMode = s.sheet.cssRules[0].selectorText === '.change';
document.head.removeChild(s);

const scopedCSSOptions = {
'applyToClass': false,
'prefix': '__scoped_',
};

Object.defineProperty(HTMLStyleElement.prototype, 'scoped', {
enumerable: true,
Expand All @@ -57,24 +42,6 @@
*/
const styleNodes = new Map();


function hashCode(s) {
let hash = 5381;
let j = s.length;
while (j) {
hash = (hash * 33) ^ s.charCodeAt(--j);
}
return hash;
}


// This monstrosity matches any valid `[foo="bar"]` block, with either quote style. Parenthesis
// have no special meaning within an attribute selector, and the complex regexp below mostly
// exists to allow \" or \' in string parts (e.g. `[foo="b\"ar"]`).
const attrRe = /^\[.*?(?:(["'])(?:.|\\\1)*\1.*)*\]/;
const walkSelectorRe = /([([,]|:scope\b)/; // "interesting" setups
const scopeRe = /^:scope\b/;

/**
* Consumes a single selector from candidate selector text, which may contain many.
*
Expand Down Expand Up @@ -481,7 +448,7 @@
// const hash = hashCode(node.textContent);

// newly found style node, setup attr
const attrName = `${scopedCSSOptions['prefix']}${++uniqueId}`
const attrName = `${scopedCSSOptions['prefix']}${++uniqueId}`;
const prefix = applyMode === applyToAttr ? `[${attrName}]` : `.${attrName}`;
styleNodes.set(node, {attrName, prefix, parent: node.parentNode});

Expand Down Expand Up @@ -549,10 +516,28 @@
}
}

/*
* Copyright 2017 Google Inc. All rights reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License"); you may not
* use this file except in compliance with the License. You may obtain a copy of
* the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations under
* the License.
*/

console.log("scoped");

if (document.readyState === 'loading') {
window.addEventListener('DOMContentLoaded', setup);
} else {
setup();
}

}());
})));
1 change: 1 addition & 0 deletions dist/scoped.min.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading

0 comments on commit 1b2abf0

Please sign in to comment.