Jump to content


  • Content Count

  • Joined

  • Last visited

  • Days Won


Everything posted by lynkfs

  1. Found this on stackoverflow. Are your client server and ws server separate ?
  2. css here, project here Nothing fancy, just used the css and html of the example as-is. Could be simplified The CSS grid is implemented in these lines in the stylesheet : display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); grid-gap: 1rem; "give me as many columns as fit on the available width where each column is at least 320px wide, or maximum 1 fraction" The CSS grid is pretty powerful and is available in all modern browsers, including mobile. Time permitting, I'll dig into it a bit deeper.
  3. Responsive design in essence consists of 2 measures : style all components as best as possible depending on screen size (larger buttons on mobile, proportional font sizing etc) tweak the layout of forms so that it works best on any given screen size 1) Screen size dependent styling can be done in code and/or is done as other frameworks do by including media queries in the stylesheet. Media queries basically activate different parts of a stylesheet depending on the actual screen size. Smart doesn't implement this in its shipped stylesheets, but there is no reason it can't be d
  4. As far as I understand Node, for a simple http server the action is in the handlerequest proc. This procedure has a request and a response object, and the latter can be used to send data back to the client. Request.Handle.on('end', procedure(data: variant) begin Response.&End('Headers: '+request.Headers.ToString()+#13#10+ 'Content: '+Variant('this is the response from my server')); //<============= //These are not automatically freed after HandleRequest as that would //prevent reading of content data using async functions. Requ
  5. you probably need to check explicitly on pathname : var url_parts : variant := url.parse(request.Url); case url_parts.pathname of '/test' : begin console.log(url_parts.pathname); end; end; otherwise looks ok
  6. I don't see much of an advantage to be honest. If the ide is changed to allow both versions, then that negates any code problems of course. There is however also documentation (Primoz book) and search to consider. Personally I don't use TButton etc (as that was your question).
  7. lynkfs

    css styling

    Thanks There are however a couple of minor / major (?) caveats doing it like this : I made up some more metro components, and it becomes apparent that it is unavoidable to use more modifier classes: TagStyle.Add('primary image-button outline icon-left rounded etc). this type of styling is not supported by the visual designer in the ide, so styling can be done in code only. Even though only one-liners (TagStayle.Add( ) (most rtl components (but not all) have a component, a border and a background theme class baked in. Not all of these can be reused, so sometimes the bord
  8. lynkfs

    css styling

    Easy to use... Suppose we want to develop a Metro theme To take buttons as an example, the official metro style has a number of predefined buttons : To replicate the above, and do it in such a way that : the component code (TW3Button) does not need any change the standard theming classes still apply (TW3Button TW3ButtonBorder TW3ButtonBackground), but with different content of course while allowing for these different predefined component versions is to do something like this procedure TForm1.InitializeForm; begin inherited; // this is a
  9. lynkfs

    css styling

    Wow, you guys are funny. The question I had was : what is the easiest way to style Smart components. Smart ships with a couple of standard stylesheets, or themes, so styling is a matter of selecting one of these. To change the styling of a specific component in a theme, just change the css specifications in the stylesheet, either manually or through code. A different topic altogether is to develop new themes. It is not a simple task to f.i. develop a Metro theme stylesheet which covers all of the current Smart visual components. That's why I had a look at externally availab
  10. lynkfs

    css styling

    I think sometimes I'm very bad at explaining things. I'll respond over the weekend
  11. lynkfs

    css styling

    The point is that using normal Smart components, they can be styled very differently and exactly as you want with just 1 line of code. Try hovering your mouse to see visual changes
  12. lynkfs

    css styling

    Browsers are certainly talented as multi-language processors. They have to understand html, css, javascript, svg and lately web-assembly as a fifth language. XML and Json are format specifiers, but could be borderline categorised as languages as well. Smart elevates javascript to great heights, but sort of leaves the other ones at the periphery. Especially css. Css can be used for a) component styling including colours, fonts etc, b) visual layout of pages/forms and reacting responsively to screen size and orientation and c) interactivity in various forms. Some of this overlaps with
  13. I agree. I would like to see more openness around the whole of the product. A development roadmap for sure, the success of a product depends on whether it evolves in line with the needs of its users. But I would also love to see the company's marketing and and long-term positioning, a bit of a vision of the current owners.
  14. and here is the Grid - JQWidgets implementation working sms demo here Notes : there are 2 different formats of defining the grid, one using jQuery explicitly and one as a web-component. The latter format has a bug somewhere and comes up consistently with a runtime error. The former format works fine. the 'export to Excel' button actually fires up Excel if installed and run locally (sms demo is grid only but take my word)
  15. it is a difficult job to develop themes. If you have an example of a theme you prefer, I might have a look (depending on the bounty) Cheers
  16. I got asked to have a look at how to integrate jqxWidgets in SMS There are a heap of ready-made widgets under the name of jQuery UI Widgets, ranging from grids to calendars to tooltips and many more. The example here is a jqxButton with an image in the left top corner. The vanilla html file for this looks like <!DOCTYPE html> <html lang="en"> <head> <meta name="keywords" content="jQuery Button, CheckBox, Toggle Button, Repeat Button, Radio Button, Link Button, Button" /> <meta name="description" content="The jqxButton widget allows you to d
  17. See previous post : any type of no-code / lo-code solution requires a visual ide, not only for the visual components like buttons etc but also for the non-visual process components. Such an ide allows for both visual and non-visual components to be connected according to the principles of FBP. See previous post and link here. To see how this would pan out, I made this proof of concept no-code / lo-code web-based ide. (Proof of concept not being a full fledged finished product, but at least gives some insights) To diminish the strain on the brain a bit, the layout is based on the Smart
  18. it works fine you have to add these lines to your index.html file <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="json-rpc-client.js"></script> and get this json-rpc-client.js file physically in the same directory as your index file code I used : procedure TForm1.W3Button2Click(Sender: TObject); begin var client : variant := new JObject; asm @client = new JSONRpcClient({ 'url': 'https://user-api.simplybook.me', 'headers': { 'X-Company-Login': 'lynkfs', 'X-Token': '89d85d8
  19. i'll have a look over the weekend
  20. Having a cursory view on this library, what you probably want to end up with is a pascal variable called 'client', which you can use outside asm blocks. This will allow you to issue calls like client.getEventList() etc. to do that you can do something like this var client : variant := new JObject; asm @client = new JSONRpcClient({ 'url': '//user-api.simplybook.me', 'headers': { 'X-Company-Login': 'ACME', 'X-Token': token }, 'onerror': function (error) { alert(error); } }); end; var EventList: variant := client.getEventList(-params-);
  21. Easiest way : procedure TForm1.InitializeForm; begin inherited; // this is a good place to initialize components var CalenderBox : TW3Panel := TW3Panel.Create(self); CalenderBox.SetBounds(10,10,252,266); CalenderBox.handle.id := 'CalenderBox'; var myCalendar : variant := new JObject; asm @myCalendar = new dhtmlXCalendarObject("CalenderBox"); end; myCalendar.disableDays("week", [7]); myCalendar.setDateFormat("%Y-%m-%d"); myCalendar.setHolidays("2019-03-19"); var yesterday : float := Now()-1; myCalendar.setInsensitiveRange(null, DateToStr(yesterday)); myCalenda
  22. Browsers pick up selected text in <textarea> and <p> type of html elements, not necessarily in each and every other type. Also they will not mess with existing clipboard data unless initiated by a user action (like clicking a button). Bit of a roundabout way of doing this, but this works (form with W3Label1 and W3Button1) procedure TForm1.W3Button1Click(Sender: TObject); begin var xCopy : Procedure(S:String); asm @xCopy = function copyToClipboard(text) { if (window.clipboardData && window.clipboardData.setData) { // IE specific code path to prevent
  23. Alternatively the intersection observer API might be a feasible approach as well. That would have the advantage of not burdening the scroll event with expensive code and being able to scroll variable row heights.
  24. did you set designMode to 'on' ? execCommand only works if this flag is set, something like browserapi.document.designMode := 'on'; btw, there is a new Clipboard Api, which supersedes the execCommand handling. Should be supported by now in modern browsers I think.
  • Create New...