layerpro 0.0.64 → 0.0.65

package/scripts/genLayer.jsx

@@ -1,234 +0,0 @@
-/*
-Copyright: © 2022 Dario Passariello <dariopassariello@gmail.com>
-License: MIT
-*/
-
-import { createRoot } from 'react-dom/client'
-
-export const genLayer = (p) => {
-
-  var root // FUCKYOU FACEBOOK!
-
-  let pContainer = p.raised === true ? '.popup_raised_' + p.id : '#popup'
-
-  $('[class^="popup_window_"]', pContainer).removeClass('zHigh')
-  $('[class^="popup_bar_"]', pContainer).removeClass('pupup_bar_selected')
-  $('[class^="icon_"]', pContainer).removeClass('pupup_bar_selected')
-
-  if (p.raised === true) {
-    $('<div class="popup_raised_' + p.id + '">', pContainer)
-      .appendTo('#popup')
-      .css({
-        'pointer-events': 'auto',
-        'z-index': layerpro.popup.zIndex($('[class^="popup_overflow_"]', pContainer)) + 1000
-      })
-  }
-
-  $('<div class="popup_overflow_' + p.id + '">', pContainer)
-    .appendTo(pContainer)
-    .css({
-      'top': p.top,
-      'left': p.left,
-      'right': p.right,
-      'bottom': p.bottom,
-      'width': p.width,
-      'height': p.height,
-      'min-width': p.minWidth,
-      'min-height': p.minHeight,
-      'pointer-events': 'auto',
-      'z-index': layerpro.popup.zIndex($('[class^="popup_overflow_"]', pContainer)) + 1
-    })
-    .on("mousedown", function (e) { layerpro.popup.index(p) })
-    .hide()
-    .fadeIn(p.fadeIn)
-
-  let item = $('<div class="popup_window_' + p.id + '">', pContainer)
-    //.on("mouseup", function( e ){ layerpro.popup.index( p ); })
-    .appendTo('.popup_overflow_' + p.id)
-    .css({ 'pointer-events': 'auto' })
-    .addClass('zHigh')
-
-  /*******************************************************************/
-  // CHECK IF NEED CENTERED
-
-  const pos = [p.top, p.left, p.bottom, p.right]
-  const sum = pos.reduce((sumSoFar, nextValue) => {
-    if (typeof nextValue === "number" && isFinite(nextValue)) { return sumSoFar + nextValue }
-    return sumSoFar
-  }, 0)
-
-  if (sum === 0) layerpro.popup.center(p)
-
-  /*******************************************************************/
-  // BAR
-
-  $('<div class="popup_bar_' + p.id + '">', pContainer)
-    .appendTo(item)
-    .addClass('pupup_bar_selected')
-
-  $('<div class="popup_icon_' + p.id + '">' + p.icon + '</div>', pContainer)
-    .appendTo(".popup_bar_" + p.id)
-
-  $('<div class="popup_drag_' + p.id + '">' + p.name + '</div>', pContainer)
-    .appendTo(".popup_bar_" + p.id)
-
-  $('<div class="popup_option_' + p.id + '">', pContainer)
-    .appendTo(".popup_bar_" + p.id)
-
-  /*******************************************************************/
-  // DOCK GENERATION
-
-  if (p.iconize === true && $('#popup_dock').length === 0) {
-
-    $('#root').css('margin', '0 0 var( --dock-height ) 0')
-
-    let dock = `<div id="popup_dock">
-      <div id="popup_dock_icon"></div>
-      <div id="popup_dock_list"></div>
-      <div id="popup_dock_options"></div>
-    </div>`
-
-    $(dock)
-      .appendTo('#popup')
-      .css({
-        'pointer-events': 'auto',
-        'z-index': layerpro.popup.zIndex($('#popup')) + 1000
-      })
-
-  }
-
-  /*******************************************************************/
-  // DOCK BEHAVIOR
-
-  if ($('#popup_dock').length > 0 && p.dockable === true) {
-    let dock_icon = `
-      <div class="icon_${p.id}">
-        <span>${p.icon}</span>
-        <span>${p.name}</span>
-      `
-
-    $(dock_icon, '#popup_dock')
-      .appendTo('#popup_dock_list')
-      .addClass('pupup_bar_selected')
-      .find("span")
-      .on('click', function () {
-
-        if ($(".popup_overflow_" + p.id + ':hidden')) {
-          layerpro.popup.iconize(p)
-          layerpro.popup.index(p)
-        } else {
-          layerpro.popup.iconize(p)
-        }
-
-        layerpro.popup.index(p)
-
-      })
-
-    $(`<button class="icon_close_${p.id}">X</button>`, '#popup_dock')
-      .appendTo(`.icon_${p.id}`)
-      .on('click', function () { layerpro.popup.close(p) })
-  }
-
-  /*******************************************************************/
-  // ICONIFICATION
-
-  if (p.iconize === true) {
-    $('<button class="button_iconize_' + p.id + ' iconize">', '#popup')
-      .appendTo(".popup_option_" + p.id)
-      .on('click', function () { layerpro.popup.iconize(p) })
-  }
-
-  /*******************************************************************/
-  // MAXIMIZATION
-
-  if (p.maximize === true) {
-    $('<button class="button_maximize_' + p.id + ' maximize">', '#popup')
-      .appendTo(".popup_option_" + p.id)
-      .on('click', function () { layerpro.popup.maximize(p) })
-  }
-
-  /*******************************************************************/
-  // CLOSE
-
-  if (p.close === true) {
-    $('<button class="button_close_' + p.id + ' close">', '#popup')
-      .appendTo(".popup_option_" + p.id)
-      .on('click', function () { layerpro.popup.close(p) })
-  }
-
-  /*******************************************************************/
-  // BODY
-
-  let _overflow = $('<div class="popup_overflow_' + p.id + '">', '#popup')
-
-  $('<div class="popup_internal_' + p.id + '">', _overflow)
-    .appendTo(item)
-
-  $('<div class="popup_body_' + p.id + '">', _overflow)
-    .appendTo(".popup_internal_" + p.id)
-    .hide()
-    .fadeIn(p.fadeIn, function () { showBody() })
-
-  const showBody = () => {
-    if (p.body && !p.source) {
-      if (p.body.props) {
-
-        if (!p?.body?.props?.children) return (console.debug('You need to pass a component to LayerPro'))
-
-        if (!root) root = createRoot($('.popup_body_' + p.id)[0])
-        root.render(p.body.props.children)
-        $('.popup_body_' + p.id).delay(900).fadeIn(100)
-
-        //createRoot( $('.popup_body_' + p.id )[0] ).render( p.body.props.children );
-
-      } else {
-
-        $('.popup_body_' + p.id).html(p.body)
-
-      }
-    }
-    return false
-  }
-
-  /*******************************************************************/
-  // SOURCE
-
-  if (p.source) {
-
-    $('.popup_body_' + p.id).load(p.source, function (responseTxt, statusTxt, jqXHR) {
-
-      if (statusTxt === "success") {
-        $(this)
-          .hide()
-          .html(responseTxt)
-          .fadeIn(p.fadeIn)
-        /*.animate({ scrollTop:0 }, 500, 'swing');	*/
-        //console.log( responseTxt );
-      }
-
-      if (statusTxt === "error") {
-        console.log("Error: " + jqXHR.status + " " + jqXHR.statusText)
-      }
-
-    })
-
-  }
-
-  /*******************************************************************/
-  // MOVABLE
-
-  if (p.movable) layerpro.popup.movable(p)
-
-  /*******************************************************************/
-  // RESIZE
-
-  if (p.resizable) layerpro.popup.resizable(p)
-
-  /*******************************************************************/
-  // START MAXIMIZED
-
-  if (p.isMaximize) layerpro.popup.maximize(p)
-
-  return false
-
-}

package/scripts/message.jsx

@@ -1,280 +0,0 @@
-/*
-Copyright: © 2022 Dario Passariello <dariopassariello@gmail.com>
-License: MIT
-*/
-
-/*****************************************************************************************/
-// ALERT
-
-layerpro.alert = (txt) => {
-
-  const pUp = layerpro.popup.open({
-    id: "__alert",
-    body: "",
-    source: "",
-    width: 380,
-    height: 220,
-    name: "Warning",
-    icon: "&#9888;",
-    iconize: false,
-    maximize: false,
-    close: true,
-    isMaximize: false,
-    dockable: false,
-    raised: true,
-    movable: true,
-    resizable: false,
-    store: false,
-    top: "",
-    left: "",
-    right: "",
-    bottom: "",
-    fadeIn: "",
-    fadeOut: "",
-    minWidth: "",
-    minHeight: "",
-  })
-
-  let view = ""
-  view += "<div class='popup_prompt'>"
-  view += '<div class="popup_message_body">'
-  view += '<center>'
-  view += txt
-  view += "</center>"
-  view += '</div>'
-  view += '<button id="a_' + pUp.id + '" type="button">CLOSE</button>'
-
-  $('.popup_body_' + pUp.id)
-    .html(view)
-
-  $('#a_' + pUp.id)
-    .css('width', '100%')
-    .on('click', function (e) { layerpro.popup.close(pUp) })
-
-  return false
-}
-
-/*****************************************************************************************/
-// MESSAGE
-
-layerpro.message = (txt) => {
-
-  let pUp = layerpro.popup.open({
-    id: "__message",
-    body: "",
-    width: 380,
-    height: 220,
-    name: 'Message',
-    source: "",
-    icon: "&#9965;",
-    iconize: false,
-    maximize: false,
-    close: true,
-    isMaximize: false,
-    dockable: false,
-    raised: true,
-    movable: true,
-    resizable: false,
-    store: false,
-    top: "",
-    left: "",
-    right: "",
-    bottom: "",
-    fadeIn: "",
-    fadeOut: "",
-    minWidth: "",
-    minHeight: "",
-  })
-
-  let view = ""
-  view += "<div class='popup_prompt'>"
-  view += '<div class="popup_message_body">'
-  view += '<center>'
-  view += txt
-  view += "</center>"
-  view += '</div>'
-  view += '<button id="a_' + pUp.id + '" type="button">CLOSE</button>'
-
-  $('.popup_body_' + pUp.id)
-    .html(view)
-
-  $('#a_' + pUp.id)
-    .css('width', '100%')
-    .on('click', function () { layerpro.popup.close(pUp) })
-
-  return false
-}
-
-/*****************************************************************************************/
-// CONFIRM
-
-layerpro.confirm = (txt, function_, noFunction) => {
-
-  if ($('.confirm').length === 0) {
-
-    let pUp = layerpro.popup.open({
-      id: "__confirm",
-      body: "",
-      source: "",
-      width: 380,
-      height: 220,
-      name: 'Confirm',
-      icon: "&#9745;",
-      iconize: false,
-      maximize: false,
-      close: true,
-      isMaximize: false,
-      dockable: false,
-      raised: true,
-      movable: true,
-      resizable: false,
-      store: false,
-      top: "",
-      left: "",
-      right: "",
-      bottom: "",
-      fadeIn: "",
-      fadeOut: "",
-      minWidth: "",
-      minHeight: "",
-    })
-
-    let view = ""
-    view += "<div class='popup_prompt'>"
-    view += '<div class="popup_message_body">'
-    view += '<center>'
-    view += txt
-    view += "</center>"
-    view += '</div>'
-    view += '<button id="a_' + pUp.id + '" type="button">CONFIRM</button>'
-    view += '<button id="b_' + pUp.id + '" type="button">CANCEL</button>'
-
-    $('.popup_body_' + pUp.id)
-      .html(view)
-
-    $('#a_' + pUp.id).on('click', function () {
-      if (function_) { function_() }
-      layerpro.popup.close(pUp)
-    })
-
-    $('#b_' + pUp.id).on('click', function () {
-      if (noFunction) { noFunction() }
-      layerpro.popup.close(pUp)
-    })
-
-  }
-
-  return false
-}
-
-/*****************************************************************************************/
-// PROMPT
-
-layerpro.prompt = (txt, value) => {
-
-  // txt = JSON.stringify( txt );
-  // value = JSON.stringify( value ) || "_prompt";
-  value = value || "_prompt"
-
-  let pUp = layerpro.popup.open({
-    id: "__prompt",
-    body: "",
-    source: "",
-    width: 380,
-    height: 220,
-    name: 'Prompt',
-    icon: "&#9998;",
-    iconize: false,
-    maximize: false,
-    close: true,
-    isMaximize: false,
-    dockable: false,
-    raised: true,
-    movable: true,
-    resizable: false,
-    store: false,
-    top: "",
-    left: "",
-    right: "",
-    bottom: "",
-    fadeIn: "",
-    fadeOut: "",
-    minWidth: "",
-    minHeight: "",
-  })
-
-  let view = ""
-  view += "<div class='popup_prompt'>"
-  view += '<div class="popup_message_body">'
-  view += '<center>'
-  view += txt
-  view += "</center>"
-  view += '</div>'
-  view += '<input id="input_' + pUp.id + '" type="text" placeholder="write here" /><br/>'
-  view += '<button id="a_' + pUp.id + '" type="button">OK</button>'
-  view += '<button id="b_' + pUp.id + '" type="button">CANCEL</button>'
-  view += "</div>"
-
-  $('.popup_body_' + pUp.id)
-    .html(view)
-
-  $('#input_' + pUp.id)
-    .on('focus', function () { $(this).attr('placeholder', "") })
-    .on('blur', function () { $(this).attr('placeholder', "write here") })
-
-  $('#a_' + pUp.id).on('click', function (e) {
-
-    if ($('#input_' + pUp.id).val() > '') {
-
-      // localStorage.setItem( value , JSON.stringify( $('#input_' + pUp.id).val() ) );
-      // layerpro.popup.close( pUp );
-
-      layerpro.popup.close(pUp)
-      return JSON.stringify($('#input_' + pUp.id).val())
-
-    } else {
-      alert(`input can't be empty!`)
-    }
-
-  })
-
-  $('#b_' + pUp.id).on('click', function (e) {
-    layerpro.popup.close(pUp)
-  })
-
-  return false
-}
-
-
-/********************************************************** */
-
-export const CustomMessage = () => {
-
-  // MESSAGE
-  // ***********************************************************************
-  window.message = (txt) => {
-    layerpro.message(txt)
-  }
-
-  // ALERT
-  // ***********************************************************************
-  window.alert = (txt) => {
-    layerpro.alert(txt)
-  }
-
-  // CONFIRM
-  // ***********************************************************************
-  window.confirm = (txt, function_, noFunction) => {
-    layerpro.confirm(txt, function_, noFunction)
-  }
-
-  // PROMPT
-  // ***********************************************************************
-  window.prompt = (txt, function_, event) => {
-    layerpro.prompt(txt, function_, event)
-  }
-
-}
-
-CustomMessage()
-

package/scripts/mouseCoords.jsx

@@ -1,45 +0,0 @@
-/*
-Copyright: © 2022 Dario Passariello <dariopassariello@gmail.com>
-License: MIT
-*/
-
-export const mouseCoord = function (e) {
-
-  let mClientX = e.clientX
-  let mClientY = e.clientY
-  let mScreenX = e.screenX
-  let mScreenY = e.screenY
-
-  return [mClientX, mClientY, mScreenX, mScreenY]
-
-}
-
-/*****************************************************************************************/
-
-let xDirection = ""
-let yDirection = ""
-let oldX = 0
-let oldY = 0
-
-export const getMouseDirection = function (e) {
-
-  xDirection = oldX < e.pageX ? 1 : 0
-
-  yDirection = oldY < e.pageY ? "down" : "up"
-
-  oldX = e.pageX
-  oldY = e.pageY
-
-  //console.log(xDirection)
-
-  return xDirection
-
-}
-
-//document.querySelector( "body" ).addEventListener( "mousemove" , getMouseDirection, false );
-
-
-
-
-
-