Jump to content

Luciano França

uniGUI Subscriber
  • Posts

    280
  • Joined

  • Last visited

  • Days Won

    4

Posts posted by Luciano França

  1. 6 hours ago, picyka said:

    Well, I believe you can use variables in CSS, and when logging into the system, set the value for these variables, or use the suggested solution

    ex: UniSession.AddJS('Ext.util.CSS.updateRule(''.x-btn-default-small'', ''background-color'', ''#162d3f'')');

     

    How could I put lines in this updateRule logic ?

    Procedure TMainForm.UniFormCreate(Sender: TObject);
    Begin
     UniSession.AddJS('Ext.util.CSS.updateRule(''.x-myfield-focus'', ''background-color'', ''#ffcccc'')');
    
     // As ?  Add('background-image: none;  ');
    
    End;

     

  2. 6 hours ago, Sherzod said:

    Hello,

    You can use 

    Ext.util.CSS.updateRule

    Like in this post for example:

     

     

     

    I don't understand how this can help me.

    see I have appearance settings that I save in the database and I need to pass these settings to CustomCSS

    Can you change this attached example ?
     

     

     

     

    Modifed CustomCSS.7z

  3. 1 hour ago, Luciano França said:

     

     Hello, after a long time I came across a problem, if a very large file is chosen, Unigui will crash.
     How could I check the file size and show an Alert to the User.
     

    How could I put a file size check in this code below and abort if it is too large.

     With FileHTMLFrame.HTML Do Begin
      Clear;
      Add('<!doctype html>');
      Add('<html>  ');
      Add('  <body>  ');
      Add('    <button id="BtnFileHTMLFrame" style="color:black;font-size:16px;" onclick="selectFile()">Aguarde o envio do Arquivo...</button>');
      Add('    <script> ');
      Add('      async function selectFile() {  ');
      Add('        let file = await fetchFile()  ');
      Add('        let filename, fileData  ');
      Add('        let filetype = ''Unknown'' ');
      Add('        if(file){  ');
      Add('          filename = file.name  ');
      Add('          filetype = file.type  ');
      Add('          let reader = new FileReader(); ');
      Add('          reader.readAsDataURL(file);  ');
      Add('          reader.onload = function() {   ');
      Add('            fileData = reader.result   ');
      Add('            let params = {"filename": filename, "filetype": filetype, "filedata": fileData} ');
      Add('            params= JSON.stringify(params);   ');
      Add('            top.ajaxRequest(top.Form_UploadFileWeb.FileHTMLFrame, ''selected_file'', [''file_info=''+ params]); ');
      Add('          }    ');
      Add('          reader.onerror = function() {   ');
      Add('            let params = {"filename": filename, "filetype": filetype, "filedata": fileData}  ');
      Add('            params= JSON.stringify(params); ');
      Add('            top.ajaxRequest(top.Form_UploadFileWeb.FileHTMLFrame, ''selected_file'', [''file_info=''+ params]); ');
      Add('          }   ');
      Add('        } else {  ');
      Add('          let params = {"filename": filename, "filetype": filetype, "filedata": fileData}  ');
      Add('          params= JSON.stringify(params);   ');
      Add('          top.ajaxRequest(top.Form_UploadFileWeb.FileHTMLFrame, ''selected_file'', [''file_info=''+ params]); ');
      Add('        }   ');
      Add('      }   ');
      Add('      const fetchFile = async () => {   ');
      Add('        return new Promise((resolve, reject) => {  ');
      Add('          const el = document.createElement(''input'');  ');
      Add('          el.type = ''file'';  ');
      Add('          el.style.opacity = ''0'';   ');
      Add('          el.accept =  "' + Ext + '";  ');
      Add('          el.addEventListener(''change'', () => {  ');
      Add('            const file = el.files[0]; ');
      Add('            document.body.removeChild(el);  ');
      Add('            resolve(file);  ');
      Add('          });  ');
      Add('          document.body.appendChild(el); ');
      Add('          el.click();  ');
      Add('          const onFocus = () => { ');
      Add('              window.removeEventListener(''focus'', onFocus); ');
      Add('              document.body.addEventListener(''mousemove'', onMouseMove); ');
      Add('          };   ');
      Add('          const onMouseMove = () => {  ');
      Add('              document.body.removeEventListener(''mousemove'', onMouseMove); ');
      Add('              if (!el.files.length) {  ');
      Add('                  document.body.removeChild(el); ');
      Add('                  resolve(undefined); ');
      Add('              } else { ');
      Add('                resolve(el.files[0]); ');
      Add('              }  ');
      Add('          }   ');
      Add('          window.addEventListener(''focus'', onFocus);  ');
      Add('        }); ');
      Add('      }  ');
      Add('    </script> ');
      Add('  </body> ');
      Add('</html> ');
     End;

     

     

    Solution Partial

      Add('          const fsize = file.size; ');
      Add('          const Tamfile = Math.round((fsize / 1024)); ');
      Add('          if (Tamfile >= 8096) { ');
      Add('          alert("Arquivo muito grande escolha um aquivo menor que 8mb"); ');
      Add('          document.body.removeChild(el);  ');
      Add('          resolve(undefined); } ');

    how to exchange Alert for MessageDLG in javascript

     

     

  4. On 10/24/2023 at 12:33 AM, Norm said:

    Hi Luciano,

    Try the attached project and let me know if that's what you need and I'll supply the source code. It uses port 8077.

     

    fuploadDemo.zip 1.91 MB · 2 downloads

     

     Hello, after a long time I came across a problem, if a very large file is chosen, Unigui will crash.
     How could I check the file size and show an Alert to the User.
     

    How could I put a file size check in this code below and abort if it is too large.

     With FileHTMLFrame.HTML Do Begin
      Clear;
      Add('<!doctype html>');
      Add('<html>  ');
      Add('  <body>  ');
      Add('    <button id="BtnFileHTMLFrame" style="color:black;font-size:16px;" onclick="selectFile()">Aguarde o envio do Arquivo...</button>');
      Add('    <script> ');
      Add('      async function selectFile() {  ');
      Add('        let file = await fetchFile()  ');
      Add('        let filename, fileData  ');
      Add('        let filetype = ''Unknown'' ');
      Add('        if(file){  ');
      Add('          filename = file.name  ');
      Add('          filetype = file.type  ');
      Add('          let reader = new FileReader(); ');
      Add('          reader.readAsDataURL(file);  ');
      Add('          reader.onload = function() {   ');
      Add('            fileData = reader.result   ');
      Add('            let params = {"filename": filename, "filetype": filetype, "filedata": fileData} ');
      Add('            params= JSON.stringify(params);   ');
      Add('            top.ajaxRequest(top.Form_UploadFileWeb.FileHTMLFrame, ''selected_file'', [''file_info=''+ params]); ');
      Add('          }    ');
      Add('          reader.onerror = function() {   ');
      Add('            let params = {"filename": filename, "filetype": filetype, "filedata": fileData}  ');
      Add('            params= JSON.stringify(params); ');
      Add('            top.ajaxRequest(top.Form_UploadFileWeb.FileHTMLFrame, ''selected_file'', [''file_info=''+ params]); ');
      Add('          }   ');
      Add('        } else {  ');
      Add('          let params = {"filename": filename, "filetype": filetype, "filedata": fileData}  ');
      Add('          params= JSON.stringify(params);   ');
      Add('          top.ajaxRequest(top.Form_UploadFileWeb.FileHTMLFrame, ''selected_file'', [''file_info=''+ params]); ');
      Add('        }   ');
      Add('      }   ');
      Add('      const fetchFile = async () => {   ');
      Add('        return new Promise((resolve, reject) => {  ');
      Add('          const el = document.createElement(''input'');  ');
      Add('          el.type = ''file'';  ');
      Add('          el.style.opacity = ''0'';   ');
      Add('          el.accept =  "' + Ext + '";  ');
      Add('          el.addEventListener(''change'', () => {  ');
      Add('            const file = el.files[0]; ');
      Add('            document.body.removeChild(el);  ');
      Add('            resolve(file);  ');
      Add('          });  ');
      Add('          document.body.appendChild(el); ');
      Add('          el.click();  ');
      Add('          const onFocus = () => { ');
      Add('              window.removeEventListener(''focus'', onFocus); ');
      Add('              document.body.addEventListener(''mousemove'', onMouseMove); ');
      Add('          };   ');
      Add('          const onMouseMove = () => {  ');
      Add('              document.body.removeEventListener(''mousemove'', onMouseMove); ');
      Add('              if (!el.files.length) {  ');
      Add('                  document.body.removeChild(el); ');
      Add('                  resolve(undefined); ');
      Add('              } else { ');
      Add('                resolve(el.files[0]); ');
      Add('              }  ');
      Add('          }   ');
      Add('          window.addEventListener(''focus'', onFocus);  ');
      Add('        }); ');
      Add('      }  ');
      Add('    </script> ');
      Add('  </body> ');
      Add('</html> ');
     End;

     

  5. I have several settings that I save in my database such as font sizes, colors, etc.
    How could I give an update on
    "CustomCSS" because I realize that it is only loaded when creating the "TUniServerModule"

    Unit ServerModule;
    
    public
      { Public declarations }
      Procedure UpdateCSS;
     End;
    
    Procedure TUniServerModule.UpdateCSS;
    Begin
     With Self.customCSS Do Begin
      Add('.x-myfield-focus {  ');
      Add('   border-color: #7eadd9;  ');
      Add('  background-color: #FFFFE1;  ');
      Add('  color: #FF0000;  ');
      Add('  background-image: none;  ');
      Add(' } ');
     End;
    End;
    
    //============================================================================================================
    
    Unit Main;
    procedure TMainForm.UniFormCreate(Sender: TObject);
    begin
     UniServerModule.UpdateCSS;
    
     UniEdit2.JSInterface.JSConfig('focusCls', ['myfield-focus']);
     UniComboBox1.JSInterface.JSConfig('focusCls', ['myfield-focus']);
    end;

     

     


  6. I made a modification in a situation where accessviolation

    procedure TMainForm.htmlGetFileAjaxEvent(Sender: TComponent; EventName: string;
      Params: TUniStrings);
    var
      aFileName : String;
      aJSONData : String;
      aJsonObj: TJSONObject;
      aFileStream :TFileStream;
      aMemoryStream : TMemoryStream;
      afileType : String;
      aOutputFile : String;
    
    
      function getJsonString(wObj: TJSONObject; aItem: String): String;
      var
        aObjItem : TJSONString;
      begin
        aObjItem := wObj.Get(aItem).JsonValue as TJSONString;
        Result := aObjItem.Value;
      end;
    
      function getJsonStream(wObj: TJSONObject; aItem: String): TMemoryStream;
      var
        aObjItem : TJSONString;
        aBytes : TBytes;
        aString : String;
        i : Integer;
      begin
        aObjItem := wObj.Get(aItem).JsonValue as TJSONString;
        aString := aObjItem.Value;
        i := Pos('base64,', aString);
        if i > 0 then
          aString := Copy(aString, i+7, Length(aString));
    
        aBytes := TNetEncoding.Base64.DecodeStringToBytes(aString);
        Result := TMemoryStream.Create;
        Result.WriteBuffer(aBytes, Length(aBytes));
      end;
    
    begin
      UniImage1.Picture.Bitmap := nil;
      UniMemo1.Clear;
    
      if (EventName = 'selected_file') then
      begin
        aJSONData := Params.Values['file_info'];
        aJsonObj := TJSONObject.ParseJSONValue(aJSONData) as TJSONObject;
        try
    
        If (Not Assigned(aJsonObj)) Or (Not Assigned(aJsonObj.Get('filename'))) Or (Trim(aJsonObj.Get('filename').ToJSON) = Emptystr) Then Begin
         ShowMessage('No file was selected'); 
         Exit;
        End;
    
          aFileName := getJsonString(aJsonObj, 'filename');
          if aFileName > '' then
          begin
            aOutputFile := UniServerModule.StartPath+'UploadFolder\'+ aFileName;
            aFileType  := getJsonString(aJsonObj, 'filetype');
            aMemoryStream := getJsonStream(aJsonObj, 'filedata');
            try
              aMemoryStream.SaveToFile(aOutputFile);
            finally
              aMemoryStream.free;
            end;
    
            if Pos('text', aFileType) > 0 then
            begin
              with TStringList.Create do
              try
                LoadFromFile(aOutputFile);
                UniMemo1.Text := Text;
              finally
                free;
              end
            end
            else if Pos('image', aFileType) > 0 then
            begin
              aFileStream := TFileStream.Create(aOutputFile, fmOpenRead);
              try
                UniImage1.LoadFromStream(aFileStream);
              finally
                aFileStream.Free;
              end;
            end
            else if Pos('pdf', aFileType) > 0 then
             ShowMessage('File is PDF')
            else
             ShowMessage('Filetype is unknown')
          end
          else
            ShowMessage('No file was selected');
        finally
          aJsonObj.Free;
        end;
      end;
    end;

     

    Completing the Topic how to open Simulate automatic Click.

     

  7. 5 hours ago, Sherzod said:

    1. <button id="_customBtn" style="color:blue;font-size:12px;" 

    2. 

    Procedure TMainForm.UniButton1Click(Sender: TObject);
    Begin
      UniSession.AddJS('document.getElementById("_customBtn").click()');
    End;

     

    Wow, I was looking for a way to invoke Frame Click and my colleague did it in a much simpler way.

    Much obliged.

  8.  I looked for it and couldn't find it on the forum, I think it's a simple thing.
     
     based on this topic:
    http://forums.unigui.com/index.php?/topic/24462-detect-cancel-opendialog-in-tunifileuploadbutton/

     and I will use a "UniHTMLFrame" instead of "unifileuploadbutton"

     How do I need to simulate Click?

     UniHTMLFrame1.JSInterface.JSCall('fileInputEl.dom.click', []); // Error
     UniHTMLFrame1.JSInterface.JSCall('dom.click', []); // Error
     UniHTMLFrame1.JSInterface.JSCall('click', []);  // Error
     UniHTMLFrame1.JSInterface.JSCall(UniHTMLFrame1.jsName + 'dom.click', []);  // Error

  9. 49 minutes ago, Norm said:

    Save any data to FileStream

    aFileStream := TFileStream.Create(<filename>, fmOpenReadWrite or fmOpenOrCreate or fmShareDenyWrite);
     try
        with aFileStream do
          Write(AnyData, Sizeof(AnyData));
     finally
        Free;
     end;

     


    what is wrong in this code See attached.

    Procedure TMainForm.htmlGetFileAjaxEvent(Sender: TComponent; EventName: String;
     Params: TUniStrings);
    Var
     aFileName, aXMLData: String;
     aJSONData: String;
     aJsonObj: TJSONObject;
     aFileStream: TFileStream;
    
     Function getJsonString(wObj: TJSONObject; aItem: String): String;
     Var aObjItem: TJSONString;
     Begin
      aObjItem := wObj.Get(aItem).JsonValue As TJSONString;
      Result := aObjItem.Value;
     End;
    
    Begin
     If (EventName = 'selected_file') Then Begin
      aJSONData := Params.Values['file_info'];
    
      aJsonObj := TJSONObject.ParseJSONValue(aJSONData) As TJSONObject;
      Try
       aFileName := getJsonString(aJsonObj, 'filename');
    
       If aFileName > '' Then Begin
        aXMLData := getJsonString(aJsonObj, 'filedata');
    
        aFileStream := TFileStream.Create(aXMLData, fmCreate or fmOpenReadWrite or fmShareDenyWrite);
        Try
         aFileStream.Position := 0;
         UniImage1.Picture.LoadFromStream(aFileStream);
        Finally
         aFileStream.Free;
        End;
    
        ShowMessage('Selected file is: ' + aFileName);
       End
       Else
        ShowMessage('No file was selected')
    
      Finally
       aJsonObj.Free;
      End;
    
     End;
    End;

     

    FileDownloadDemo.7z

  10. 4 minutes ago, Norm said:

    I just noticed a bug you need to fix. You need to free aJsonObj otherwise you'll get access violation when you close the app.

        aJsonObj := TJSONObject.ParseJSONValue(aJSONData) as TJSONObject;
        try
          aFileName := getJsonString(aJsonObj, 'filename');

          UniMemo1.Clear;
          if aFileName > '' then
          begin
            aXMLData := getJsonString(aJsonObj, 'filedata');
            UniMemo1.Text := aXMLData;
            ShowMessage('Selected file is: ' + aFileName);
          end
          else
            ShowMessage('No file was selected')
        finally
          aJsonObj.Free;
        end;

    I'm here banging my head to make it generic for any type of file saving in "AStream: TFileStream"

  11. 6 minutes ago, Norm said:

    To save to file just add :

          with TStringList.Create do
          try
            Text := aXMLData;
            SaveToFile('Invoice.xml');
          finally
            free;
          end;

    Dealing with other file types is more complicated and I'll have a look when I have time.

    So I liked your solution so much that I'm wanting to ditch "TUniFileUploadButton" and use your approach for everything, including images

×
×
  • Create New...