Hi Piotr, I think am I not communicating the principles effectively.
First, IMO, addClassName and removeClassName should not be in UIBase. Lots of apps can be written without needing these methods. I think they can be written as utility functions. Second, the computation of the final element.className should represent the state of the component, so I don't get why you need an _internalClassName or should ever set it to "". The computation for a component with a shadow would be to check the shadow property and if it is true, add a className for the shadow to the list. Then I think you wouldn't have the problem you showed in the animated GIF. When the classname property is set from the outside by MXMLDataInterpreter or even user-written code, those classNames are added to the list with the typeNames and the shadow className if shadow is true and then set on the element. Finally, for addClassName and removeClassName, and all other Royale code, we don't want to do much if any parameter checking. That is also just-in-case code. The production code should not be passing in null or other bad values. And once you fix that, then the checks that you have written do not add value. I have proposed that there are debug-only code that does parameter checking. There is a goog.DEBUG flag you can use for that. HTH, -Alex On 2/28/18, 12:40 AM, "Piotr Zarzycki" <[email protected]> wrote: >Hi Alex, > >Sorry about that. Let me show you code and I recorded GIF with problem >debugging. > >*Code in UIBase which I have implemented:* >addClassName and removeClassName [1]. >addedToParent what is happen with internal field which I have added [2] > >*Code for Testing* [3] - I'm adding first className, than shadow. > >*GIF* [4] We are starting from the constructor. Pay attention to the >moment >where className is being wiped out, later I have to use my internal >variable to get it back. > >Does that more clean now ? > >[1] >https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fpaste.apa >che.org%2FEumG&data=02%7C01%7Caharui%40adobe.com%7Cee5c84b4e3ff4ddb578008d >57e87046f%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636554040718214998& >sdata=cDT88OF63TdBMPxYY2vwMSIRxD%2FP3DvwHupj%2BQHsofw%3D&reserved=0 >[2] >https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fpaste.apa >che.org%2FArmU&data=02%7C01%7Caharui%40adobe.com%7Cee5c84b4e3ff4ddb578008d >57e87046f%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636554040718214998& >sdata=m6whImrP70u7kzRxCbErlxCHWef8TKNejwm4Sr7bw7g%3D&reserved=0 >[3] >https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fpaste.apa >che.org%2FKrxq&data=02%7C01%7Caharui%40adobe.com%7Cee5c84b4e3ff4ddb578008d >57e87046f%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636554040718214998& >sdata=tpeUYSQIXGXtES8hyr7zSeet528ZTczSltcNccqRGDo%3D&reserved=0 >[4] >https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2F1drv.ms%2 >Fu%2Fs!ApVpLyjpHDC2hPtoCi65kIZZPwjSpQ&data=02%7C01%7Caharui%40adobe.com%7C >ee5c84b4e3ff4ddb578008d57e87046f%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C >0%7C636554040718214998&sdata=eX%2FgZ0MA%2BdQJjcpYtMkk1pw3r0iVkdRa%2F6TWRTG >10OY%3D&reserved=0 > >Thanks, >Piotr > >2018-02-27 23:31 GMT+01:00 Alex Harui <[email protected]>: > >> Hi Piotr, >> >> I could not understand this explanation. Might be better to show actual >> code. For example in #3, there is a cssClass variable that I don't know >> about. Also you mention at the bottom setting something as empty, but >>I'm >> not sure what that is. >> >> However, IMO, this code should be in utility functions, not in UIBase. >>I >> think plenty of useful applications can be built without changing >> classNames at runtime. >> >> I'm off-line for the next several hours so we can pick this up again in >> your morning. >> >> Thanks for working on it, >> -Alex >> >> On 2/27/18, 2:21 PM, "Piotr Zarzycki" <[email protected]> wrote: >> >> >Here is how I'm thinking to resolve that issue. I would take Harb's >> >proposition and add to UIBase addClassName() and removeClassName(). >>Next >> >I >> >would add internal field _internalClassName:String. >> > >> >addClassName(value): >> >1) Will check if provided class name exits in _className and in >> >_internalClassName. >> >2) Will add to _internalClassName += value >> >3) Assign to the element.className in the following way: >>element.className >> >= cssClass + " " + _className + " " + typeNames; >> > >> >removeClassName(value) >> >1) Will check if provided classs name exists in _className or in >> >_internalClassName >> >2) Make a replace to empty string if css class name exists. >> >_className.replace(value, ""); >> >3) Assign to the element.className: element.className = _className + " >>" + >> >typeNames; >> > >> >In added to parent we are computing _internalClassName with _className >>and >> >typeNames. Then it's being set as empty. >> > >> >element.className = _internalClassName + " " + _className + " " + >> >typeNames; >> > >> >I have implemented it and it seems to be working. Waiting for your >> >thoughts >> >on that solution. The last step where we are adding all three fields is >> >the >> >most important. Points 3 in addClassName and removeClassName are >> >necessary, >> >because user may want to more dynamically manipulate classes once >> >component >> >is created. Ex. "is-active" class is removed and added on demand. >> > >> >Thanks, Piotr >> > >> > >> >2018-02-27 13:38 GMT+01:00 Piotr Zarzycki <[email protected]>: >> > >> >> I think I have analyzed everything and have some implementation >> >> proposition. I will try to provide it later today. >> >> >> >> Thanks, Piotr >> >> >> >> 2018-02-27 13:35 GMT+01:00 Harbs <[email protected]>: >> >> >> >>> ExpandableSearch broke too. >> >>> >> >>> > On Feb 25, 2018, at 6:15 PM, Piotr Zarzycki >> >>><[email protected]> >> >>> wrote: >> >>> > >> >>> > Harbs, >> >>> > >> >>> > If you are using something more than MDL Dialog in your >>application >> >>>it >> >>> > would be great to get feedback whether I didn't break for you >> >>>anything. >> >>> :) >> >>> >> >>> >> >> >> >> >> >> -- >> >> >> >> Piotr Zarzycki >> >> >> >> Patreon: >> >>*https://na01.safelinks.protection.outlook.com/?url= >> https%3A%2F%2Fwww.pat >> >>reon.com%2Fpiotrzarzycki&data=02%7C01%7Caharui%40adobe.com >> %7C45a065853ba1 >> >>4a295d9d08d57e3082b9%7Cfa7b1b5a7b34438794aed2c178de >> cee1%7C0%7C0%7C6365536 >> >>69427477536&sdata=tOlZF%2FWAGhqn1toqJCCqjc14NZU56MnZZK >> 9liXcy%2BPg%3D&rese >> >>rved=0 >> >> >> >><https://na01.safelinks.protection.outlook.com/?url= >> https%3A%2F%2Fwww.pat >> >>reon.com%2Fpiotrzarzycki&data=02%7C01%7Caharui%40adobe.com >> %7C45a065853ba1 >> >>4a295d9d08d57e3082b9%7Cfa7b1b5a7b34438794aed2c178de >> cee1%7C0%7C0%7C6365536 >> >>69427477536&sdata=tOlZF%2FWAGhqn1toqJCCqjc14NZU56MnZZK >> 9liXcy%2BPg%3D&rese >> >>rved=0>* >> >> >> > >> > >> > >> >-- >> > >> >Piotr Zarzycki >> > >> >Patreon: >> >*https://na01.safelinks.protection.outlook.com/?url= >> https%3A%2F%2Fwww.patr >> >eon.com%2Fpiotrzarzycki&data=02%7C01%7Caharui%40adobe.com% >> 7C45a065853ba14a >> >295d9d08d57e3082b9%7Cfa7b1b5a7b34438794aed2c178de >> cee1%7C0%7C0%7C6365536694 >> >27477536&sdata=tOlZF%2FWAGhqn1toqJCCqjc14NZU56MnZZK >> 9liXcy%2BPg%3D&reserved >> >=0 >> ><https://na01.safelinks.protection.outlook.com/?url= >> https%3A%2F%2Fwww.patr >> >eon.com%2Fpiotrzarzycki&data=02%7C01%7Caharui%40adobe.com% >> 7C45a065853ba14a >> >295d9d08d57e3082b9%7Cfa7b1b5a7b34438794aed2c178de >> cee1%7C0%7C0%7C6365536694 >> >27477536&sdata=tOlZF%2FWAGhqn1toqJCCqjc14NZU56MnZZK >> 9liXcy%2BPg%3D&reserved >> >=0>* >> >> > > >-- > >Piotr Zarzycki > >Patreon: >*https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwww.patr >eon.com%2Fpiotrzarzycki&data=02%7C01%7Caharui%40adobe.com%7Cee5c84b4e3ff4d >db578008d57e87046f%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C6365540407 >18214998&sdata=VYtgB8rsurZAHpO%2FVs%2FqOkmxROz58p7VvQ%2B0EK8VPPc%3D&reserv >ed=0 ><https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwww.patr >eon.com%2Fpiotrzarzycki&data=02%7C01%7Caharui%40adobe.com%7Cee5c84b4e3ff4d >db578008d57e87046f%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C6365540407 >18214998&sdata=VYtgB8rsurZAHpO%2FVs%2FqOkmxROz58p7VvQ%2B0EK8VPPc%3D&reserv >ed=0>*
