SASS based skinning not working?

[claudiobosticco]

SmartClient Version: SNAPSHOT_v12.1d_2019-05-23/EVAL Deployment (expires 2019.07.22_07.24.01) Licensed to: Isomorphic Software (#ISC_EVAL_NIGHTLY)

Hello, I'm trying the SASS-based skinning, but it doesn't seem to work.
As per the doc's example, I'm starting from the Cascade skin, I've added:

$primary_hue: 120; // generally green rather than blue
$standard_widget_border_color: #006400; // darkgreen borders for widgets
$standard_button_border_radius: 5px; // give all buttons rounded corners

to _userSettings.scss, and I've run compass compile.
I see that the skin_styles.css file is modified, there are almost 500 differences...but I don't see the expected changes. For instance, the border radius of the buttons is still 0px. And the skin is still blue.

Is this supposed to work in 12.1 ? Am I missing something?

[Isomorphic]

Yes, we've made a bunch of changes to the process and the variables and need to rework the docs in this area for 12.1, which we'll do shortly.

Cascade will no longer be the recommended base skin, and will not appear in the Skin Editor - we've been working toward any skin you start from being equally easy to modify.

In the sample case, $primary_hue is no longer a variable in 12.1 skins - there are several high-level colors instead. Also, $standard_button_border_radius is now called just $button_border_radius. Further, since the variables cascade and since SASS tokens are apparently replaced serially, setting a value in your user settings file will work, but it won't cascade to variables declared previously

If you want to change things manually right now, the easiest way is to copy the variable list from _skinSettings.scss (from the //>theme_variables tag) into your _userSettings.scss file and change them in place. Then you'll see things change as you expect.

The Skin Editor effectively performs this step automatically.

[Blama]

Hi Isomorphic,

I saw your blog post for the new Skin or Theme editor, but could not see it in the 12.1 new samples, yet.
Is it coming there or will one need to deploy it locally as an application that generated skin files (load_skin,js, skin_styles.css)?

Best regards
Blama

[Isomorphic]

It's not under the samples because it is not a sample, it's a tool, so it's under the tools.

[Blama]

Hi Isomorphic,

thanks. I found it here under Tools -> Skin editor. Unfortunately it does not work, as I get an exception:

org.apache.jasper.JasperException: An exception occurred processing [/tools/skinTools/skinEditor.jsp] at line [21]

18: <script>
19: 
20: <!-- also load skinVariables later -->
21: <isomorphic:loadDS ID='employees,Filesystem,skinUtilsDS,skinVariables,skinVariableGroups' />
22: 
23: isc.FileLoader.loadSkin(isc.params.skin || "Stratus", "startUtil()");
24: 


Stacktrace:
    at org.apache.jasper.servlet.JspServletWrapper.handleJspException(JspServletWrapper.java:617)
    at org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:499)
    at org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:386)
    at org.apache.jasper.servlet.JspServlet.service(JspServlet.java:330)
    at javax.servlet.http.HttpServlet.service(HttpServlet.java:741)
...
...
...
Caused by: javax.servlet.ServletException: javax.servlet.jsp.JspException: javax.servlet.jsp.JspException: Unable to load DataSource for ID: skinUtilsDS
    at com.isomorphic.taglib.LoadDSTag.outputDSAsJS(LoadDSTag.java:124)
    at com.isomorphic.taglib.LoadDSTag.outputJS(LoadDSTag.java:89)
    at com.isomorphic.taglib.LoadDSTag.doStartTag(LoadDSTag.java:59)
    at org.apache.jsp.tools.skinTools.skinEditor_jsp._jspx_meth_isomorphic_005floadDS_005f0(skinEditor_jsp.java:1155)
    at org.apache.jsp.tools.skinTools.skinEditor_jsp._jspService(skinEditor_jsp.java:143)
    at org.apache.jasper.runtime.HttpJspBase.service(HttpJspBase.java:70)
    at javax.servlet.http.HttpServlet.service(HttpServlet.java:741)

Best regards
Blama

[Isomorphic]

If you're literally trying that online on the "demos" site, please try in your SDK.

The skin tool writes to disk, so it's not going to work in that environment.

[mathias]

Hey, I thought i'd take a look at the advertised "online skin editor", but i'm having some problems getting up and running, so i'm hijacking this thread. :)

I read the blog post here:
http://blog.isomorphic.com/your-web-...olor-you-want/
Which is what made me want to take a look.

However, the post doesn't mention much about *how* to utilize the "online" part. I couldn't find it in any online showcase.
I checked the quickstart PDF and the "Skinning" javadoc page (https://www.smartclient.com/smartgwt.../Skinning.html). Neither make any mention of the online skin editor.

So, i downloaded 12.1 , deployed the showcase in Tomcat locally, could find nothing there either. I can see something in the WAR under /tools/skinTools, but there's no reference to it from the showcase, nor any servlet defined in web.xml, so, what am i missing?

Pointers appreciated.

[Isomorphic]

Hi Mathias, we'll check on why there is no link in downloaded packages. There is supposed to be one, but perhaps we have an error where it's not shown for Pro packages.

We have intentionally not yet announced the online skin editor, because it's got a few bugs. If you want to play with it, it's here - you will need to be logged in with an account that has a Pro or better license. We'd welcome feedback, but keep in mind, it's not announced yet because we know some things are broken :)

[mathias]

Well, if the showcase war is where i'm supposed to see it, it's not there. See attached screenshot.



I would also, in that case, mention that i think the documentation would benefit from some instructions on *where* this "online skin editor" resides and how one's supposed to use it. As would the blog post have, IMO. Just trying to help!

Is there any way for me to activate this editor myself right now, or do i have to wait for a new release?

All the best.

[Isomorphic]

To reiterate:

We have intentionally not yet announced the online skin editor, because it's got a few bugs.

That would be why you're not finding links to the online skin editor on the blog or in the docs. Because we have intentionally not yet announced it.

But we just gave you the URL to the not-yet-announced-on-the-blog online Skin Editor, if you want to preview it. To use it, click the link.

[mathias]

Hey thanks for quick response!

Sorry i missed your comment, but how do you mean you have not announced it? Half your isomorphic.com landingpage is "12.1 available now", if you click on it you have "It's here!" and literally the first item in what's new is "online skin editor".

Also, your latest blog post deals with "what's new in 12.1" saying "Our 12.1 release comes with an ‘Online Skin Editor‘". This is what made me spend more than an hour trying to get it running yesterday.

*Nowhere* is it mentioned that it's not announced, or in beta.

However, thanks i will check the preview.

[Isomorphic]

The online Skin Editor is a feature of the 12.1 release. If you have access to 12.1 you will have access to it. That's what we announced on the blog.

But 12.1 is a downloadable release, and the Skin Editor is an online tool. There is no reason they would need to be available on the same day. There are issues in the online Skin Editor which do not affect the rest of the downloadable 12.1 release, so access to the online Skin Editor has not been announced.

All clear now?

[mathias]

Yes. I didn't get from the announcement or this thread that online meant through your infrastructure. Thanks.

Some feedback:

Great start! There are more things i could imagine being able to configure - for example rounding of buttons, tabs, sizes of buttons and tabs.

This tool will be great for our non-technical people to play with.

[Isomorphic]

OK, that explains the disconnect. Yes, by online we mean hosted at Reify.com.

All of that is coming. The 13.0 version even has a gradient editor with configurable color stops.

[mathias]

Ooo, 13!. We are as you probably can sense evaluating making a new version of our web and which technology to choose. Do you have anything to share regarding 13.0? for example release date, progress etc.