Why is wysiwyg so hard?

Just like in Braco, our codebase varies, or number lines vary greatly. It probably goes more down than it goes up, even though we add stuff. You know, there's different ways of writing code, functional or object-oriented, stuff like that. So, small shifts in how we do things affects greatly how much code we need to build, as well as another big thing is when we drop browser support. Like dropping IE7, we can take out a huge chunk of code. We still have support for IE8, but it's probably going to go away in a not-too-far future as well. We will be able to drop even more. Okay. So, we try to structure the project into these different parts. So, we have a core, which really we don't expect a lot of people to contribute to. It's pretty complex. It's about handling selections, cursors, and advanced content. Stuff like Content Edible Falls, which allows you to have non-editable content in an editable area. We want to keep it structured. We want to keep it pretty separated. Okay. So, basically the core could be kind of like an API. And we were able to test it, automated testing. So, a bulk of our unit testing is in the core, for the core. Then we have the plugin layer, which is really where we can see contributions. We expose an API, which people can use. TinyMC has a very rich API, probably too rich. We should probably limit it down a little bit. When you expose APIs, you also limit a little bit of the refactoring that you can do. The UI is something we started working more and more on. We realized that like in Braco or other clients that we have, like Apple or everything, they usually use their own UI. So, they use TinyMC as an engine. And they create their own buttons. And they want to... They want to fit it into their own design. We're going to make that easier, because we see that more and more. So, one of our goals is to make it easier to use the API, to create custom UIs. But we also want to provide the, you know, easy use, easy access stuff that just anyone can plug in and use. So, we provide themes. We provide some skinning tools. You can change the colors, borders, margins, and paddings, and everything. Okay. And of course, the UI comes in mobile as well. That's something we continue to work on. As I said, plugins, that's really where the bulk of the contributions come in from TinyMC, and where we expect them to come in. Yeah. That's about it in the structure. It's really tough to keep everything clean and nice. It's... When you get contributions, you probably all know they write stuff to solve their particular problem. So, we need to usually take their solution and adapt it, or fix it, or something. So, it's just not... You know, just pulling stuff in. It sounds really nice that you get a lot of pull requests, but all of them takes quite a lot of work to review all the code and make sure it fits the quality that we're looking for. Hmm? Didn't change. Oh, there we go. Weird. Yes. So, involvement. We want to get the community involved. We want to get it easy to use and consume TinyMC. You guys know it as it's just there for you guys in the . It's easy for you guys. But not for everyone. We... I mean, the end user is kind of the people that's going to be using TinyMC, which is good. We want it to be user-friendly. That's nice. The first person who's going to be handling it is the developer, so it needs to be developer-friendly first. Easy to get started. We started using all the package managers. NPM had, I think, 25,000 downloads last month, which is pretty big. I don't actually know how they count that, like if every iteration or... We'll see. We've got CDN solutions, Bower, NuGet, Composer packages. Yeah. To get started easily. And integrations is something we're going to start looking more and more into. Like, we have some big clients now that we do integrations for, commercial clients. But we want to see if it makes sense to, for example, make... For us to maintain, make an implementation that perhaps some practice can use or some other systems. So we... Probably what you're going to see in the coming year is probably retargeting certain systems and making certain integrations with them to enhance the experience with TimeSleep. Because a lot of experience and a lot of the bad rep that we get is from implementation. So if it's not implemented well, it looks bad. So we want to make, you know, we want to make an effort to see if we can assist in those things and make it better. As I said, user-friendly and it goes into the UI. We recently acquired resources to do UI, UX testing, a lot of that kind of stuff. So you're probably going to see more stuff in the UI coming year as well that we work on. And as I said, we're trying to make the separation better. So if you don't want to use the UI, you can use... More easily use the API and do it that way. I talked about V3C earlier. Our involvement in that is kind of limited. We haven't had much faith in the stuff that's been coming out of there. But we continue to monitor it and help where we can. It's just that we have a limited amount of time that we can dedicate to writing papers and all that kind of stuff. So we'll see. I mean, it's a long-term improvement to the product that actually gets some standards and some... Some browser implementations that are working better. Cloud and CDN is something we work a lot with now. Like, why shouldn't... I mean, trying to see just the JavaScript like the or anything else, why shouldn't you run it from a CDN or a cloud solution? So we do a lot of work around that as well, making sure that it works well. We have our own CDN to host the script. So the community, why doesn't it change? Damn, Google. All right. So a lot of similarities with the Bracco community stuff. We're trying to engage in discussions and really get people to help themselves. Because, I mean, being an open source product, you just can't provide free support for everyone. So it's really important that community help itself. I think that goes for the Bracco community as well. You guys are... I mean, the Bracco community is pretty much where we want to get more to with our community. Times is available in GitHub. We have the open development, log issues. We do triage. We use the community a little bit for like when we do release. We do... We adopt the release often kind of cycle. So we try to... We use the community a little bit to help us with the testing. So if there's any critical bugs, they show up right away on GitHub with all the users we have. But from there, we do pretty much sort of a triage. We take the most important bug requests that we feel are getting the most voices and try to fix those. As far as feature requests. I mean, as I said, we've been a little bit accused of being bloaty or big or whatever. So we want to keep the core simple. We're not going to have every other feature under the sun in the core. It's going to be plug-in based if it's going to be in there. So we want to maintain and develop the core well so we can ensure the quality is up to standards. But as far as major changes to the core, I mean, it's a pretty advanced piece of software. We don't see a whole lot of code requests to the core. So it's not actually a problem that we get a lot of weird feature requests or anything like that. But there's certainly... You can never just assume how TimeC is used. I mean, we... CMS systems is just one of the many systems that can be used. Like we have... There's a medical company that does all the medical journaling for Northern Europe, like Sweden, Finland, Norway. They use it to write medical journals in a .NET app, internal .NET app. So it's just... You can never know how it's being used. Email clients is another example, which it wasn't maybe really meant for, but works pretty well. So I mentioned enterprise. We have some enterprise services. We want to be able to increase the value of the product through services, support, integrations, and just the quality, Q&A, testing. We have TimeC open source, TimeC community, and we have TimeC enterprise, which lacks the community version a little bit. So that we can ensure that we capture all the... Issues that might arise from the community release and not release those to the enterprise. And also, enterprise clients typically have longer release periods. So we... I think we target three or four releases of the enterprise per year compared to the community version, which releases, I don't know, once a month, basically. Some of the features that we provide. So... We have some more like services. So when you need something beyond just the editor. Improved copy and paste is one of the really big issues for editors. There's probably more code in handling the crap from Office copy pasting than there is in Tiny itself. So you get some perspective. So it wasn't an option to really include that in the open source project. It just... It has to be lifted out and be maintained in a commercial sense. So it makes sense for us to just invest so much time in that. Spell checking. Of course, there's something we... We have pretty basic spell checking service now. We're trying to develop it for grammar and all that kind of nice stuff. Custom word lists, etc. So that'll be coming pretty soon. We have the old Moxie manager, file manager stuff. Which is pretty cool. And recently we added accessibility and it mentions. The accessibility checker is just... It checks your HTML for accessibility issues and allows you to actually fix them as well. So tables must have captions, images must have alt text. Stuff like that. Pretty useful. It mentions this. You probably know what it is. You type... It works in GitHub and all that kind of projects. Type the at sign and you start typing a name and it comes out as a user list. So we have integration for that as well. You can see it at the right side there. We're trying to expand to more services and more features and build on what we have. Collaboration and commenting and track changes and stuff like that is things we're contemplating. So what's in the immediate future? We have a new theme coming out. I think I mentioned that a little bit. A bit of a different, more simplistic concept. The... The... Editing. Which is popular now. Kind of distraction free stuff. We do a lot of internal restructuring as well. So what that means is probably won't mean much for developers or integrators. We just restructure the products. We can separate it up. As I said, we want to detach the UI from the core more and stuff like that. So of course the monthly incremental needs. Monthly incremental improvements. Just fixing bugs. We're going down the path of cloud delivery. So if you want to have an always up to date time C. Also you can do a G query in the URL. I want all the latest 3.x version, 2.x versions or a specific version even. So we're doing stuff with that. Mobile is a big thing coming up. More and more. Mobile slash responsive. So the editor is more responsive. This is probably going to come with us dumping some old browsers. So we're going to be able to use Flexbox a lot better. Something new in the space is cognitive features. Not sure if you've heard of that. But IBM Watson you've probably heard about. Where you can pretty much... You can take in... You can analyze your text, your contents. So we're going from just creating content to actually allowing your users to improve their content. Get feedback from something. IBM Watson can detect stuff like what's the tone of your text. Is this a business type of text? Are you looking angry? Are you... Various emotions. What kind of emotions are your texts outputting? There are a bunch of other features. If you check out the IBM Watson project. The APIs there are pretty cool. You can do all kinds of cool stuff. Also stuff like when you write an article about something. It's contextually aware. So it knows what you're writing about. And can present you with stuff like Wikipedia posts. Images, content and stuff that relates to your text. Collaboration is... Interesting. It's... It's an umbrella term for a lot of stuff. Like comments, track changes, collaborating, editing. Like Google Docs style. Where you can be multiple people in the same document. We're kind of in the research process of that. Like we're researching what we can do. What we need to change in order to provide support for those kind of stuff. But it's pretty exciting. And I think probably during next year you're going to see a lot of editors going in this direction. To allow real time collaborating and editing. Or something similar. Of course stability of the product is one of the key foundations. We really want to... When we release majors we really want to get to a stable version really quickly. So... You know, every time we release a major we follow it up with stabilizing patches pretty much... Maybe twice a week or something. If we need to. So stability is really important for us. And for our clients as well of course. I'm going to demo our concept in Umbraco. So... If I log into my little cloud service thingy. Alright, so... This is how it's currently looking in Umbraco. So this is tiny then. Umbraco does have their own UI stuff as you know. The link stuff. And this demo is really more of a hack right now. It's... I hacked this together yesterday after seeing the cloud service stuff that they presented. So... But it's kind of what... It kind of shows a little bit that I think you guys are pretty... You're pretty used to how it looks in Umbraco. And maybe doesn't realize that there's just a lot more to tiny than what Umbraco is doing. So this is kind of an idea of what could be done. So... I have this hack bookmarked here called the hack. Which... Which loads a new version of tiny with a new theme. And it looks like this. There's no later. So what happens is... As I said, distraction pre-editing. So everything happens when you actually select something. When you type, you don't have anything distracting you. No toolbar or anything. You can still use shortcut commands and stuff like that. But really... This stuff is... You know, allows you to do some pretty cool stuff. So... There are two main toolbars. One is when you select something. When you create a link or bold or a heading or something like that. The other is when you're on a blank line. You can insert what we call block elements or things like that. Which could be images. For example... Or tables works as well. And you have the table in my toolbar. And you can add rows and columns and stuff. And insert row before. Yeah. So... So that's kind of the base concept that we're working on. And this is going to be... This theme is going to be released sometime end of this month. So pretty soon. You see there's a lot of quirk still. You can't... It shouldn't scroll like that. So... But yeah. As I said. In a Braco, there... You're probably used to it looking a certain way. But it doesn't necessarily need to be like that. So... You can... You can start pestering Braco HQ to... To update. I think they're running a 4.1 something as well. So... This actually loads 4.3 something. So... Alright. That's pretty much it for my presentation. If you guys have any... Any questions? Yeah. Just a quick one. Yeah. I just want to say thanks. Yeah. Thanks. And... What name for our... Oh, yeah. I was going to mention that. Yeah. So anyone know what the name stands for? No? So I mentioned that we do... We did CMS projects before. So we had... We had a CMS called MCE. We had... We had a CMS called SmallMCE. And the editor for those CMS was TinyMCE. So MCE stands for Moxcode Content Editor. So that's... That's where the name is from. So... Yeah. How many of you use it or have used it outside of Braco? Like... There's quite a lot of you. It's nice. Cool. How many of you use like the skin tool that we have? Is there anyone who used that? Yeah. Yeah. So... Yeah. It's just one of the things that people just miss. I don't know. We pretty... We could probably have better documentation and stuff on this. So you can... This is... Basically dumps all the dialogs from TinyMCE so you can see how it looks. And you can... You can change all the... It's... I don't know. It's something like 80 things you can change with different stuff. But... There's some... So this is the default UI. You have charcoal. You have... Type UI. Tender. We provide a couple of the... This is the old one. The gradient one. So the modern one we just flattened it. It was just changing some less CSS stuff. So it's pretty cool. And you can download it and you can actually drag the... You download a JSON file. And you can actually... Actually, you download a zip file which has the skin that you created. And in it is a JSON file. So you can drag it up there and do some changes if you wanted to. This is probably going to be evolved. At some point as well. So we're gonna... This is on skin.tymesee.com now. But it's gonna be in it... It's gonna be on the TimeSee website eventually. So yeah. Stuff like that. Any other questions? Yep. Yeah. We have a... Not a lot of questions about it. Yeah, we have a build customizer. You can select what plugins you want and download. But really, I mean, I believe pretty much everything in TinyMCE, all the plugins and everything is laser loaded. So if you don't have it in your config that you're loading a plugin, that file is not going to get loaded. So it's also one of the misconceptions. Oh, I downloaded this huge package and it takes time to load, blah, blah, blah. But it really depends on the configuration you have, how much this gets loaded. So it's all laser loaded, basically. Yeah. Anyone? Yeah. Do you have some other tips on how to best start a new record? You mentioned that TinyMCE has got a very interesting market to use. Um. Well, yeah. So, I mean, I don't know how many, there's something like 40 features or something in the base. And in Bracu, I guess you can do tables. Yeah, so. I think. Yeah, they have their own UI to create the table. So, yeah, exactly. Yeah. As far as more features, I think there's a list somewhere. 40 editor features. I'm trying to, like, think. What is actually, if you go here, what do you use exactly? My hack script actually screws the whole thing up for some reason. It's a pretty stripped down version. So, yeah, exactly. And I actually, I favor that. Like, a script, when you actually implement TinyMCE, if you do something out of Bracu or something, like, strip it down really hard. Like, how you, what you allow them to do. I mean, don't just add all the features, like background colors. And all of a sudden, they decided, hey, it's Easter and everything's going to be jello today. So, that's just horrible. I'm very much in favor of stripping it down and just forcing certain types of, you know, behaviors on them. Yeah. Yeah, so you can probably enable pretty much most of the features. Yeah. So, undo, redo. I'll probably have paste enabled because that's, I don't know. If you don't. If you don't have it enabled, it doesn't really take over paste, which kind of screws things up. What else? Remove link, anchor, table. You can enable that there. Character map. Yeah, I mean, it uses the basics. Yeah, CodeBear is pretty good. That's actually just something that Bracu has added themselves. So, it's not something we added. So. We're going to have CodeMirror support. But it's just, we don't want to ship CodeMirror with the product because CodeMirror itself is something like 250 kilobytes or something. So, we don't really want to ship that with the package. It's better if people do like, and Bracu has done it and implemented it themselves. So, yeah. It's funny that it's V3, but it's actually V4. But, all right. So, that's good. That's not a bad thing. No, but, I mean. Yeah. Like I said, you know, keep it simple. Like, when you do implementations. Like, don't give them all the weird stuff. They're going to screw your page up. So, yeah. What we're hoping to do is interact with Bracu HQ and the community to maybe provide some of our enterprise features. So, you can get spell checking and accessibility checking and stuff like that in Bracu eventually. That would be pretty cool. So, that's one of the things I talked about with doing integrations. So, we're going to try to. To target some specific platforms and do good integrations. Any other questions? Yeah. Yeah. I mean, you can break things down really granular. Like, you could potentially make a plugin out of selections. But, I mean. Or cursor handling. But, Tiny isn't really going to work without that. So, stuff that you can use. Stuff that works without, you know, being in there is pretty much the limit. So, yeah. It's a little bit tricky sometimes to know what we need to put in the core and what we need to put in the plugins. We tend to try and put as much as possible into plugins that make sense. Like, feature-wise. But, a lot of the core stuff like selection and cursor and entry key handling and stuff like that is just old core stuff. So, but we're doing. I mean, we're constantly doing. We're restructuring and stuff. So, stuff that was in the core before might not be tomorrow. So, it's. But, it shouldn't affect the developer. We're trying to do small incremental changes. So, it doesn't affect the developers much. So, this was one of the really interesting about Embraco and Embraco 5, for example. Where they used to throw everything away, if I'm correct. Oh, sorry. So, we don't want to end up in that situation. So, we have a lot. I mean, we have so many people using TinyMC. So, we want to. If we're upgrading and we're doing major changes, we want to keep it backwards compatible as much as possible. You can actually run version 3 plugins in version 4 if you use a compatibility plugin. So, that's kind of the limit that we stretch to, which is pretty awesome. But, yeah. Any more questions? Questions? Questions? Questions? Questions? Questions? Questions? Questions? Questions? Questions? No, I've not committed a crit. I heard about it, but I haven't seen that. So, I don't know. Ah, okay. Yeah. We have a concept that we've been playing with. Not in code, but we've been playing with it. We should maybe use that. It's actually taking a step outside the editor. so we provide a block-based control kind of like a grid system where you can like rich text maybe just one of the items that you can use there so you can have just a plain text title images as block elements and stuff like that so you can arrange stuff maybe providing a wrapper library that does something like that it's something we experiment with but we don't have anything currently for that so it's a good question Any more questions? No? Alright, thank you for attending And if you guys want to talk I'm going to be here all day so just approach me if you guys want to talk about something Yeah, yeah It's Yeah, yeah Yeah Yeah Yeah Yeah Yeah Yeah Yeah Yeah Yeah Thank you. Thank you. Thank you. Thank you. Thank you. Thank you.