差分
このページの2つのバージョン間の差分を表示します。
両方とも前のリビジョン 前のリビジョン 次のリビジョン | 前のリビジョン 次のリビジョン両方とも次のリビジョン | ||
start [2022/07/27 07:22] – ともやん | start [2022/10/16 09:32] – ともやん | ||
---|---|---|---|
行 1: | 行 1: | ||
< | < | ||
- | <script src="/_media/javascript/requirejs/require-2.3.6.min.js? | + | <script src="https://cdn.jsdelivr.net/npm/vue@3/dist/vue.global.min.js"></ |
- | < | + | <script src="/ |
- | // | + | |
- | var startTime = Date.now(); | + | |
- | | + | |
- | <script src="/ | + | |
<!-- Tomoyan.net Vue.js app start --> | <!-- Tomoyan.net Vue.js app start --> | ||
+ | < | ||
< | < | ||
# | # | ||
行 31: | 行 28: | ||
<WRAP prewrap 100% # | <WRAP prewrap 100% # | ||
< | < | ||
- | <div id="tomoyan_net_app"> | + | <div id="tomoyan_net-app"> |
</ | </ | ||
- | ^ IP アドレス (< | + | ^ IP アドレス (< |
^ ゲートウェイ名\\ < | ^ ゲートウェイ名\\ < | ||
- | ^ CPU Cores\\ < | + | ^ CPU Cores\\ < |
- | ^ [[https:// | + | ^ [[https:// |
- | ^ ダークモード\\ < | + | ^ ダークモード\\ < |
- | ^ [[https:// | + | ^ [[https:// |
^ [[https:// | ^ [[https:// | ||
- | < | ||
< | < | ||
</ | </ | ||
<!-- Tomoyan.net Vue.js app end --> | <!-- Tomoyan.net Vue.js app end --> | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | const { createApp } = Vue | ||
+ | let ua_parser; | ||
+ | const tomoyan_net_app = createApp({ | ||
+ | data() { | ||
+ | return { | ||
+ | remote_addr: | ||
+ | cpu_cores: '', | ||
+ | display_resolution: | ||
+ | browser_resolution: | ||
+ | user_agent: navigator.userAgent, | ||
+ | ua_parser: '', | ||
+ | versions: '', | ||
+ | vue_ver: Vue.version, | ||
+ | } | ||
+ | }, | ||
+ | created() { | ||
+ | this.get_display_resolution(); | ||
+ | this.get_cpu_cores() | ||
+ | |||
+ | window.UAParser = UAParser; | ||
+ | let ua_result = ua_parser = new UAParser(); | ||
+ | let ua_json = ua_result.getResult(); | ||
+ | this.ua_parser = JSON.stringify(ua_json, | ||
+ | |||
+ | this.versions = ' | ||
+ | ' | ||
+ | }, | ||
+ | computed: { | ||
+ | ip_ver() { | ||
+ | return REMOTE_ADDR.indexOf(':' | ||
+ | }, | ||
+ | dark_mode() { | ||
+ | if (matchMedia(' | ||
+ | return ' | ||
+ | } | ||
+ | else { | ||
+ | return matchMedia(' | ||
+ | } | ||
+ | }, | ||
+ | }, | ||
+ | methods: { | ||
+ | get_display_resolution() { | ||
+ | this.display_resolution = screen.width + ' x ' + screen.height; | ||
+ | this.browser_resolution = window.innerWidth + ' x ' + window.innerHeight; | ||
+ | }, | ||
+ | get_cpu_cores() { | ||
+ | this.cpu_cores = (!!navigator.hardwareConcurrency ? | ||
+ | navigator.hardwareConcurrency : | ||
+ | '' | ||
+ | }, | ||
+ | }, | ||
+ | mounted() { | ||
+ | window.onload = () => { | ||
+ | let diffLoadTime = Date.now() - startTime; | ||
+ | console.log(' | ||
+ | } | ||
+ | / | ||
+ | let diffReadyTime = Date.now() - startTime; | ||
+ | console.log(' | ||
+ | }*/ | ||
+ | }, | ||
+ | setup() { | ||
+ | window.addEventListener(' | ||
+ | }, | ||
+ | beforeDestroy() { | ||
+ | window.removeEventListener(' | ||
+ | }, | ||
+ | }).mount('# | ||
+ | </ | ||
</ | </ | ||
</ | </ | ||
行 156: | 行 225: | ||
| [[currency|通貨関連]] | | [[currency|通貨関連]] | ||
- | < | + | \\ |
- | < | + | |
- | "use strict"; | + | |
- | let tomoyan_net_app; | + | |
- | let ua_parser; | + | |
- | require([' | + | |
- | tomoyan_net_app = new Vue({ | + | |
- | el: '# | + | |
- | data: { | + | |
- | user_agent: navigator.userAgent, | + | |
- | ua_parser: '', | + | |
- | display_resolution: | + | |
- | remote_addr: | + | |
- | versions: '', | + | |
- | }, | + | |
- | created: function() { | + | |
- | this.set_display_resolution(); | + | |
- | + | ||
- | window.UAParser = UAParser; | + | |
- | let ua_result = ua_parser = new UAParser(); | + | |
- | let ua_json = ua_result.getResult(); | + | |
- | this.ua_parser = JSON.stringify(ua_json, | + | |
- | + | ||
- | this.versions = ' | + | |
- | ' | + | |
- | }, | + | |
- | computed: { | + | |
- | ip_ver: function() { | + | |
- | return this.remote_addr.indexOf(':' | + | |
- | }, | + | |
- | cpu_cores: function() { | + | |
- | let cpu_cores = (!!navigator.hardwareConcurrency ? | + | |
- | | + | |
- | '' | + | |
- | let cpu_cores_tr = this.$el.querySelector('# | + | |
- | + | ||
- | if (cpu_cores == '' | + | |
- | // | + | |
- | // | + | |
- | cpu_cores = ' | + | |
- | } | + | |
- | else { | + | |
- | cpu_cores += ' core'; | + | |
- | } | + | |
- | + | ||
- | return cpu_cores; | + | |
- | }, | + | |
- | dark_mode: function() { | + | |
- | if (matchMedia(' | + | |
- | return ' | + | |
- | } | + | |
- | else { | + | |
- | return matchMedia(' | + | |
- | } | + | |
- | }, | + | |
- | }, | + | |
- | methods: { | + | |
- | set_display_resolution: | + | |
- | const display_resolution = | + | |
- | screen.width + ' x ' + screen.height + ' pixel ' + | + | |
- | ' | + | |
- | + | ||
- | this.display_resolution = display_resolution; | + | |
- | }, | + | |
- | window: | + | |
- | let diffLoadTime = Date.now() - startTime; | + | |
- | console.log(' | + | |
- | }, | + | |
- | / | + | |
- | let diffReadyTime = Date.now() - startTime; | + | |
- | console.log(' | + | |
- | },*/ | + | |
- | }, | + | |
- | mounted: function() { | + | |
- | window.addEventListener(' | + | |
- | }, | + | |
- | beforeDestroy: | + | |
- | window.removeEventListener(' | + | |
- | }, | + | |
- | }); | + | |
- | }); | + | |
- | </ | + | |
- | </ | + | |
このサイトを広告なしで見るには...\\ | このサイトを広告なしで見るには...\\ | ||
[[web: | [[web: | ||
[[web: | [[web: | ||
の利用をお勧めします😉\\ | の利用をお勧めします😉\\ | ||
+ | \\ | ||
+ | <wrap em> | ||
+ | ページによっては大量の出力結果を含むため、__レンダリング処理でプチフリーズ__します😱😇\\ | ||
+ | 快適に閲覧するには [[https:// |