GS Custom Settings [v0.6.2]

[Oleg06]

Your code does not work in the fields of the plugin I18N Special Pages

Code:

<?php if (return_setting('news_settings','news-date_setting','value')) { ?>

I tried to add a check box to enable the date, tags and comments.

[Tyblitz]

Your code does not work in the fields of the plugin I18N Special Pages

Code:

<?php if (return_setting('news_settings','news-date_setting','value')) { ?>

I tried to add a check box to enable the date, tags and comments.

Hey Oleg, 
What do you mean with 'does not work'? With GSDEBUG on, do you get a warning/error? Does the setting always evaluate to FALSE somehow?
I have tried to reproduce this, but it worked for all I18N special page fields (View & search, as well as on-page). The only time it doesn't work is in I18N search results with (% ... %) tags. Btw for checkbox settings you can omit the 3rd parameter in if clauses.

Update on development:

As the development of the stable Javascript front-end is taking longer than anticipated I will release a 5.1 version with most bugs fixed & suggestions mentioned in the meantime next week.

[Oleg06]

I'm sorry, checked again, it really works.

[Tyblitz]

GS Custom Settings 0.5.1 released

Code:

07/09/2015 - V 0.5.1 (Bugfix)

New:
  - Added 'Save settings' button to top navigation
Bugfixes:
  - Fixed setting folding automatically when type was changed
  - Fixed default language en_US when GS lang is not available for plugin

[Tyblitz]

GS Custom Settings v0.6 released
A whole lot of work went into this update to refactor the Javascript front-end, and introduce a pack of features that were in demand.
Unfortunately GSConfig UI 0.2.2 and AdminXML Plus 0.2 do not work with the new API, however new versions will be released very soon.

Awesome new setting features

• Colorpicker - Color type settings will now open a color picker when the color box is clicked (for browsers that support it). This makes use of the standard <input type="color"> (not supported by IE).
  
• Image browser - Image type settings in v0.6 display a 'Browse..' button which allows you to browse and select images from your GetSimple uploads directory.
  
• Date settings - v0.6 adds a new date type setting. Upon focusing the input, a calendar widget will appear (jQuery UI) and allow you to choose a date. Currently the language for the calendar widget is English only, and the dateFormat is fixed at yyyy-mm-dd. 
  

UI Enhancements

• Enhanced Keyboard functionality - 'Shift (+Tab) your way through setting properties and tab names':
  • Edit mode > Select all settings - Ctrl + A 
    
  • Edit mode (with focus on a tab input) > Focus next tab input - Shift
    
  • Edit mode (with focus on a tab input) > Focus previous tab input - Tab + Shift
    
• Discrete code snippet display
  Setting code snippets can now be accessed by clicking the </> code icon, and will make a popup appear with the code selected. Hovering over a setting's label or </> icon will show the setting's tab & lookup as well.
  
• Enhanced GSSTYLE_WIDE display and Flat Blue Admin Theme compatible
  

Plugin changes

• 'fancy-' type settings renamed to 'icon-'
  Icon type settings are now subtypes (radio/checkbox), and they've all been renamed more appropriately from 'fancy-' to 'icon-'. Don't worry, these are automatically updated on plugin upgrade.
  
• 'values' property renamed to 'i18n'
  Again, this is handled automatically on plugin upgrade.
  

Full changelog for 0.6

Code:

04/10/2015 - V. 0.6 (JS Renaissance)

New:
 - Smoother mode & tab transitions, setting creation
 - New, clean code base using RequireJS & Knockout components
 - Lookup naming conflict errors now point the user to the involved tabs/settings
 - Edit grid and sidebar colors now fully adapt to admin.xml & GS defaults
 - Edit mode: Added Ctrl + A keyboard shortcut to select all settings
 - Image settings can now make use of an image browser by clicking the 'Browse' button
 - Color settings can now make use of a color picker by clicking the color box (except IE)
 - Added date settings with datepicker
 - (almost) fully compatible with FlatBlue Admin Theme plugin
Changes:
 - Setting limit per tab increased from 64 to 100
 - Search is now reset when changing tabs/ mode
 - Enhanced performance for tab editing/ switching, search, manage-mode
 - KnockoutJS dependency updated to 3.3.0 latest build (12/08/15)
 - Enhanced setting code snippet display (through notification)
 - Edit mode: Support for IE8 dropped
 - Edit mode: Enhanced GSSTYLE_WIDE display in Edit mode
 - Edit mode: Pressing SHIFT now properly toggles between the visible setting fields
 - Edit mode: Icon radio/checkbox are now subtypes of radio & checkbox type settings
 - Edit mode: Tab with 15+ settings are now loaded gradually to avoid page blocking in slower browsers
Bugfixes:
 - Fixed all minor multi-selection bugs in Edit mode
 - Fixed potential export bugs: filename for older browsers & appropriate encoding for non-ANSI chars

NB: The docs still need to be updated

[Oleg06]

Here is after installation
http://prntscr.com/8no3k3
in English
http://prntscr.com/8no53h

[Tyblitz]

Here is after installation
http://prntscr.com/8no3k3
in English
http://prntscr.com/8no53h

Thanks for your always just-in-time feedback . 
I see the error: In the language file ru_RU.json, on line 51 (prop_loading), replace the single quotes (') by double quotes (")

Update: Fixed and reuploaded
This error only came up if you used the ru_RU language or a language not included with the plugin. Now all should be fine.

[Oleg06]

http://prntscr.com/8npfm7
in English
http://prntscr.com/8npg4r

[Tyblitz]

http://prntscr.com/8npfm7
in English
http://prntscr.com/8npg4r

Hey Oleg, it works perfectly for me now on all browsers I can test (Mozilla FF, IE9-11, Chrome) in any scenario (no settings created, some created). I'm suspecting you need to flush cache (in settings tab) because that's a normal screen, only the navigation & sidebar is missing.

Are there any errors in the console? Eventually, can you send me your test server details in PM so I can debug there?

[Oleg06]

Yes, it all works
browser buttons are not very well placed
http://prntscr.com/8nsmzl

[Oleg06]

thank you very much, you really expanded the capabilities of the GS

[Tyblitz]

Thanks, I'll fix this in next release (0.6.1).
Discovered a few other (minor) bugs (will strikethrough what has been fixed in my local version):

• Shitty image setting display
  
• Image browser button does not gray out when it is disabled
  
• Image browser does not reset to base folder when it is left open on a subfolder (breadcrumbs out of sync with contents)
  
• Tab import doesn't work if the tab already exists, throws an error endlessly 'Function expected'. Temporary workaround: Delete the tab, and import after.
  

[Oleg06]

is it possible to add the Link field with 'Browse..' button?

[Tyblitz]

is it possible to add the Link field with 'Browse..' button?

I get you, for internal pages that is.
Will have a go at it eventually when/if I get some time.
The most important for me was to push out the 0.6 release before I got too busy with work/ other projects.

[Oleg06]

I'd like to be able to add a background image to certain blocks.
http://prntscr.com/8o0g5z
http://prntscr.com/8o0giu
can be removed from the field of image addition tag <img

[Tyblitz]

I'd like to be able to add a background image to certain blocks.
http://prntscr.com/8o0g5z
http://prntscr.com/8o0giu
can be removed from the field of image addition tag <img

Yes, you can set it as a background image with the image setting. 

• get_setting echoes a HTML-style output, ready to use without fiddling with tags etc.
  
• return_setting returns the raw value of the setting.
  

So for your case you would do:

PHP Code:

<div id="slider" style="<?php echo return_setting('my_tab', 'my_slider_setting'); ?>"> 


For more info, see the docs' Outputting settings section:

[Oleg06]

thanks for the tip

[Tyblitz]

GS Custom Settings 0.6.1 released

Mainly bugfix release:

Code:

10/10/2015 - V. 0.6.1 (Bugfix)

Changes:
 - 'Save settings' button renamed to 'Save'
Bugfixes:
 - Fixed: shitty image setting display
 - Fixed: Image browser button does not gray out when it is disabled
 - Fixed: Image browser does not reset to base folder when it is left open on a subfolder
 - Fixed: Color picker does not open on the right color when an RGB/RGBA/webcolor/3-digit-hex or no value is set
 - Fixed: Loading empty options array for radio/select settings causes minor JS error
 - Fixed: Import over existing tab causes recursive error
 - Fixed: Date setting not translated

[gslexx]

For MAC OS in Firefox, Safari and Opera does not display the icons on the buttons!
Only Google Chrome all good!
When setting the color bar appears, but the color can not choose!
In Safari color selection panel does not appear.

p.s. after the upgrade to version 4.4.0 font fix it!

[Tyblitz]

For MAC OS in Firefox, Safari and Opera does not display the icons on the buttons!
Only Google Chrome all good!
When setting the color bar appears, but the color can not choose!
In Safari color selection panel does not appear.

p.s. after the upgrade to version 4.4.0 font fix it!

Thanks for the valuable information gslex; 
I had spotted the bug, but didn't know how to solve it. Will include FontAwesome 4.4 in next release.

As for the colorpicker:

Color type settings will now open a color picker when the color box is clicked (for browsers that support it).

Unfortunately Safari does not support native color pickers atm. It only works for Opera/ Moz FF or Google Chrome. See the data here
I was unable to find a good JS solution so decided to go with native color pickers.

[gslexx]

Thank you for a wonderful plugin!
This button can be made more informative to see what we are editing: tab name or code? Thank you!
https://yadi.sk/i/GakbQvcmjckqj

It would be nice to make this block appears only in developer mode! You can for example plug-ins tab, make the switch.
https://yadi.sk/i/9pd_hr4BjcrFd

[Tyblitz]

Thank you for a wonderful plugin!
This button can be made more informative to see what we are editing: tab name or code? Thank you!
https://yadi.sk/i/GakbQvcmjckqj

It would be nice to make this block appears only in developer mode! You can for example plug-ins tab, make the switch.
https://yadi.sk/i/9pd_hr4BjcrFd

Thanks for those suggestions.
Because of UI constraints I cannot make the button a word, however I can have the icon change from 'label' icon to 'code' icon. The idea is good.

The navigation block cannot only appear in developer mode. GS Custom Settings supports user permissions, and when a user is not allowed access to edit mode, he/she would be unable to import/export settings. A common scenario:

Webdeveloper X sets up a theme with GS Custom Settings and disables editing permission for the users. If the user wants to backup (export) or re-import a previous configuration, but has no access to Edit mode, he is left without options...

[gslexx]

I mean that if you do a site to order - the customer does not need to import / export or edit the settings! Customer only need to change the data in in custom fields.

[Tyblitz]

I mean that if you do a site to order - the customer does not need to import / export or edit the settings! Customer only need to change the data in in custom fields.

You make a very valid point, but I don't agree completely that they do not need import/ export. 
The end-user should be able to export for manual backup and re-import purposes, to import new settings for extra customization, but should not be able to change the designer/developer's (theme and/or plugin) settings. 
This is already working because theme and plugin settings are not editable. 

For clarification, if you are the designer/ developer, you're meant to use a theme type of tab (because this prohibits editing access). You can still build your settings in GS, and when you're ready 'Export as: Theme'. Read more about it in the tutorial. If over that, you don't want to allow your clients to add new tabs and settings, you can disable editing permission altogether, have a look at Restricting editing permission. 

However you did help me identify a 'bug' (thanks): currently importing plugin/ theme settings will 'bypass the editing permission' because I didn't adapt that in the import function.That means building in an extra switch to prohibit overwriting anything but the value of the setting, when its type is a plugin or a theme (currently it completely overwrites the setting).

Thanks I'm going to go with that.

[gslexx]

Thank you very much! Will look at your manual and try what you have described.