mirror of
https://github.com/liriliri/eruda.git
synced 2026-03-24 09:48:37 +08:00
Del: Features plugin
This commit is contained in:
surunzi
@@ -1,10 +0,0 @@
|
||||
<ul>
|
||||
{{#each features}}
|
||||
<li>
|
||||
<a href="http://caniuse.com/#search={{@key}}" target="_blank" class="eruda-inner-wrapper {{#if this}}eruda-ok{{/if}}">
|
||||
{{@key}}
|
||||
</a>
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
<a class="eruda-html5test" target="_blank" href="http://html5test.com">Go to HTML5 Test</a>
|
||||
@@ -1,61 +0,0 @@
|
||||
import Tool from '../DevTools/Tool';
|
||||
import util from '../lib/util';
|
||||
import modernizr from './modernizr';
|
||||
|
||||
let featureList = require('./featureList.json');
|
||||
|
||||
let featureNames = featureList['feature-detects'],
|
||||
specialNames = featureList['special-names'];
|
||||
|
||||
export default class Features extends Tool
|
||||
{
|
||||
constructor()
|
||||
{
|
||||
super();
|
||||
|
||||
this._style = util.evalCss(require('./Features.scss'));
|
||||
|
||||
this.name = 'features';
|
||||
this._tpl = require('./Features.hbs');
|
||||
this._features = {};
|
||||
this._isInit = false;
|
||||
}
|
||||
show()
|
||||
{
|
||||
super.show();
|
||||
|
||||
if (!this._isInit) this._initFeatures();
|
||||
}
|
||||
destroy()
|
||||
{
|
||||
super.destroy();
|
||||
|
||||
util.evalCss.remove(this._style);
|
||||
}
|
||||
_initFeatures()
|
||||
{
|
||||
this._isInit = true;
|
||||
|
||||
modernizr.testRunner();
|
||||
|
||||
let i = 0,
|
||||
featureNum = featureNames.length;
|
||||
|
||||
util.each(featureNames, (feature) =>
|
||||
{
|
||||
if (specialNames[feature]) feature = specialNames[feature];
|
||||
feature = feature.replace(/\//g, '');
|
||||
|
||||
modernizr.on(feature, result =>
|
||||
{
|
||||
this._features[feature] = result;
|
||||
i++;
|
||||
if (i === featureNum) this._render();
|
||||
});
|
||||
});
|
||||
}
|
||||
_render()
|
||||
{
|
||||
this._$el.html(this._tpl({features: this._features}));
|
||||
}
|
||||
}
|
||||
@@ -1,58 +0,0 @@
|
||||
@import "../style/variable";
|
||||
@import "../style/mixin";
|
||||
|
||||
.dev-tools { .tools {
|
||||
.features {
|
||||
padding-bottom: 40px;
|
||||
ul {
|
||||
@include overflow-auto(y);
|
||||
@include clear-float();
|
||||
height: 100%;
|
||||
li {
|
||||
width: 33.3%;
|
||||
float: left;
|
||||
padding: 5px;
|
||||
.inner-wrapper {
|
||||
@include overflow-auto(x);
|
||||
font-size: $font-size-s;
|
||||
text-decoration: underline;
|
||||
color: #fff;
|
||||
display: block;
|
||||
padding: 10px;
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
background: $red;
|
||||
transition: background $anim-duration;
|
||||
&:active {
|
||||
background: $red-dark;
|
||||
}
|
||||
&.ok {
|
||||
background: #fff;
|
||||
color: $gray;
|
||||
&:active {
|
||||
background: $gray-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.html5test {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
background: $blue;
|
||||
display: block;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
margin-top: 10px;
|
||||
transition: background $anim-duration;
|
||||
&:active {
|
||||
background: $blue-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
} }
|
||||
@@ -1,15 +0,0 @@
|
||||
var modernizr = require('modernizr'),
|
||||
fs = require('fs');
|
||||
|
||||
var featureList = require('./featureList.json');
|
||||
|
||||
modernizr.build(featureList, function (result)
|
||||
{
|
||||
result = result.replace(';(function(window, document, undefined){', '')
|
||||
.replace('window.Modernizr = Modernizr;', '')
|
||||
.replace('\'enableClasses\': true', '\'enableClasses\': false')
|
||||
.replace('testRunner();', 'Modernizr.testRunner = testRunner;')
|
||||
.replace('})(window, document);', '');
|
||||
result += '\nmodule.exports = Modernizr;';
|
||||
fs.writeFile('./modernizr.js', result, 'utf8');
|
||||
});
|
||||
@@ -1,69 +0,0 @@
|
||||
{
|
||||
"feature-detects": [
|
||||
"audio",
|
||||
"canvas",
|
||||
"cookies",
|
||||
"css/animations",
|
||||
"css/boxshadow",
|
||||
"css/boxsizing",
|
||||
"css/calc",
|
||||
"css/flexbox",
|
||||
"css/transforms",
|
||||
"css/transforms3d",
|
||||
"css/transitions",
|
||||
"es6/promises",
|
||||
"file/api",
|
||||
"file/filesystem",
|
||||
"forms/placeholder",
|
||||
"fullscreen-api",
|
||||
"geolocation",
|
||||
"hashchange",
|
||||
"history",
|
||||
"img/webp",
|
||||
"img/webp-alpha",
|
||||
"indexeddb",
|
||||
"json",
|
||||
"network/fetch",
|
||||
"network/xhr2",
|
||||
"notification",
|
||||
"performance",
|
||||
"pointerevents",
|
||||
"queryselector",
|
||||
"script/async",
|
||||
"script/defer",
|
||||
"serviceworker",
|
||||
"storage/localstorage",
|
||||
"storage/sessionstorage",
|
||||
"storage/websqldatabase",
|
||||
"style/scoped",
|
||||
"svg",
|
||||
"templatestrings",
|
||||
"touchevents",
|
||||
"typed-arrays",
|
||||
"url/bloburls",
|
||||
"url/data-uri",
|
||||
"video",
|
||||
"webgl",
|
||||
"websockets"
|
||||
],
|
||||
"special-names": {
|
||||
"css/boxshadow": "boxshadow",
|
||||
"css/boxsizing": "boxsizing",
|
||||
"css/flexbox": "flexbox",
|
||||
"es6/promises": "promises",
|
||||
"file/api": "filereader",
|
||||
"file/filesystem": "filesystem",
|
||||
"forms/placeholder": "placeholder",
|
||||
"fullscreen-api": "fullscreen",
|
||||
"img/webp": "webp",
|
||||
"img/webp-alpha": "webpalpha",
|
||||
"network/fetch": "fetch",
|
||||
"network/xhr2": "xhr2",
|
||||
"storage/localstorage": "localstorage",
|
||||
"storage/sessionstorage": "sessionstorage",
|
||||
"storage/websqldatabase": "websqldatabase",
|
||||
"typed-arrays": "typedarrays",
|
||||
"url/bloburls": "bloburls",
|
||||
"url/data-uri": "datauri"
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -59,6 +59,14 @@ export default [
|
||||
},
|
||||
desc: 'Display page fps'
|
||||
},
|
||||
{
|
||||
name: 'Load Features Plugin',
|
||||
fn()
|
||||
{
|
||||
loadPlugin('features');
|
||||
},
|
||||
desc: 'Browser feature detections'
|
||||
},
|
||||
{
|
||||
name: 'Restore Settings',
|
||||
fn()
|
||||
@@ -139,7 +147,7 @@ function loadPlugin(name)
|
||||
let globalName = 'eruda' + util.upperFirst(name);
|
||||
if (window[globalName]) return;
|
||||
|
||||
util.loadJs('//cdn.jsdelivr.net/npm/eruda-' + name, (isLoaded) =>
|
||||
util.loadJs(`//cdn.jsdelivr.net/npm/eruda-${name}@${pluginVersion[name]}`, isLoaded =>
|
||||
{
|
||||
if (!isLoaded || !window[globalName]) return logger.error('Fail to load plugin ' + name);
|
||||
|
||||
@@ -147,3 +155,8 @@ function loadPlugin(name)
|
||||
emitter.emit(emitter.SHOW, name);
|
||||
});
|
||||
}
|
||||
|
||||
let pluginVersion = {
|
||||
fps: '1.0.2',
|
||||
features: '1.0.0'
|
||||
};
|
||||
|
||||
@@ -7,7 +7,6 @@ import Elements from './Elements/Elements';
|
||||
import Snippets from './Snippets/Snippets';
|
||||
import Resources from './Resources/Resources';
|
||||
import Info from './Info/Info';
|
||||
import Features from './Features/Features';
|
||||
import Sources from './Sources/Sources';
|
||||
import Settings from './Settings/Settings';
|
||||
import util from './lib/util';
|
||||
@@ -35,7 +34,7 @@ module.exports = {
|
||||
_isInit: false,
|
||||
version: VERSION,
|
||||
config, util,
|
||||
Tool, Console, Elements, Network, Sources, Resources, Info, Snippets, Features,
|
||||
Tool, Console, Elements, Network, Sources, Resources, Info, Snippets,
|
||||
get(name)
|
||||
{
|
||||
if (!this._checkInit()) return;
|
||||
@@ -177,7 +176,7 @@ module.exports = {
|
||||
this._entryBtn.initCfg(settings);
|
||||
devTools.initCfg(settings);
|
||||
},
|
||||
_initTools(tool = ['console', 'elements', 'network', 'resources', 'sources', 'info', 'snippets', 'features'])
|
||||
_initTools(tool = ['console', 'elements', 'network', 'resources', 'sources', 'info', 'snippets'])
|
||||
{
|
||||
tool = util.toArr(tool).reverse();
|
||||
|
||||
|
||||
Reference in New Issue
Block a user