pixflow-upgrade-planning 0.0.9 → 0.0.32

package/index.js

@@ -1,21 +1,15 @@
 const parse = new DOMParser();
 const fs = require("fs");
 const path = require("path");
-const price_details = require("pixflow-price-details");
-const PurchaseCodeActivate = require("pixflow-purchase-code-activate");
-const PixflowCEPManifest = require("pixflow-cep-manifest");
 
 class PixflowUpgradePlanning extends HTMLElement {
 
     constructor(){
         super();
-        self = this;
         this.port = localStorage.getItem("port");
     }
 
-    async connectedCallback(){
-        self = this;
-        this.cep_manifest = new PixflowCEPManifest();
+    connectedCallback(){
         const style = document.createElement("style");
         style.textContent = fs.readFileSync(path.join(__dirname, "styles", `${this.port}.css`));
         this.appendChild(style);
@@ -23,70 +17,19 @@ class PixflowUpgradePlanning extends HTMLElement {
         this.template = parse.parseFromString(fs.readFileSync(path.join(__dirname, "template.html")).toString("utf8"), "text/html");
         this.appendChild(this.template.querySelector(`div.${this.port}`));
 
+        this.querySelector(`img.close`).addEventListener("click", this.close_click);
+
         if(this.port == "pixflow"){
-            const p = await price_details(this.cep_manifest.get_post_id());
-            this.querySelector("div.pixflow > div.plan > div.single > div > div").innerHTML = p.single;
-            this.querySelector("div.pixflow > div.plan > div.team > div > div").innerHTML = p.team;
             this.appendChild(this.template.querySelector("div.purchase-code"));
-            this.querySelector("div.activate-code").addEventListener("click", this.activate_code_click);
-            this.querySelector("div.pixflow > div.activate-code-block > button").addEventListener("click", this.activate_code_block_click);
-            this.querySelector("div.purchase-code > div.form > div.back-upgrade-plan").addEventListener("click", this.back_upgrade_plan_click);
-            this.querySelector("div.purchase-code > div > button").addEventListener("click", this.purchase_code_click);
-            this.querySelectorAll("div.plan > div > div").forEach(function(element){
-                element.addEventListener("click", function(){
-                    element.parentNode.parentNode.querySelector("div.plan > div > div.active").classList.remove("active");
-                    this.classList.add("active");
-                })
+            this.querySelector("div.purchase-code > img.close").addEventListener("click", function(){
+                this.parentNode.classList.remove("active");
             })
+            this.querySelector("div.activate-code").addEventListener("click", this.activate_code_click);
         }
 
-        this.querySelectorAll(`img.close`).forEach(function(element){
-            element.addEventListener("click", element.parentNode.parentNode.close_click)
-        });
-
-    }
-
-    async purchase_code_click(e){
-        e.preventDefault();
-        const purchase_code_activate = new PurchaseCodeActivate(e.target.parentNode.parentNode.querySelector("input[type='text']").value);
-        const result = await purchase_code_activate.check_user_license_type();
-        var index = 3;
-        if(result.license_type == "single" || result.license_type == "team"){
-            const check_device_query = await purchase_code_activate.check_device_query(result.license_type);
-            if(check_device_query.error == 0){
-                index = 1;
-                localStorage.setItem("active", result.license_type);
-            } else if(check_device_query.error == -2){
-                index = 2;
-            }
-        }
-        e.target.parentNode.querySelector(`div.message > p:nth-child(${index})`).classList.add("active");
-        if(index == 1){
-            setTimeout(() => {
-                window.location.href = "./index.html";
-            }, 1200);
-        }
-    }
-
-    activate_code_block_click(e){
-        const cep_manifest = new PixflowCEPManifest();
-        const item_name = cep_manifest.get_item_name();
-        const license = this.parentNode.parentNode.querySelector("div.plan > div > div.active").parentNode.className.split(" ")[0];
-        var link = `https://pixflow.net/product/px-${item_name}/?active-license=free`;
-        if(license != "free")
-            link = `https://pixflow.net/aff/${item_name}-plugin-${license}/`;
-        window.cep.util.openURLInDefaultBrowser(link);
-    }
-
-    back_upgrade_plan_click(e){
-        const purchase_code_panel = e.target.parentNode.parentNode;
-        purchase_code_panel.classList.remove("active");
-        const upgrade_planning_panel = purchase_code_panel.parentNode.querySelector("div.pixflow");
-        upgrade_planning_panel.classList.add("active");
     }
 
     activate_code_click(e){
-        e.target.parentNode.parentNode.classList.remove("active");
         e.target.parentNode.parentNode.parentNode.querySelector("div.purchase-code").classList.add("active");
     }
 
@@ -94,8 +37,12 @@ class PixflowUpgradePlanning extends HTMLElement {
         this.querySelector(`div.${this.port}`).classList.add("active");
     }
 
+    close(){
+        this.querySelector(`div.${this.port}`).classList.remove("active");
+    }
+
     close_click(e){
-        e.target.parentNode.classList.remove("active");
+        e.target.parentNode.parentNode.close();
     }
 
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pixflow-upgrade-planning",
-  "version": "0.0.9",
+  "version": "0.0.32",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -8,10 +8,5 @@
   },
   "keywords": [],
   "author": "",
-  "license": "ISC",
-  "dependencies": {
-    "pixflow-price-details": "^1.0.0",
-    "pixflow-purchase-code-activate": "^1.0.0",
-    "pixflow-cep-manifest": "^1.0.0"
-  }
+  "license": "ISC"
 }

package/styles/pixflow.css

@@ -7,7 +7,7 @@
     }
 }
 
-pixflow-upgrade-planning > div.pixflow > div.plan > div, pixflow-upgrade-planning > div.purchase-code button {
+pixflow-upgrade-planning > div.pixflow > div.plan > div, pixflow-upgrade-planning div.purchase-code button {
     cursor: pointer;
 }
 
@@ -121,13 +121,14 @@ div.activate-code-block {
     background: linear-gradient(180deg, rgba(12,12,12,0) 0%, rgba(12,12,12,1) 34%, rgba(12,12,12,1) 100%);
 }
 
-pixflow-upgrade-planning > div.pixflow button {
+pixflow-upgrade-planning > div.pixflow button, pixflow-upgrade-planning > div.purchase-code > form > button {
     width: 147px;
     height: 34px;
     border-radius: 17px;
     background-color: #005dff;
     color: #fff;
     transition: filter 200ms;
+    border: 0;
 }
 
 pixflow-upgrade-planning > div.pixflow > div:nth-child(5) {
@@ -246,8 +247,8 @@ pixflow-upgrade-planning div.close {
     height: 27px;
 }
 
-pixflow-upgrade-planning > div.purchase-code {
-    display: none;
+pixflow-upgrade-planning div.purchase-code {
+    display: flex;
     flex-direction: column;
     position: fixed;
     top: calc(100vh + 10px);
@@ -260,55 +261,46 @@ pixflow-upgrade-planning > div.purchase-code {
     border-radius: 17px 17px 0px 0px;
     z-index: 1001;
     align-items: center;
-    justify-content: space-between;
     font-family: 'Inter';
     font-style: normal;
     font-weight: 700;
     font-size: 12px;
     transition: top 400ms;
     background: linear-gradient(180deg, #005DFF -86.53%, #2273FF -13.89%, #0C0C0C 47.55%, rgb(221 0 27) 47.56%, #0C0C0C 47.57%);
+    justify-content: space-between;
 }
 
-pixflow-upgrade-planning > div.purchase-code.active {
+pixflow-upgrade-planning div.purchase-code.active {
     top: calc(100vh - 95%);
 }
 
-pixflow-upgrade-planning > div.purchase-code > div.form > input[type=text]:nth-child(1) {
-    margin-top: 39px;
+pixflow-upgrade-planning div.purchase-code > form > input[type=text]:nth-child(1) {
     background: rgb(185 210 255 / 10%);
 }
 
-pixflow-upgrade-planning > div.purchase-code > div.form > div {
+pixflow-upgrade-planning div.purchase-code > form > div {
     color: #7C879A;
     margin: 15px 0;
     cursor: pointer;
 }
 
-pixflow-upgrade-planning > div.purchase-code > img:nth-child(1) {
+pixflow-upgrade-planning div.purchase-code > img:nth-child(1) {
     position: absolute;
     z-index: -1;
     top: -8px;
 }
 
-pixflow-upgrade-planning > div.purchase-code > img:nth-child(2) {
-    margin-top: 8px;
+pixflow-upgrade-planning div.purchase-code > img:nth-child(2) {
     position: absolute;
+    top: 0;
 }
 
-pixflow-upgrade-planning > div.purchase-code > img:nth-child(3) {
-    margin-top: 82px;
-}
-
-pixflow-upgrade-planning > div.purchase-code.active, div#block.active, div#logout.active, div#revoke-access.active, div#store.active, #font-selector.active {
-    opacity: 1;
-    display: flex!important;
-}
-
-pixflow-upgrade-planning > div.purchase-code > div {
+pixflow-upgrade-planning div.purchase-code > div {
+    margin-top: 0px;
     color: #7C879A;
 }
 
-pixflow-upgrade-planning > div.purchase-code > p.describe {
+pixflow-upgrade-planning div.purchase-code > p.describe {
     font-family: Inter;
     font-style: normal;
     font-weight: bold;
@@ -320,18 +312,18 @@ pixflow-upgrade-planning > div.purchase-code > p.describe {
     margin-top: 69px;
 }
 
-pixflow-upgrade-planning > div.purchase-code > p {
+pixflow-upgrade-planning div.purchase-code > p {
     width: fit-content;
 }
 
-pixflow-upgrade-planning > div.purchase-code > div.form {
+pixflow-upgrade-planning div.purchase-code > form {
     display: flex;
     justify-content: space-between;
     align-items: center;
     flex-direction: column;
 }
 
-pixflow-upgrade-planning > div.purchase-code > div.form > input[type="text"] {
+pixflow-upgrade-planning div.purchase-code > form > input[type="text"] {
     background-color: rgba(226, 226, 226, 0.6);
     border: 0;
     color: #8D8D8D;
@@ -348,21 +340,21 @@ pixflow-upgrade-planning > div.purchase-code > div.form > input[type="text"] {
     margin: 0;
 }
 
-pixflow-upgrade-planning > div.purchase-code > div.form > input[type="text"]::selection {
+pixflow-upgrade-planning div.purchase-code > form > input[type="text"]::selection {
     filter: invert(1);
 }
 
-pixflow-upgrade-planning > div.purchase-code > div.form > p {
+pixflow-upgrade-planning div.purchase-code > form > p {
     color: #fff;
     height: 15px;
 }
 
-pixflow-upgrade-planning > div.purchase-code > p {
+pixflow-upgrade-planning div.purchase-code > p {
     width: fit-content;
     text-align: center;
 }
 
-pixflow-upgrade-planning > div.purchase-code > p.buy {
+pixflow-upgrade-planning div.purchase-code > p.buy {
     font-family: Inter;
     font-style: normal;
     font-weight: 500;
@@ -373,50 +365,26 @@ pixflow-upgrade-planning > div.purchase-code > p.buy {
     color: #FFFFFF;
 }
 
-pixflow-upgrade-planning > div.purchase-code > p.buy > a {
+pixflow-upgrade-planning div.purchase-code > p.buy > a {
     color: #5c92ff;
     text-decoration: underline;
     transition: color 0.2s;
 }
 
-pixflow-upgrade-planning > div.purchase-code > p.buy > a:hover {
+pixflow-upgrade-planning div.purchase-code > p.buy > a:hover {
     color: #0A48C4;
 }
 
-pixflow-upgrade-planning > div.purchase-code > p.help > a {
+pixflow-upgrade-planning div.purchase-code > p.help > a {
     text-decoration: underline;
 }
 
-pixflow-upgrade-planning > div.purchase-code > p.buy > a {
+pixflow-upgrade-planning div.purchase-code > p.buy > a {
     color: #5c92ff;
     text-decoration: underline;
     display: contents;
 }
 
-pixflow-upgrade-planning > div.purchase-code div.result {
-    color: #FFFFFF;
-}
-
-pixflow-upgrade-planning > div.purchase-code > div.form > div.message > p {
-    display: none;
-}
-
-pixflow-upgrade-planning > div.purchase-code > div.form > div.message > p.active {
-    display: block;
-}
-
-pixflow-upgrade-planning > div.purchase-code button {
+pixflow-upgrade-planning div.purchase-code div.result {
     color: #FFFFFF;
-    font-family: Inter;
-    font-style: normal;
-    font-weight: 500;
-    font-size: 14px;
-    border: 0;
-    outline: none;
-    transition: background-color 0.2s;
-    cursor: pointer;
-    padding: 9px;
-    margin: 9px;
-    border-radius: 7px;
-    background-color: #005dff;
-}
+}

package/template.html

@@ -60,14 +60,10 @@
     <img src="./node_modules/pixflow-upgrade-planning/images/drawer.svg" class="close">
     <img src="./node_modules/pixflow-upgrade-planning/images/pixflow/purchase-code.svg">
     <p class="describe">Use the code you received after the purchase process to activate the plugin</p>
-    <div class="form">
+    <form>
         <input type="text" spellcheck="false" placeholder="Purchase code">
-        <div class="message">
-            <p>Activation was successful</p>
-            <p>Your code has been activated on 1 machines. Revoke them and try again.</p>
-            <p>Invalid purchase code!</p>
-        </div>
+        <p class="message"></p>
         <button>ACTIVATE</button>
         <div class="back-upgrade-plan">Purchase Pro Membership</div>
-    </div>
+    </form>
 </div>