API tools faq
paste
Advertisement
doritosYuh

popup-signedin.html

doritosYuh
Jul 9th, 2025
99
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 11.45 KB | Source Code | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5.   <link rel="stylesheet" href="popup.css">
  6.   <meta charset="UTF-8" />
  7.   <title>Patent Highlighter</title>
  8.   <style>
  9.     body {
  10.       font-family: Arial, sans-serif;
  11.       margin: 0;
  12.       padding: 16px;
  13.     }
  14.  
  15.     .body2 {
  16.       position: fixed;
  17.       width: 250px;
  18.       top: 10px
  19.     }
  20.  
  21.     .top-bar {
  22.       background-color: rgb(255, 255, 255);
  23.       color: white;
  24.       display: flex;
  25.       align-items: center;
  26.       padding: 10px;
  27.       height: 50px;
  28.     }
  29.  
  30.     .top-bar img {
  31.       height: 50px;
  32.       margin-right: 10px;
  33.     }
  34.  
  35.     button {
  36.       padding: 8px 12px;
  37.       margin-bottom: 8px;
  38.       cursor: pointer;
  39.       border: none;
  40.       border-radius: 4px;
  41.       background-color: #15a5e7;
  42.       color: white;
  43.       font-size: 14px;
  44.     }
  45.  
  46.     icon {
  47.       padding: 1px 1px;
  48.       margin-bottom: 8px;
  49.       cursor: pointer;
  50.       border: none;
  51.       border-radius: 50px;
  52.       background-color: #ffffff;
  53.       color: white;
  54.       font-size: 0px;
  55.     }
  56.  
  57.     icon:hover {
  58.       background-color: #ffffff;
  59.     }
  60.  
  61.     button.hidden {
  62.       display: none;
  63.     }
  64.  
  65.     button:hover {
  66.       background-color: #0f75a5;
  67.     }
  68.  
  69.     select {
  70.       width: 100%;
  71.       padding: 8px;
  72.       margin-bottom: 16px;
  73.       border: 1px solid #ccc;
  74.       border-radius: 4px;
  75.     }
  76.  
  77.     #status {
  78.       margin-bottom: 16px;
  79.       font-size: 14px;
  80.       font-weight: bold;
  81.     }
  82.  
  83.     #signOutBtn {
  84.       background-color: #15a5e7;
  85.     }
  86.  
  87.     #signOutBtn:hover {
  88.       background-color: #0f75a5;
  89.     }
  90.  
  91.     #loadProjectBtn {
  92.       background-color: #15a5e7;
  93.     }
  94.  
  95.     #loadProjectBtn:hover {
  96.       background-color: #0f75a5;
  97.     }
  98.  
  99.     #removeHighlightBtn {
  100.       background-color: #f44336;
  101.     }
  102.  
  103.     #removeHighlightBtn:hover {
  104.       background-color: #e53935;
  105.     }
  106.  
  107.     .button-group {
  108.       display: flex;
  109.       flex-direction: column;
  110.       gap: 3px;
  111.     }
  112.  
  113.     .row {
  114.       display: flex;
  115.       gap: 10px;
  116.     }
  117.  
  118.     .fitEntirePage {
  119.       width: 100%;
  120.       max-width: none;
  121.       margin: 0;
  122.       padding: 400px;
  123.       box-sizing: border-box;
  124.     }
  125.  
  126.     p {
  127.       white-space: pre-wrap;
  128.       width: 100%;
  129.     }
  130.  
  131.     .highlight {
  132.       background-color: yellow;
  133.       font-weight: bold;
  134.     }
  135.  
  136.     /* Popup Modal Styling */
  137.     .overlay {
  138.       position: fixed;
  139.       top: 0;
  140.       left: 0;
  141.       z-index: 999;
  142.       background: transparent;
  143.       /* Important */
  144.       padding: 0;
  145.       margin: 0;
  146.       border-radius: 0;
  147.     }
  148.  
  149.  
  150.     .overlay.hidden {
  151.       display: none;
  152.     }
  153.  
  154.     .comment-popup {
  155.       margin-top: 10px;
  156.       background-color: #15a5e7;
  157.       padding: 16px;
  158.       border-radius: 12px;
  159.       box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
  160.       width: 320px;
  161.     }
  162.  
  163.     @keyframes fadeIn {
  164.       from {
  165.         transform: scale(0.95);
  166.         opacity: 0;
  167.       }
  168.  
  169.       to {
  170.         transform: scale(1);
  171.         opacity: 1;
  172.       }
  173.     }
  174.  
  175.     .user-info {
  176.       display: flex;
  177.       align-items: center;
  178.       gap: 10px;
  179.       margin-bottom: 15px;
  180.     }
  181.  
  182.     .user-info img {
  183.       background-color: white;
  184.       width: 50px;
  185.       height: 40px;
  186.       border-radius: 50%;
  187.       object-fit: cover;
  188.       border: 1.3px solid black;
  189.     }
  190.  
  191.     .user-info p {
  192.       margin: 0;
  193.       font-weight: bold;
  194.       font-size: 16px;
  195.     }
  196.  
  197.     .comment-popup input[type="text"] {
  198.       width: 100%;
  199.       padding: 10px 12px;
  200.       font-size: 14px;
  201.       border: 2px solid red;
  202.       border-radius: 8px;
  203.       margin-bottom: 0;
  204.       box-sizing: border-box;
  205.     }
  206.  
  207.     .buttons {
  208.       margin-top: 12px;
  209.       display: flex;
  210.       justify-content: flex-end;
  211.       gap: 10px;
  212.     }
  213.  
  214.     .cancel,
  215.     .save {
  216.       padding: 10px 18px;
  217.       border: none;
  218.       font-size: 14px;
  219.       cursor: pointer;
  220.       transition: background-color 0.2s ease;
  221.     }
  222.  
  223.     button.cancel {
  224.       background: gray;
  225.       color: white;
  226.       padding: 10px 16px;
  227.       border: none;
  228.       border-radius: 14px;
  229.     }
  230.  
  231.     button.save {
  232.       background: green;
  233.       color: white;
  234.       padding: 10px 16px;
  235.       border: none;
  236.       border-radius: 14px;
  237.     }
  238.  
  239.     button:hover {
  240.       filter: brightness(85%);
  241.     }
  242.  
  243.     textarea#commentInput {
  244.       width: 100%;
  245.       min-height: 40px;
  246.       font-size: 14px;
  247.       font-family: sans-serif;
  248.       padding: 12px;
  249.       border-radius: 10px;
  250.       resize: none;
  251.       overflow: hidden;
  252.       box-sizing: border-box;
  253.       border: none;
  254.       /* no border */
  255.       background-color: #f2f2f2;
  256.     }
  257.   </style>
  258. </head>
  259.  
  260. <body>
  261.   <div class="body2">
  262.     <div class="top-bar">
  263.       <img src="pplusicon2.png" alt="Icon">
  264.       <span>Patent Highlighter</span>
  265.     </div>
  266.  
  267.     <h3>Welcome!</h3>
  268.     <div id="status">Logged in as user.email</div>
  269.     <button id="signOutBtn">Sign Out</button>
  270.  
  271.     <div class="icon-row">
  272.       <icon class="icon-button" id="toggle-buttons">
  273.         <img src="toolkit1.png" alt="Icon 1" class="icon-image">
  274.       </icon>
  275.     </div>
  276.  
  277.     <div id="projectSection">
  278.       <label for="projectName">Project Name</label>
  279.       <input type="text" id="projectName" placeholder="My Project" style="margin-bottom: 2px;" />
  280.       <br>
  281.       <button id="saveProjectBtn">Save Current Patent to Project</button>
  282.  
  283.       <div id="projectSection2">
  284.         <label for="projectDropdown">Load Project</label>
  285.         <select id="projectDropdown">
  286.           <option value="">--Select Project--</option>
  287.         </select>
  288.  
  289.         <div class="button-group">
  290.           <div class="row">
  291.             <button id="loadProjectBtn">Load Project</button>
  292.             <button id="highlightRandomBtn" class="hidden">Smart Highlight</button>
  293.           </div>
  294.           <div class="row">
  295.             <button id="prevHighlightBtn" class="hidden">Previous</button>
  296.             <button id="nextHighlightBtn" class="hidden">Next</button>
  297.           </div>
  298.           <div class="row">
  299.             <button id="noteBtn" class="hidden">Open Comment Menu</button>
  300.           </div>
  301.         </div>
  302.       </div>
  303.     </div>
  304.   </div>
  305.  
  306.   <div class="fitEntirePage">
  307.     <!-- Patent content omitted for brevity -->
  308.   </div>
  309.  
  310.   <!-- COMMENT BUTTON -->
  311.   <div class="overlay hidden" id="notePopup">
  312.     <div class="comment-popup">
  313.       <div class="user-info">
  314.         <img src="userEmail_pfp" alt="User Icon">
  315.         <p>user email</p>
  316.       </div>
  317.       <textarea id="commentInput" placeholder="Add a comment for your patent" rows="1"></textarea>
  318.       <div class="buttons">
  319.         <button class="cancel">Cancel</button>
  320.         <button class="save">Save Comment</button>
  321.       </div>
  322.     </div>
  323.   </div>
  324.  
  325.   <!-- SCRIPTS -->
  326.   <script src="firebase/firebase-app-compat.js"></script>
  327.   <script src="firebase/firebase-auth-compat.js"></script>
  328.   <script src="firebase/firebase-firestore-compat.js"></script>
  329.   <script src="popup-signedin.js"></script>
  330.  
  331.   <!-- ✅ Modal Toggle Script -->
  332.   <script>
  333.     document.getElementById("noteBtn").addEventListener("click", () => {
  334.       document.getElementById("notePopup").classList.remove("hidden");
  335.     });
  336.  
  337.     document.querySelector("#notePopup .cancel").addEventListener("click", () => {
  338.       document.getElementById("notePopup").classList.add("hidden");
  339.     });
  340.  
  341.     // Optional: Show email inside modal
  342.     firebase.auth().onAuthStateChanged(user => {
  343.       if (user) {
  344.         document.querySelector('#notePopup .user-info p').textContent = user.email;
  345.       }
  346.     });
  347.   </script>
  348. </body>
  349.  
  350. </html>
  351.  
  352.  
  353. <div class="fitEntirePage">
  354.   <p>
  355.     <strong>UNITED STATES PATENT APPLICATION</strong><br><br>
  356.  
  357.     <strong>Patent No.:</strong> US 2025/0001234 A1<br>
  358.     <strong>Date of Publication:</strong> January 3, 2025<br>
  359.     <strong>Filed:</strong> July 5, 2025<br><br>
  360.  
  361.     <strong>Title:</strong><br>
  362.     Patent Plus AI: Intelligent Patent Summarization and Trend Prediction System<br><br>
  363.  
  364.     <strong>Inventors:</strong> Tran, Tien (Ho Chi Minh City, Vietnam)<br>
  365.     <strong>Assignee:</strong> Patent Plus Technologies Inc.<br><br>
  366.  
  367.     <strong>Abstract:</strong><br>
  368.     A system and method for AI-driven summarization and trend analysis of patent documents. The system ingests large
  369.     datasets of patents, extracts core claims, summarizes prior art, and predicts emerging innovation trends using
  370.     machine learning techniques. Designed to aid legal professionals, inventors, and researchers in efficiently
  371.     navigating patent landscapes.<br><br>
  372.  
  373.     <strong>Claims:</strong><br>
  374.     1. A method for processing patent documents comprising:<br>
  375.     &nbsp;&nbsp;a) extracting metadata including title, abstract, inventor, and assignee;<br>
  376.     &nbsp;&nbsp;b) using natural language processing to summarize the abstract and claims;<br>
  377.     &nbsp;&nbsp;c) applying a transformer-based AI model to cluster similar inventions by topic and field;<br>
  378.     &nbsp;&nbsp;d) generating a predictive score indicating future patent activity in a specific domain.<br><br>
  379.  
  380.     2. The method of claim 1, further comprising a web-based user interface that highlights key patent terms,
  381.     visualizes citation networks, and allows users to search and filter by AI-generated tags.<br><br>
  382.  
  383.     3. The method of claim 1, wherein the predictive score is derived using a time series model trained on USPTO
  384.     patent filing trends, inventor recurrence, and claim complexity.<br><br>
  385.  
  386.     <strong>Description:</strong><br><br>
  387.  
  388.     <strong>Field of the Invention:</strong><br>
  389.     The present invention relates generally to the field of artificial intelligence and patent law, and more
  390.     specifically to systems that analyze, summarize, and forecast innovation trends based on patent filings.<br><br>
  391.  
  392.     <strong>Background:</strong><br>
  393.     With millions of patents published globally each year, it has become increasingly difficult for professionals to
  394.     track and understand innovation developments. Existing solutions lack intelligent summarization and
  395.     forward-looking analytics.<br><br>
  396.  
  397.     <strong>Summary:</strong><br>
  398.     Patent Plus AI offers a solution by combining transformer-based natural language processing, citation graph
  399.     analysis, and trend forecasting models. The system processes bulk patent data and provides streamlined summaries
  400.     and predictions.<br><br>
  401.  
  402.     <strong>Detailed Description:</strong><br>
  403.     An AI pipeline begins with a document ingestion module that parses .pdf or .xml patent files. A preprocessing
  404.     module extracts structured and unstructured text fields. The summarization engine is built upon a fine-tuned
  405.     BERT variant, while the trend prediction module utilizes Prophet (time-series forecasting) and XGBoost
  406.     classifiers trained on historical patent metrics.<br><br>
  407.  
  408.     The final outputs are rendered in a dashboard view, accessible via browser or API, allowing stakeholders to make
  409.     data-driven IP strategy decisions.<br><br>
  410.  
  411.     <strong>Drawings:</strong><br>
  412.     Fig. 1 – System Architecture of Patent Plus AI<br>
  413.     Fig. 2 – Example of Citation Graph Clustering<br>
  414.     Fig. 3 – Trend Prediction Output for AI Patents (2015–2025)<br><br>
  415.  
  416.     <strong>References Cited:</strong><br>
  417.     • US20190345678A1<br>
  418.     • WO2021145678A1<br>
  419.     • "DeepPatent: Patent Classification with BERT", IEEE, 2022<br><br>
  420.  
  421.     Let me know if you want a PDF version, or to customize the invention (e.g., AI for medicine, green tech, etc.).
  422.   </p>
  423. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!