Skip to content

Commit

Permalink
Release 1.9.0
Browse files Browse the repository at this point in the history
  • Loading branch information
@hiteshaggarwal
hiteshaggarwal committed Sep 24, 2020
1 parent d6bd251 commit 87fab33
Show file tree
Hide file tree
Showing 27 changed files with 1,207 additions and 71 deletions.
2 changes: 1 addition & 1 deletion com_jdbuilder/jdbuilder.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
<author>Team Joomdev</author>
<authorEmail>info@joomdev.com</authorEmail>
<authorUrl>https://www.joomdev.com</authorUrl>
<version>1.8.0</version>
<version>1.9.0</version>
<description>{jdbcomdesc}</description>
<install> <!-- Runs on install -->
<sql>
Expand Down
2 changes: 1 addition & 1 deletion mod_jdbuilder/mod_jdbuilder.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<authorUrl>https://www.joomdev.com</authorUrl>
<copyright>Copyright (C) 2020 Joomdev, Inc. All rights reserved.</copyright>
<license>GNU General Public License version 2 or later; see LICENSE.txt</license>
<version>1.8.0</version>
<version>1.9.0</version>
<description>This Module allows you to create your own Module using the JD Builder.</description>
<files>
<filename>mod_jdbuilder.xml</filename>
Expand Down
2 changes: 1 addition & 1 deletion pkg_jdbuilder.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<packagerurl>https://www.joomdev.com</packagerurl>
<author>Team JoomDev</author>
<creationDate>Aug 2020</creationDate>
<version>1.8.0</version>
<version>1.9.0</version>
<url>https://www.joomdev.com</url>
<copyright>Copyright (C) 2020 Joomdev, Inc. All rights reserved.</copyright>
<license>GNU General Public License version 2 or later; see LICENSE.txt</license>
Expand Down
97 changes: 97 additions & 0 deletions plg_jdbuilder/elements/icon-list/icon-list.xml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,97 @@
<?xml version="1.0" encoding="utf-8"?>
<element type="icon-list">
<title>Icon List</title>
<icon>media/jdbuilder/images/icons/elements/icon-list.svg</icon>
<creationDate>Aug 2020</creationDate>
<author>JoomDev</author>
<authorEmail>info@joomdev.com</authorEmail>
<authorUrl>https://www.joomdev.com</authorUrl>
<copyright>Copyright (C) 2020 Joomdev, Inc. All rights reserved.</copyright>
<license>GNU General Public License version 2 or later; see LICENSE.txt</license>
<version>1.0</version>
<description>Element Description Here</description>
<documentation>https://docs.joomdev.com/article/icon-list-element/</documentation>
<form>
<fields>
<fieldset name="general" label="JDB_GENERAL_TITLE">
<field type="group" name="listOptions" label="JDB_ICONLIST"></field>
<!-- List Options -->
<field type="repeatable" name="list_items" label="JDB_ICONLIST_LIST_ITEMS" item-title-field="text" group="listOptions" default='[{"icon":"fas fa-star","text":"Lorem ipsum dolor sit amet, consectetur adipiscing elit."},{"icon":"fas fa-star","text":"Fusce a leo in erat elementum mattis."},{"icon":"fas fa-star","text":"Pellentesque ultrices erat quis enim consequat, a ultricies est aliquet."},{"icon":"fas fa-star","text":"Sed scelerisque enim a tellus tincidunt, sit amet viverra dui posuere."},{"icon":"fas fa-star","text":"Nulla finibus lectus a risus dapibus lobortis."},{"icon":"fas fa-star","text":"Maecenas vestibulum ligula sit amet libero malesuada ullamcorper."}]'>
<form>
<field name="icon" width="3" type="icon" label="JDB_ICON" default="" />
<field name="text" width="9" type="text" label="JDB_TEXT" default="" />
</form>
</field>

<field name="list_layout" type="radio" radiotype="buttons" label="JDB_LAYOUT_TITLE" default="list" group="listOptions">
<option value="list">JDB_DEFAULT</option>
<option value="inline">JDB_INLINE</option>
</field>
<!-- List Options -->
</fieldset>

<fieldset name="design" ordering="9" label="JDB_DESIGN_TITLE">
<field type="group" name="listStyling" label="JDB_ICONLIST_LIST"></field>
<field type="group" name="iconStyling" label="JDB_ICON"></field>
<field type="group" name="textStyling" label="JDB_TEXT"></field>

<!-- List Styling -->
<field type="slider" name="list_space_between" label="JDB_ICONLIST_SPACE_BETWEEN_ITEMS" default="" max="100" min="0" unit="px" responsive="true" group="listStyling" />

<field name="list_alignment" type="radio" radiotype="buttons" label="JDB_ALIGNMENT" responsive="true" default="left" group="listStyling">
<option value="left">JDB_LEFT</option>
<option value="center">JDB_CENTER</option>
<option value="right">JDB_RIGHT</option>
</field>

<field name="list_divider" type="switch" label="JDB_ICONLIST_ENABLE_DIVIDER" default="false" group="listStyling" />

<field type="list" name="list_divider_style" label="JDB_ICONLIST_DIVIDER_STYLE" default="solid" showon="params.list_divider" group="listStyling">
<option value="dotted">JDB_BORDER_DOTTED</option>
<option value="dashed">JDB_BORDER_DASHED</option>
<option value="solid">JDB_BORDER_SOLID</option>
<option value="double">JDB_BORDER_DOUBLE</option>
</field>

<field type="slider" name="list_divider_weight" label="JDB_ICONLIST_DIVIDER_WEIGHT" default='{value:1,unit:"px"}' max="20" min="1" unit="px" responsive="true" showon="params.list_divider" group="listStyling" />

<field type="slider" name="list_divider_width" label="JDB_ICONLIST_DIVIDER_WIDTH" default='{"value":100,"unit":"%"}' max="500" min="0" units="px,%" showon="params.list_divider[AND]params.list_layout=='list'" group="listStyling" responsive="true" />

<field type="slider" name="list_divider_height" label="JDB_ICONLIST_DIVIDER_HEIGHT" default='{"value":25,"unit":"px"}' max="500" min="0" unit="px" showon="params.list_divider[AND]params.list_layout=='inline'" group="listStyling" responsive="true" />

<field type="color" name="list_divider_color" label="JDB_ICONLIST_DIVIDER_COLOR" showon="params.list_divider" default="" group="listStyling">
</field>
<!-- List Styling -->


<!-- Icon Styling -->

<field type="color" name="icon_color" label="JDB_COLOR" default="" group="iconStyling" width="6"></field>

<field type="color" name="icon_hover_color" label="JDB_HOVER_COLOR" default="" group="iconStyling" width="6"></field>

<field type="color" name="icon_bg_color" label="JDB_BACKGROUND_COLOR" default="" group="iconStyling" width="6"></field>

<field type="color" name="icon_bg_hover_color" label="JDB_BACKGROUND_HOVER_COLOR" default="" group="iconStyling" width="6"></field>

<field type="slider" name="icon_size" label="JDB_SIZE" default='{value:null,unit:"px"}' max="100" min="5" unit="px" responsive="true" group="iconStyling" />

<field type="fieldsgroup" name="iconBorder" filename="border" group="iconStyling">
</field>

<field type="spacing" name="icon_padding" min="0" label="JDB_PADDING" group="iconStyling" default='{"unit":"px","top":"","lock":1,"left":"","right":"","bottom":""}' responsive="true" />

<field type="slider" name="icon_space_between" label="JDB_ICONLIST_SPACE_BETWEEN_ICON_TEXT" default="" max="100" min="0" unit="px" responsive="true" group="iconStyling" />
<!-- Icon Styling -->

<!-- Text Styling -->
<field type="color" name="text_color" label="JDB_COLOR" default="" group="textStyling" width="6"></field>

<field type="color" name="text_hover_color" label="JDB_HOVER_COLOR" default="" group="textStyling" width="6"></field>

<field type="typography" name="text_typography" label="JDB_TYPOGRAPHY" default='{"family":"", "size":"", "sizeUnit":"px", "alignment":"", "weight":"", "transform":"", "style":"", "decoration":"", "lineHeight":"", "lineHeightUnit": "px", "letterSpacing":"", "letterSpacingUnit": "px"}' responsive="true" group="textStyling" />
<!-- Text Styling -->
</fieldset>
</fields>
</form>
</element>
12 changes: 12 additions & 0 deletions plg_jdbuilder/elements/icon-list/language/en-GB/en-GB.icon-list.ini
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
; Icon List
JDB_ICONLIST="Icon List"
JDB_ICONLIST_LIST_ITEMS="List Items"
JDB_ICONLIST_LIST="List"
JDB_ICONLIST_SPACE_BETWEEN_ITEMS="Space Between Items"
JDB_ICONLIST_ENABLE_DIVIDER="Enable Divider"
JDB_ICONLIST_DIVIDER_STYLE="Divider Style"
JDB_ICONLIST_DIVIDER_WEIGHT="Divider Weight"
JDB_ICONLIST_DIVIDER_WIDTH="Divider Width"
JDB_ICONLIST_DIVIDER_HEIGHT="Divider Height"
JDB_ICONLIST_DIVIDER_COLOR="Divider Color"
JDB_ICONLIST_SPACE_BETWEEN_ICON_TEXT="Space Between Icon &amp; Text"
178 changes: 178 additions & 0 deletions plg_jdbuilder/elements/icon-list/tmpl/default.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,178 @@
(function () {

var JDBuilderElementIconList = function (element) {
var html = [];
var items = element.params.get('list_items', []);
var layout = element.params.get('list_layout', 'list');
var divider = element.params.get('list_divider', false);

html = [`<div class="jdb-iconlist jdb-iconlist-layout-${layout}${divider ? ' jdb-iconlist-has-divider' : ''}"><ul class="jdb-iconlist-items">`];

items.forEach(function (item) {
if (item.text != '' || item.icon != '') {
html.push(`<li class="jdb-iconlist-item">${item.icon ? `<span class="jdb-iconlist-icon"><i class="${item.icon}"></i></span>` : ``}<span class="jdb-iconlist-text">${item.text}</span></li>`);
}
});

html.push(`</ul></div>`);

listStyling(element);
iconStyling(element);
textStyling(element);

return html.join('');
}

function listStyling(element) {
var layout = element.params.get('list_layout', 'list');

var List = new JDBRenderer.ElementStyle(".jdb-iconlist");
var ListContainer = new JDBRenderer.ElementStyle(".jdb-iconlist-layout-" + layout);
var ListItems = new JDBRenderer.ElementStyle(".jdb-iconlist-layout-" + layout + " .jdb-iconlist-items");
var ListItem = new JDBRenderer.ElementStyle(".jdb-iconlist-layout-" + layout + " .jdb-iconlist-item");
var ListItemNotLast = new JDBRenderer.ElementStyle(".jdb-iconlist-layout-" + layout + " .jdb-iconlist-item:not(:last-child)");
var ListItemNotFirst = new JDBRenderer.ElementStyle(".jdb-iconlist-layout-" + layout + " .jdb-iconlist-item:not(:first-child)");
var ListItemHover = new JDBRenderer.ElementStyle(".jdb-iconlist-item:hover");
var ListDivider = new JDBRenderer.ElementStyle(".jdb-iconlist-layout-" + layout + ".jdb-iconlist-has-divider .jdb-iconlist-item:not(:last-child):after");

var alignment = element.params.get('list_alignment', null);

JDBRenderer.DEVICES.forEach(function (_deviceObj) {
if (_deviceObj.key in alignment) {
ListContainer.addCss('text-align', alignment[_deviceObj.key], _deviceObj.type);
ListItem.addCss('justify-content', alignment[_deviceObj.key] == 'left' ? 'flex-start' : (alignment[_deviceObj.key] == 'right' ? 'flex-end' : 'center'), _deviceObj.type);
}
});


var space_between = element.params.get('list_space_between', null);
if (space_between != null) {
JDBRenderer.DEVICES.forEach(function (_deviceObj) {
if ((_deviceObj.key in space_between) && JDBRenderer.Helper.checkSliderValue(space_between[_deviceObj.key])) {
var marginSide = layout == 'list' ? 'bottom' : 'right';
ListItemNotLast.addCss(`margin-${marginSide}`, `${space_between[_deviceObj.key].value / 2}px`, _deviceObj.type);
ListItemNotLast.addCss(`padding-${marginSide}`, `${space_between[_deviceObj.key].value / 2}px`, _deviceObj.type);
}
});
}

if (element.params.get('list_divider', false)) {
var borderSide = layout == 'list' ? 'top' : 'right';
ListDivider.addCss(`border-${borderSide}-style`, element.params.get('list_divider_style', 'solid'))
ListDivider.addCss(`border-${borderSide}-color`, element.params.get('list_divider_color', ''))

var weight = element.params.get('list_divider_weight', null);
if (weight != null) {
JDBRenderer.DEVICES.forEach(function (_deviceObj) {
if ((_deviceObj.key in weight) && JDBRenderer.Helper.checkSliderValue(weight[_deviceObj.key])) {
ListDivider.addCss(`border-${borderSide}-width`, `${weight[_deviceObj.key].value}px`, _deviceObj.type);
if (layout == 'list') {
ListItemNotLast.addCss(`padding-bottom`, `${weight[_deviceObj.key].value}px`, _deviceObj.type);
} else {
ListItemNotLast.addCss(`padding-right`, `${weight[_deviceObj.key].value + 5}px`, _deviceObj.type);
}
}
});
}

if (layout == 'list') {
var width = element.params.get('list_divider_width', null);
if (width != null) {
JDBRenderer.DEVICES.forEach(function (_deviceObj) {
if ((_deviceObj.key in width) && JDBRenderer.Helper.checkSliderValue(width[_deviceObj.key])) {
ListDivider.addCss(`width`, `${width[_deviceObj.key].value}${width[_deviceObj.key].unit}`, _deviceObj.type);
}
});
}
} else {
var height = element.params.get('list_divider_height', null);
if (height != null) {
JDBRenderer.DEVICES.forEach(function (_deviceObj) {
if ((_deviceObj.key in height) && JDBRenderer.Helper.checkSliderValue(height[_deviceObj.key])) {
ListDivider.addCss(`height`, `${height[_deviceObj.key].value}${height[_deviceObj.key].unit}`, _deviceObj.type);
}
});
}
}

element.addChildStyle(ListDivider);
}


element.addChildStyle(List);
element.addChildStyle(ListContainer);
element.addChildStyle(ListItem);
element.addChildStyle(ListItems);
element.addChildStyle(ListItemNotLast);
element.addChildStyle(ListItemNotFirst);
element.addChildStyle(ListItemHover);
}

function iconStyling(element) {
var Icon = new JDBRenderer.ElementStyle(".jdb-iconlist-icon");
var IconHover = new JDBRenderer.ElementStyle(".jdb-iconlist-item:hover .jdb-iconlist-icon");

Icon.addCss('color', element.params.get('icon_color', ''));
Icon.addCss('background-color', element.params.get('icon_bg_color', ''));
IconHover.addCss('color', element.params.get('icon_hover_color', ''));
IconHover.addCss('background-color', element.params.get('icon_bg_hover_color', ''));

JDBRenderer.Helper.applyBorderValue(Icon, element.params, "iconBorder");

var icon_size = element.params.get('icon_size', null);
if (icon_size != null) {
JDBRenderer.DEVICES.forEach(function (_deviceObj) {
if ((_deviceObj.key in icon_size) && JDBRenderer.Helper.checkSliderValue(icon_size[_deviceObj.key])) {
Icon.addCss(`font-size`, `${icon_size[_deviceObj.key].value * 0.70}px`, _deviceObj.type);
Icon.addCss(`line-height`, `${icon_size[_deviceObj.key].value}px`, _deviceObj.type);
Icon.addCss(`width`, `${icon_size[_deviceObj.key].value}px`, _deviceObj.type);
Icon.addCss(`height`, `${icon_size[_deviceObj.key].value}px`, _deviceObj.type);
}
});
}

var padding = element.params.get('icon_padding', null);
if (padding != null) {
JDBRenderer.DEVICES.forEach(function (_deviceObj) {
if (_deviceObj.key in padding) {
Icon.addStyle(JDBRenderer.Helper.spacingValue(padding[_deviceObj.key], "padding"), _deviceObj.type);
}
});
}

var space_between = element.params.get('icon_space_between', null);
if (space_between != null) {
JDBRenderer.DEVICES.forEach(function (_deviceObj) {
if ((_deviceObj.key in space_between) && JDBRenderer.Helper.checkSliderValue(space_between[_deviceObj.key])) {
Icon.addCss(`margin-right`, `${space_between[_deviceObj.key].value}px`, _deviceObj.type);
}
});
}

element.addChildStyle(Icon);
element.addChildStyle(IconHover);
}

function textStyling(element) {
var Text = new JDBRenderer.ElementStyle(".jdb-iconlist-text");
var TextHover = new JDBRenderer.ElementStyle(".jdb-iconlist-item:hover .jdb-iconlist-text");

Text.addCss('color', element.params.get('text_color', ''));
TextHover.addCss('color', element.params.get('text_hover_color', ''));

var typography = element.params.get('text_typography', null);
if (typography !== null) {
JDBRenderer.DEVICES.forEach(function (_deviceObj) {
if (_deviceObj.key in typography) {
Text.addStyle(JDBRenderer.Helper.typographyValue(typography[_deviceObj.key]), _deviceObj.type);
}
});
}

element.addChildStyle(Text);
element.addChildStyle(TextHover);
}

window.JDBuilderElementIconList = JDBuilderElementIconList;

})();
Loading

0 comments on commit 87fab33

Please sign in to comment.