GEEHelper

This plugin can help developers leverage VScode's powerful code customization and prompt functions to synchronize code written in VScode with Google Earth engine.

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         GEEHelper
// @namespace    NJFU
// @version      0.2
// @description  This plugin can help developers leverage VScode's powerful code customization and prompt functions to synchronize code written in VScode with Google Earth engine.
// @author       FJC
// @match        https://code.earthengine.google.com/
// @icon         https://code.earthengine.google.com/images/bigicon.png
// @connect      localhost
// @grant        GM_xmlhttpRequest
// @grant        unsafeWindow
// @license MIT
// ==/UserScript==

(function () {
  'use strict';

  //清除行数,可自己定义
  var lineNumber = 5000;
  var fileName = null
  var web_server = 'http://localhost:8887'

  // 添加事件监听器,当用户选择文件时触发
  function inputListener(fileInput, span) {
    fileInput.addEventListener('change', function (event) {
      var file = event.target.files[0];
      fileName = file.name
      span.textContent = fileName
      span.style.opacity = '1'
      readFileContent(file)
      storeFileName(fileName)
    });
  }

  // 存储文件名
  function storeFileName(fileName) {
    localStorage.setItem('fileName', fileName);
  }

  // 读取文件名
  function getStoredFileName() {
    return localStorage.getItem('fileName');
  }

  function selectButton(selectFile, fileInput) {
    selectFile.addEventListener('click', function () {
      fileInput.click()
    })
  }

  function buttonListener(readFileButton) {
    readFileButton.addEventListener('click', function () {

      var storedFileName = getStoredFileName();
      fileName=storedFileName?storedFileName:fileName
      if (!fileName){
        alert('Please select a folder first!')
      }else{
        var url = web_server + '/' + fileName.toString()
      }

      GM_xmlhttpRequest({
        method: 'GET',
        url: url, // 替换为本地 JS 文件的 URL
        headers: { "Content-Type": "text/javascript,charset=utf-8" },
        onload: function (response) {
          var fileContent = response.responseText;
          processFileContent(fileContent)
        }
      });
    });
  }

  function readFileContent(file) {
    var reader = new FileReader();

    // 读取文件完成后的回调函数
    reader.onload = function (event) {
      var fileContent = event.target.result;
      // 去除末尾的空行
      fileContent = fileContent.replace(/\s+$/, '');

      processFileContent(fileContent)

    };

    // 读取文件内容
    reader.readAsText(file);
  }

  // 处理文件内容的函数
  function processFileContent(fileContent) {
    for (var i = 0; i <= lineNumber; i++) {
      unsafeWindow.editor.removeLines()
    }
    unsafeWindow.editor.insert(fileContent);
  }


  // 创建一个文件选择器的HTML元素
  function cssStyle() {

    if (unsafeWindow.editor) {
      var div = document.createElement('div');
      div.className = 'read-update'
      var fileInput = document.createElement('input');
      fileInput.type = 'file';
      var readFileButton = document.createElement('button');
      readFileButton.textContent = 'Update';
      readFileButton.classList.add('goog-button', 'update-button')
      var selectFile = document.createElement('button')
      selectFile.textContent = 'Select File'
      var span = document.createElement('span')

      var storedFileName = getStoredFileName();
      if (storedFileName) {
        // 如果有存储的文件名,则将其设置为文件输入元素的值
        span.textContent = storedFileName;
      } else {
        span.textContent = 'File Name'
      }


      var gm_style = document.querySelector('.gm-style')
      var run_button = document.querySelector('.run-button')
      var header_div = document.querySelector('.panel .header div')

      gm_style.appendChild(div)
      div.appendChild(fileInput);
      div.appendChild(selectFile);
      div.appendChild(span);
      header_div.insertBefore(readFileButton, run_button)

      div.style.position = 'absolute'
      div.style.zIndex = '9999999'
      div.style.top = '90px'
      div.style.right = '10px'
      div.style.display = 'flex'
      div.style.justifyContent = 'center'
      div.style.alignItems = 'center'
      fileInput.style.display = 'none'
      selectFile.style.width = '80px'
      selectFile.style.lineHeight = '20px'
      selectFile.style.backgroundColor = '#FFFFFF'
      selectFile.style.cursor = 'pointer'
      selectFile.style.border = '0'
      selectFile.style.borderRadius = '3px'
      span.style.display = 'inline-block'
      span.style.paddingLeft = '3px'
      span.style.overflow = 'hidden'
      span.style.marginLeft = '10px'
      span.style.textOverflow = 'ellipsis'
      span.style.borderRadius = '3px'
      span.style.width = '80px'
      span.style.lineHeight = '20px'
      span.style.border = '1px solid #EBEBEB'
      span.style.backgroundColor = '#FFFFFF'
      readFileButton.style.width = '55px'

      selectFile.onmouseenter = function () {
        selectFile.style.backgroundColor = '#EBEBEB'
      }
      selectFile.onmouseleave = function () {
        selectFile.style.backgroundColor = '#FFFFFF'
      }

      buttonListener(readFileButton)
      selectButton(selectFile, fileInput, span)
      inputListener(fileInput, span)
      return true
    }

  }

  var timer = setInterval(() => {
    var result = cssStyle()
    if (result) {
      clearInterval(timer);
    }
  }, 5000);
})();