hc-helper

• HTTP Client
• Convertors
• Message
• Toast
• Score
• Modal

Installation

npm i @haftcinco/hc-helper

HTTP Client

import {httpClient} from "@haftcinco/hc-helper";

Convertors

import {convertors} from "@haftcinco/hc-helper";

functions

---

Name	Input	Description
convertDate	date , format	Converts date to custom format.
getNextDay	date	Returns next day's date.
getPrevDay	date	Returns Previous day's date.
isToday	date	Checks if entered date is today's date or not?
getNewDate		Returns the Today's date.
getMaxDate		Returns next year same day's date

Example

---

convertors.convertDate(Date.now(),"YYYY,MM,DD");

// 2019,08,08

convertors.getNextDay(Date.now());

// 2019-08-09

convertors.getPrevDay(Date.now());

// 2019-08-07

convertors.isToday(Date.now());

// true

convertors.getNewDate();

// current date and time

convertors.getMaxDate();

// 2020-08-08
// Next year's date

Messages

Built on Sweet alert 2

import {messages} from "@haftcinco/hc-helper";

functions

---

Name	Input	Description
showAlert	msg, title, type	Displays alerts
showConfirm	confirmText, cancelText, msg, title, ok, cancel	Displays a confirmation message

showAlert

---

Name	Default	Description
msg		accepts Message text
title	Message	accepts Headline for title
type	warning	Acceptable inputs: error, success, warning, info,question

messages.showAlert('hello world!','message','warning');

showConfirm

---

Name	Default	Description
confirmText		Accepts text for Confirm button
cancelText		Accepts text for Cancel button
msg		accepts Message text
title		accepts Headline for title
ok		This is a call back for confirm button
cancel		This is a call back for cancel button

messages.showConfirm({
   confirmText: "confirmText",
   cancelText: "cancelText",
   msg: "msg",
   title: "title",
   ok: () => {
      alert('hello world!');
   },
   cancel: () => {
      alert("cancel");
   }
}); 

Toast

Built on vue-toasted

import {toast} from "@haftcinco/hc-helper";

Demo :

functions

---

Name	Input	Description
info	msg	displays a blue Toast
error	msg	displays a red Toast
success	msg	displays a green Toast

//Info
toast.info('hello world!');

//Error
toast.error('hello world!');

//Success
toast.success('hello world!');

Score

import {score} from "@haftcinco/hc-helper";

function

---

Name	Input	Description
isEmpty	obj	Accepts an object as input and checks if it is empty or not

let obj = {
    name:"score",
    message:"hello world!"
};


score.isEmpty(obj);

//false

Modal

Built on vue-js-modal

import {modal} from "@haftcinco/hc-helper";

Example

modal.showVModal(
   Component Name,
   { Props },
   { Options }
);

Options

Name	Required	Type	Default	Description
name	true	[String, Number]		Name of the modal
delay	false	Number	0	Delay between showing overlay and actual modal box
resizable	false	Boolean	false	If true allows resizing the modal window, keeping it in the center of the screen.
adaptive	false	Boolean	false	If true, modal box will try to adapt to the window size
draggable	false	[Boolean, String]	false	If true, modal box will be draggable.
scrollable	false	Boolean	false	If height property is auto and the modal height exceeds window height - you will be able to scroll modal
reset	false	Boolean	false	Resets position and size before showing modal
clickToClose	false	Boolean	true	If set to false, it will not be possible to close modal by clicking on the background
transition	false	String		Transition name
overlayTransition	false	String	'overlay-fade'	Transition name for the background overlay
classes	false	[String, Array]	'v--modal'	Classes that will be applied to the actual modal box, if not specified, the default v--modal class will be applied
width	false	[String, Number]	600	Width in pixels or percents (e.g. 50 or "50px", "50%")
height	false	[String, Number]	300	Height in pixels or percents (e.g. 50 or "50px", "50%") or "auto"
minWidth	false	Number (px)	0	The minimum width to which modal can be resized
minHeight	false	Number (px)	0	The minimum height to which modal can be resized
maxWidth	false	Number (px)	Infinity	The maximum width of the modal (if the value is greater than window width, window width will be used instead
maxHeight	false	Number (px)	Infinity	The maximum height of the modal (if the value is greater than window height, window height will be used instead
pivotX	false	Number (0 - 1.0)	0.5	Horizontal position in %, default is 0.5 (meaning that modal box will be in the middle (50% from left) of the window
pivotY	false	Number (0 - 1.0)	0.5	Vertical position in %, default is 0.5 (meaning that modal box will be in the middle (50% from top) of the window
root	false	Vue instance	null\Root instance to obtain modal container from. This property is only necessary when using dynamic modals with more than one root instance, which is uncommon