opt code

Author: zmisgod

README.md

@@ -6,6 +6,10 @@
 - it has some useful functions you will use it frequently
 - you can add your custom script to some websites
 
+## environment
+
+This project need node <= `15.14.0`, we recommend you use `15.14.0` to develop
+
 ## Add your custom script
 
 1. find `src/script/content/`folder
@@ -30,8 +34,3 @@ npm run dev
 # build for production with minification
 npm run build
 ```
-
-## changelog
-
-- 09-20 add `global time` in `time conversion`、`text decoder`, make `content_script.js` more developed
-- 09-19 add `time conversion`、`json formater`, `text gegex`

dist/build.js

@@ -1,16 +1,30 @@
 <template>
   <div id="app" :class='{"fixedWidth": !isFull, "fullWidth" :isFull }'>
     <el-tabs v-model="nowType">
-    <el-tab-pane label="时间转换" name="time"><Time /></el-tab-pane>
+    <el-tab-pane label="常用" name="normal">
+      <div class="normal-container">
+        <div class="normal-item">
+          <div class="normal-title">时间处理</div>
+          <Time />
+        </div>
+        <hr />
+        <div class="normal-item">
+          <div class="normal-title">计算器</div>
+          <Cal />
+        </div>
+        <hr />
+        <div class="normal-item">
+          <div class="normal-title">编解码</div>
+          <Decode />
+        </div>
+      </div>
+    </el-tab-pane>
     <el-tab-pane label="Json格式化" name="json"><Json :isFull = "isFull"/></el-tab-pane>
-    <el-tab-pane label="解码" name="decode"><Decode /></el-tab-pane>
-    <el-tab-pane label="计算" name="cal"><Cal /></el-tab-pane>
     <el-tab-pane label="链接" name="link"><Link /></el-tab-pane>
-    <el-tab-pane label="其他" name="about"><Other /></el-tab-pane>
     <el-tab-pane label="模拟请求" v-if="isFull" name="sim"><Sim /></el-tab-pane>
     <el-tab-pane label="JsonToGo" name="jsonToGo"><JsonToGo /></el-tab-pane>
     <el-tab-pane label="HtmlShow" name="HtmlShow"><HtmlShow /></el-tab-pane>
-    <el-tab-pane label="Iptv" name="Iptv"><Iptv /></el-tab-pane>
+    <el-tab-pane label="Iptv"  v-if="isFull" name="Iptv"><Iptv /></el-tab-pane>
   </el-tabs>
   </div>
 </template>
@@ -19,7 +33,6 @@
 import Time from './components/Time.vue';
 import Json from './components/Json.vue';
 import Decode from './components/Decode.vue';
-import Other from './components/Other.vue';
 import Cal from './components/Cal.vue';
 import Sim from './components/Sim.vue';
 import JsonToGo from './components/JsonToGo.vue';
@@ -31,8 +44,8 @@ export default {
   name: 'app',
   data() {
     return {
-      nowType: 'time',
-      isFull: true,
+      nowType: 'normal',
+      isFull: false,
     };
   },
   created() {
@@ -44,7 +57,6 @@ export default {
   components: {
     Time,
     Json,
-    Other,
     Decode,
     Cal,
     Sim,
@@ -88,4 +100,14 @@ li {
 a {
   color: #42b983;
 }
+.normal-container{
+  .normal-item{
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    .normal-title{
+      font-size: 14px;
+    }
+  }
+}
 </style>

dist/build.js.map

@@ -7,17 +7,19 @@
       v-model="originalText">
     </el-input>
     <div class="btn-container">
-      <div>
+      <div class="btn-item">
           <el-button class="one-btn" size="mini" @click="urlEncode">UrlEncode</el-button>
+          <el-button class="one-btn" size="mini" @click="urlDecode">UrlDecode</el-button>
+      </div>
+      <div class="btn-item">
           <el-button class="one-btn" size="mini" @click="cnToUtf8">中文转UTF-8</el-button>
-          <el-button class="one-btn" size="mini" @click="cnToUnicode">中文转Unicode</el-button>
+          <el-button class="one-btn" size="mini" @click="utf8ToCn">UTF-8转中文</el-button>
       </div>
-      <div>
-        <el-button class="one-btn" size="mini" @click="urlDecode">UrlDecode</el-button>
-        <el-button class="one-btn" size="mini" @click="utf8ToCn">UTF-8转中文</el-button>
+      <div class="btn-item">
+        <el-button class="one-btn" size="mini" @click="cnToUnicode">中文转Unicode</el-button>
         <el-button class="one-btn" size="mini" @click="unicodeToCn">Unicode转中文</el-button>
       </div>
-      <div>
+      <div class="btn-item">
         <el-button class="one-btn" size="mini" @click="md5Fun">MD5</el-button>
       </div>
     </div>
@@ -82,8 +84,14 @@ export default {
 </script>
 <style lang="sass" scoped>
 .decode-container
+  width: 100%
   .btn-container
-    padding: 10px 0
+    display: flex
+    padding: 5Px 0
+    .btn-item
+      display: flex;
+      flex-direction: column;
+      margin-right: 5px
   .one-btn
-    margin-bottom: 10px
+    margin-left: 0
 </style>

src/App.vue

@@ -5,7 +5,6 @@
         type="textarea"
         placeholder="请输入html"
         v-model="showHtml"
-        :autosize="true"
       ></el-input>
     </div>
     <div class="show-json" v-html="showHtml"></div>
@@ -23,13 +22,4 @@ export default {
 </script>
 <style lang="sass" scoped>
 .full-width
-  display: flex
-  flex-wrap: wrap
-  justify-content: space-between
-  .or-json
-    width: 48%
-    margin-right: 10px
-  .show-json
-    width: 48%
-    padding-top: 0
 </style>

src/components/Decode.vue

@@ -27,6 +27,7 @@
       </div>
       <div>
           <el-table
+            v-if="list.length > 0"
             ref="dataTable"
             @selection-change="handleSelectionChange"
             :data="list"
@@ -144,8 +145,11 @@ export default {
       for (let i = 0; i < this.list.length; i += 1) {
         this.nowIsCheck = true;
         fetchGet(this.list[i].url).then((res) => {
-          console.log(res);
-          this.list[i].status = 1;
+          if (this.checkFirstLineIsRight(res.data)) {
+            this.list[i].status = 1;
+          } else {
+            throw new Error('first line is not m3u');
+          }
           this.nowCheckCount += 1;
         }).catch((err) => {
           console.log(err);
@@ -158,10 +162,13 @@ export default {
       if (this.source !== '') {
         this.list = [];
         const spiStr = this.source.split('\n');
-        this.firstTitle = spiStr[0];
+        this.firstTitle = '';
+        if (spiStr.length > 0) {
+          [this.firstTitle] = spiStr;
+        }
         if (spiStr.length > 1) {
           const len = (spiStr.length - 1) / 2;
-          for (let i = 1; i < len; i += 1) {
+          for (let i = 0; i < len; i += 1) {
             const index = 1 + (i * 2);
             this.parseRowToData(spiStr[index], spiStr[index + 1]);
           }
@@ -196,7 +203,7 @@ export default {
         regex = /tvg-id="(.*)"/mg;
       }
       let m;
-      let value;
+      let value = '';
       while ((m = regex.exec(str)) !== null) {
         if (m.index === regex.lastIndex) {
           regex.lastIndex++;
@@ -207,7 +214,22 @@ export default {
           }
         });
       }
-      return value.split('" ')[0];
+      if (value !== '') {
+        return value.split('" ')[0];
+      }
+      return '';
+    },
+    checkFirstLineIsRight(content) {
+      const contextExp = content.split('\n');
+      if (contextExp.length > 0) {
+        const firstLine = contextExp[0];
+        console.log(firstLine);
+        if (firstLine.replace('#EXTM3U', '') === firstLine) {
+          return false;
+        }
+        return true;
+      }
+      return false;
     },
     parseName(name) {
       const row = name.split(',');

src/components/Html.vue

@@ -6,12 +6,12 @@
         placeholder="请输入json"
         @change="inputJson"
         v-model="orJson"
-        :autosize="true"
       ></el-input>
     </div>
     <div class="show-json">
       <el-input
         type="textarea"
+        v-if="orJson !== ''"
         placeholder="显示的json"
         v-model="showJson"
         :autosize="true"
@@ -33,7 +33,9 @@ export default {
   },
   methods: {
     inputJson() {
-      this.doSort(1);
+      if (this.orJson !== '') {
+        this.doSort(1);
+      }
     },
     doSort(type) {
       let obj;
@@ -97,56 +99,56 @@ export default {
       // json对象转换为字符串变量
       let jsonString = JSON.stringify(jsonObj);
       // 存储需要特殊处理的字符串段
-      const _index = [];
+      const tempIndex = [];
       // 存储需要特殊处理的“再数组中的开始位置变量索引
-      let _indexStart = null;
+      let tempIndexStart = null;
       // 存储需要特殊处理的“再数组中的结束位置变量索引
-      let _indexEnd = null;
+      let tempIndexEnd = null;
       // 将jsonString字符串内容通过\r\n符分割成数组
       let jsonArray = [];
       // 正则匹配到{,}符号则在两边添加回车换行
-      jsonString = jsonString.replace(/([\{\}])/g, '\r\n$1\r\n');
+      jsonString = jsonString.replace(/([{}])/g, '\r\n$1\r\n');
       // 正则匹配到[,]符号则在两边添加回车换行
-      jsonString = jsonString.replace(/([\[\]])/g, '\r\n$1\r\n');
+      jsonString = jsonString.replace(/([[\]])/g, '\r\n$1\r\n');
       // 正则匹配到,符号则在两边添加回车换行
-      jsonString = jsonString.replace(/(\,)/g, '$1\r\n');
+      jsonString = jsonString.replace(/(,)/g, '$1\r\n');
       // 正则匹配到要超过一行的换行需要改为一行
       jsonString = jsonString.replace(/(\r\n\r\n)/g, '\r\n');
       // 正则匹配到单独处于一行的,符号时需要去掉换行，将,置于同行
-      jsonString = jsonString.replace(/\r\n\,/g, ',');
+      jsonString = jsonString.replace(/\r\n,/g, ',');
       // 特殊处理双引号中的内容
       jsonArray = jsonString.split('\r\n');
       jsonArray.forEach((node, index) => {
         // 获取当前字符串段中"的数量
-        const num = node.match(/\"/g) ? node.match(/\"/g).length : 0;
+        const num = node.match(/"/g) ? node.match(/"/g).length : 0;
         // 判断num是否为奇数来确定是否需要特殊处理
-        if (num % 2 && !_indexStart) {
-          _indexStart = index;
+        if (num % 2 && !tempIndexStart) {
+          tempIndexStart = index;
         }
-        if (num % 2 && _indexStart && _indexStart != index) {
-          _indexEnd = index;
+        if (num % 2 && tempIndexStart && tempIndexStart !== index) {
+          tempIndexEnd = index;
         }
         // 将需要特殊处理的字符串段的其实位置和结束位置信息存入，并对应重置开始时和结束变量
-        if (_indexStart && _indexEnd) {
-          _index.push({
-            start: _indexStart,
-            end: _indexEnd,
+        if (tempIndexStart && tempIndexEnd) {
+          tempIndex.push({
+            start: tempIndexStart,
+            end: tempIndexEnd,
           });
-          _indexStart = null;
-          _indexEnd = null;
+          tempIndexStart = null;
+          tempIndexEnd = null;
         }
       });
       // 开始处理双引号中的内容，将多余的"去除
-      _index.reverse().forEach((item) => {
+      tempIndex.reverse().forEach((item) => {
         const newArray = jsonArray.slice(item.start, item.end + 1);
         jsonArray.splice(item.start, item.end + 1 - item.start, newArray.join(''));
       });
       // 奖处理后的数组通过\r\n连接符重组为字符串
       jsonString = jsonArray.join('\r\n');
       // 将匹配到:后为回车换行加大括号替换为冒号加大括号
-      jsonString = jsonString.replace(/\:\r\n\{/g, ':{');
+      jsonString = jsonString.replace(/:\r\n\{/g, ':{');
       // 将匹配到:后为回车换行加中括号替换为冒号加中括号
-      jsonString = jsonString.replace(/\:\r\n\[/g, ':[');
+      jsonString = jsonString.replace(/:\r\n\[/g, ':[');
       // 将上述转换后的字符串再次以\r\n分割成数组
       jsonArray = jsonString.split('\r\n');
       // 将转换完成的字符串根据PADDING值来组合成最终的形态

src/components/Iptv.vue

@@ -1,10 +1,10 @@
 <template>
   <div class="json-container">
     <div class="json-text">
-      <el-input type="textarea" rows=8 placeholder="请输入json" @change="inputJson" v-model="jsonText">
+      <el-input type="textarea" rows=2 placeholder="请输入json" @change="inputJson" v-model="jsonText">
       </el-input>
     </div>
-    <div class="show-go">
+    <div class="show-go" v-if="goStruct !== ''">
       <el-input type="textarea" rows=8 placeholder="显示的GoStruct" v-model="goStruct"></el-input>
     </div>
   </div>

src/components/Json.vue

@@ -64,7 +64,7 @@
 export default {
   data() {
     return {
-      linkList: [],
+      linkList: [{ url: 'https://regex101.com/', title: '正则' }, { url: 'http://github.com/zhimin-dev/chrome-extension', title: '本插件Github' }],
       showExport: false,
       exportJson: '',
       nowType: 0,