elementdrawing 1.0.0

package/src/js/http.js

@@ -0,0 +1,446 @@
+/**
+ * HTTP Client
+ * ElementDrawing Framework - Full-featured HTTP client with methods,
+ * interceptors, cancellation, retry, timeout, progress, and caching.
+ */
+
+'use strict';
+
+// ─── Configuration ────────────────────────────────────────────────────────────
+
+const defaultConfig = {
+  baseURL: '',
+  timeout: 30000,
+  headers: {
+    'Content-Type': 'application/json',
+    'Accept': 'application/json',
+  },
+  withCredentials: false,
+  responseType: 'json',
+  maxRetries: 0,
+  retryDelay: 1000,
+  retryBackoff: 2,
+  cache: false,
+  deduplicate: true,
+};
+
+// ─── Interceptor System ───────────────────────────────────────────────────────
+
+function createInterceptorManager() {
+  const requestInterceptors = [];
+  const responseInterceptors = [];
+
+  return {
+    useRequest: function (fulfilled, rejected) {
+      requestInterceptors.push({ fulfilled, rejected });
+      return requestInterceptors.length - 1;
+    },
+    useResponse: function (fulfilled, rejected) {
+      responseInterceptors.push({ fulfilled, rejected });
+      return responseInterceptors.length - 1;
+    },
+    ejectRequest: function (id) { requestInterceptors[id] = null; },
+    ejectResponse: function (id) { responseInterceptors[id] = null; },
+    requestInterceptors,
+    responseInterceptors,
+  };
+}
+
+async function applyRequestInterceptors(config, interceptors) {
+  let result = config;
+  for (const interceptor of interceptors.requestInterceptors) {
+    if (!interceptor) continue;
+    try {
+      result = interceptor.fulfilled ? await interceptor.fulfilled(result) : result;
+    } catch (error) {
+      if (interceptor.rejected) { interceptor.rejected(error); }
+      throw error;
+    }
+  }
+  return result;
+}
+
+async function applyResponseInterceptors(response, interceptors) {
+  let result = response;
+  for (const interceptor of interceptors.responseInterceptors) {
+    if (!interceptor) continue;
+    try {
+      result = interceptor.fulfilled ? await interceptor.fulfilled(result) : result;
+    } catch (error) {
+      if (interceptor.rejected) { result = interceptor.rejected(error); }
+    }
+  }
+  return result;
+}
+
+// ─── Request Deduplication ────────────────────────────────────────────────────
+
+const pendingRequests = new Map();
+
+function generateRequestKey(config) {
+  return (config.method || 'GET') + ':' + config.url + ':' + JSON.stringify(config.params || {});
+}
+
+function deduplicateRequest(key, requestFn) {
+  if (pendingRequests.has(key)) return pendingRequests.get(key);
+  const promise = requestFn().finally(() => pendingRequests.delete(key));
+  pendingRequests.set(key, promise);
+  return promise;
+}
+
+// ─── HTTP Client Class ────────────────────────────────────────────────────────
+
+function HttpClient(config) {
+  this.config = Object.assign({}, defaultConfig, config);
+  this.interceptors = createInterceptorManager();
+  this._authToken = null;
+  this._authHeader = 'Authorization';
+  this._authPrefix = 'Bearer';
+}
+
+/**
+ * Set authentication token.
+ * @param {string} token
+ * @param {string} [header='Authorization']
+ * @param {string} [prefix='Bearer']
+ */
+HttpClient.prototype.setAuthToken = function (token, header, prefix) {
+  this._authToken = token;
+  this._authHeader = header || 'Authorization';
+  this._authPrefix = prefix || 'Bearer';
+};
+
+/**
+ * Remove authentication token.
+ */
+HttpClient.prototype.clearAuthToken = function () {
+  this._authToken = null;
+};
+
+/**
+ * Build full URL from base URL, path, and params.
+ */
+HttpClient.prototype._buildURL = function (url, params) {
+  let fullURL = this.config.baseURL + url;
+
+  if (params) {
+    const searchParams = new URLSearchParams();
+    Object.keys(params).forEach((key) => {
+      if (params[key] !== null && params[key] !== undefined) {
+        searchParams.append(key, params[key]);
+      }
+    });
+    const qs = searchParams.toString();
+    if (qs) fullURL += (fullURL.includes('?') ? '&' : '?') + qs;
+  }
+
+  return fullURL;
+};
+
+/**
+ * Build request headers.
+ */
+HttpClient.prototype._buildHeaders = function (headers) {
+  const result = Object.assign({}, this.config.headers, headers);
+
+  if (this._authToken) {
+    result[this._authHeader] = this._authPrefix + ' ' + this._authToken;
+  }
+
+  return result;
+};
+
+/**
+ * Execute a request with retry logic.
+ */
+HttpClient.prototype._request = function (config) {
+  const self = this;
+  const maxRetries = config.maxRetries !== undefined ? config.maxRetries : this.config.maxRetries;
+  const retryDelay = config.retryDelay !== undefined ? config.retryDelay : this.config.retryDelay;
+  const retryBackoff = config.retryBackoff !== undefined ? config.retryBackoff : this.config.retryBackoff;
+  let attempt = 0;
+
+  async function execute() {
+    attempt++;
+    const controller = new AbortController();
+    const timeoutId = config.timeout ? setTimeout(() => controller.abort(), config.timeout) : null;
+
+    if (config.signal) {
+      config.signal.addEventListener('abort', () => controller.abort());
+    }
+
+    const fetchConfig = {
+      method: config.method || 'GET',
+      headers: config.headers,
+      signal: controller.signal,
+      credentials: config.withCredentials ? 'include' : 'same-origin',
+    };
+
+    if (config.body !== undefined && config.body !== null) {
+      if (config.body instanceof FormData) {
+        fetchConfig.body = config.body;
+        delete fetchConfig.headers['Content-Type'];
+      } else if (typeof config.body === 'object') {
+        fetchConfig.body = JSON.stringify(config.body);
+      } else {
+        fetchConfig.body = config.body;
+      }
+    }
+
+    try {
+      const response = await fetch(config.url, fetchConfig);
+      if (timeoutId) clearTimeout(timeoutId);
+
+      if (!response.ok) {
+        const error = new Error('HTTP Error ' + response.status);
+        error.status = response.status;
+        error.statusText = response.statusText;
+        error.response = response;
+
+        // Retry on server errors
+        if (response.status >= 500 && attempt <= maxRetries) {
+          return retry();
+        }
+
+        throw error;
+      }
+
+      return await self._parseResponse(response, config.responseType);
+    } catch (error) {
+      if (timeoutId) clearTimeout(timeoutId);
+
+      if (error.name === 'AbortError') {
+        throw new Error('Request aborted' + (attempt <= maxRetries ? ' - will retry' : ''));
+      }
+
+      // Retry on network errors
+      if (attempt <= maxRetries) {
+        return retry();
+      }
+
+      throw error;
+    }
+  }
+
+  function retry() {
+    const delay = retryDelay * Math.pow(retryBackoff, attempt - 1);
+    return new Promise((resolve) => setTimeout(resolve, delay)).then(execute);
+  }
+
+  return execute();
+};
+
+/**
+ * Parse response based on response type.
+ */
+HttpClient.prototype._parseResponse = async function (response, responseType) {
+  responseType = responseType || this.config.responseType;
+
+  switch (responseType) {
+    case 'json':
+      try { return await response.json(); }
+      catch (e) { return null; }
+    case 'text': return await response.text();
+    case 'blob': return await response.blob();
+    case 'arrayBuffer': return await response.arrayBuffer();
+    case 'formData': return await response.formData();
+    default: return await response.json();
+  }
+};
+
+/**
+ * Send an HTTP request.
+ * @param {Object} config
+ * @returns {Promise}
+ */
+HttpClient.prototype.request = async function (config) {
+  config = Object.assign({}, this.config, config);
+  config.url = this._buildURL(config.url || '', config.params);
+  config.headers = this._buildHeaders(config.headers);
+
+  // Apply request interceptors
+  config = await applyRequestInterceptors(config, this.interceptors);
+
+  // Deduplicate GET requests
+  if (config.deduplicate !== false && this.config.deduplicate && (config.method || 'GET') === 'GET') {
+    const key = generateRequestKey(config);
+    const response = await deduplicateRequest(key, () => this._request(config));
+    return applyResponseInterceptors(response, this.interceptors);
+  }
+
+  const response = await this._request(config);
+  return applyResponseInterceptors(response, this.interceptors);
+};
+
+// ─── HTTP Methods ─────────────────────────────────────────────────────────────
+
+/**
+ * GET request.
+ * @param {string} url
+ * @param {Object} [params]
+ * @param {Object} [config]
+ * @returns {Promise}
+ */
+HttpClient.prototype.get = function (url, params, config) {
+  return this.request(Object.assign({ method: 'GET', url, params }, config));
+};
+
+/**
+ * POST request.
+ * @param {string} url
+ * @param {*} [data]
+ * @param {Object} [config]
+ * @returns {Promise}
+ */
+HttpClient.prototype.post = function (url, data, config) {
+  return this.request(Object.assign({ method: 'POST', url, body: data }, config));
+};
+
+/**
+ * PUT request.
+ * @param {string} url
+ * @param {*} [data]
+ * @param {Object} [config]
+ * @returns {Promise}
+ */
+HttpClient.prototype.put = function (url, data, config) {
+  return this.request(Object.assign({ method: 'PUT', url, body: data }, config));
+};
+
+/**
+ * PATCH request.
+ * @param {string} url
+ * @param {*} [data]
+ * @param {Object} [config]
+ * @returns {Promise}
+ */
+HttpClient.prototype.patch = function (url, data, config) {
+  return this.request(Object.assign({ method: 'PATCH', url, body: data }, config));
+};
+
+/**
+ * DELETE request.
+ * @param {string} url
+ * @param {Object} [config]
+ * @returns {Promise}
+ */
+HttpClient.prototype.delete = function (url, config) {
+  return this.request(Object.assign({ method: 'DELETE', url }, config));
+};
+
+/**
+ * HEAD request.
+ * @param {string} url
+ * @param {Object} [config]
+ * @returns {Promise}
+ */
+HttpClient.prototype.head = function (url, config) {
+  return this.request(Object.assign({ method: 'HEAD', url }, config));
+};
+
+/**
+ * OPTIONS request.
+ * @param {string} url
+ * @param {Object} [config]
+ * @returns {Promise}
+ */
+HttpClient.prototype.options = function (url, config) {
+  return this.request(Object.assign({ method: 'OPTIONS', url }, config));
+};
+
+/**
+ * Upload a file with progress tracking.
+ * @param {string} url
+ * @param {FormData} formData
+ * @param {Function} [onProgress]
+ * @param {Object} [config]
+ * @returns {Promise}
+ */
+HttpClient.prototype.upload = function (url, formData, onProgress, config) {
+  return new Promise((resolve, reject) => {
+    const xhr = new XMLHttpRequest();
+    xhr.open('POST', this.config.baseURL + url);
+
+    const headers = this._buildHeaders(config && config.headers);
+    Object.keys(headers).forEach((key) => {
+      if (key !== 'Content-Type') xhr.setRequestHeader(key, headers[key]);
+    });
+
+    if (this._authToken) {
+      xhr.setRequestHeader(this._authHeader, this._authPrefix + ' ' + this._authToken);
+    }
+
+    if (onProgress) {
+      xhr.upload.onprogress = function (e) {
+        if (e.lengthComputable) {
+          onProgress({ loaded: e.loaded, total: e.total, progress: e.loaded / e.total });
+        }
+      };
+    }
+
+    xhr.onload = function () {
+      if (xhr.status >= 200 && xhr.status < 300) {
+        try { resolve(JSON.parse(xhr.responseText)); }
+        catch (e) { resolve(xhr.responseText); }
+      } else {
+        const error = new Error('Upload failed: ' + xhr.status);
+        error.status = xhr.status;
+        reject(error);
+      }
+    };
+
+    xhr.onerror = function () { reject(new Error('Upload network error')); };
+    xhr.ontimeout = function () { reject(new Error('Upload timeout')); };
+
+    if (config && config.signal) {
+      config.signal.addEventListener('abort', () => xhr.abort());
+    }
+
+    xhr.send(formData);
+  });
+};
+
+/**
+ * Download a file.
+ * @param {string} url
+ * @param {Object} [config]
+ * @returns {Promise<Blob>}
+ */
+HttpClient.prototype.download = function (url, config) {
+  return this.request(Object.assign({ url, method: 'GET', responseType: 'blob' }, config));
+};
+
+// ─── Factory Function ─────────────────────────────────────────────────────────
+
+/**
+ * Create a new HTTP client instance.
+ * @param {Object} [config]
+ * @returns {HttpClient}
+ */
+function createHttpClient(config) {
+  return new HttpClient(config);
+}
+
+// Default instance
+const http = new HttpClient();
+
+// ─── Exports ──────────────────────────────────────────────────────────────────
+
+module.exports = {
+  HttpClient,
+  createHttpClient,
+  http,
+  // Quick access methods on default instance
+  get: (url, params, config) => http.get(url, params, config),
+  post: (url, data, config) => http.post(url, data, config),
+  put: (url, data, config) => http.put(url, data, config),
+  patch: (url, data, config) => http.patch(url, data, config),
+  delete: (url, config) => http.delete(url, config),
+  head: (url, config) => http.head(url, config),
+  options: (url, config) => http.options(url, config),
+  upload: (url, formData, onProgress, config) => http.upload(url, formData, onProgress, config),
+  download: (url, config) => http.download(url, config),
+  setAuthToken: (token, header, prefix) => http.setAuthToken(token, header, prefix),
+  clearAuthToken: () => http.clearAuthToken(),
+  interceptors: http.interceptors,
+};

package/src/js/index.js

@@ -0,0 +1,26 @@
+/**
+ * JS Utilities Index
+ * ElementDrawing Framework - Re-exports all JS utility modules.
+ */
+
+'use strict';
+
+const dom = require('./dom');
+const events = require('./events');
+const utils = require('./utils');
+const animation = require('./animation');
+const http = require('./http');
+const router = require('./router');
+const store = require('./store');
+const validator = require('./validator');
+
+module.exports = {
+  dom,
+  events,
+  utils,
+  animation,
+  http,
+  router,
+  store,
+  validator,
+};