changing image icon with button with text in phreebooks

[mythri]

Hi,

 

I am customising a opensource phreebookerp. I am trying to replace image icons for actions like Save, Edit, Print...etc. Instead of that i want to use buttons. But am not able to do it. Can somebody guide me how exactly i should do it and what is the logic behind it.

Here is the code to (Existing to generate image icon)

function add_icon($name, $params = '', $order = 98) { // adds some common icons, per request
    switch ($name) {
      case 'back':
      case 'previous':   $image = 'actions/go-previous.png';            $text = TEXT_BACK;       break;
      case 'continue':
      case 'next':       $image = 'actions/go-next.png';                $text = TEXT_CONTINUE;   break;
      case 'copy':       $image = 'label1 label1-sm label1-info';       $text = TEXT_COPY;       break;
      case 'edit':       $image = 'actions/edit-find-replace.png';      $text = TEXT_EDIT;       break;
      case 'email':      $image = 'apps/internet-mail.png';             $text = GEN_EMAIL;       break;
      case 'export':     $image = 'actions/format-indent-more.png';     $text = TEXT_EXPORT;     break;
      case 'export_csv': $image = 'mimetypes/x-office-spreadsheet.png'; $text = TEXT_EXPORT_CSV; break;
      case 'finish':     $image = 'actions/document-save.png';          $text = TEXT_FINISH;     break;
      case 'import':     $image = 'actions/format-indent-less.png';     $text = TEXT_IMPORT;     break;
      case 'new':        $image = 'actions/document-new.png';           $text = TEXT_NEW;        break;
      case 'recur':      $image = 'actions/go-jump.png';                $text = TEXT_RECUR;      break;
      case 'rename':     $image = 'label1 label1-sm label1-info';       $text = TEXT_RENAME;     break;
      case 'payment':    $image = 'apps/accessories-calculator.png';    $text = TEXT_PAYMENT;    break;
      case 'ship_all':   $image = 'mimetypes/package-x-generic.png';    $text = TEXT_SHIP_ALL;   break;
      case 'search':     $image = 'actions/system-search.png';          $text = TEXT_SEARCH;     break;
      case 'update':     $image = 'apps/system-software-update.png';    $text = TEXT_UPDATE;     break;
      default:           $image = 'emblems/emblem-important.png';       $text = $name . ' ICON NOT FOUND';
    }
    if ($image) $this->icon_list[$name] = array('show' => true, 'icon' => $image, 'params' => $params, 'text' => $text, 'order' => $order);
}

Can anybody help on this?

[requinix]

Did you try changing $image?

[Jacques1]

If you want an entirely different HTML markup (e. g. classical submit buttons rather than images), the function won't help. You'll have to look up the code where the markup is generated and change that.

[mythri]

requinix :

no i did not try to change it.

 

But i tried doing like this for add_button

function add_button($name, $value, $parameters = '') { // adds some common icons, per request
    switch ($name) {
     case 'back':
     case 'previous': $image = 'Back'; $text = TEXT_BACK; break;
     case 'continue':
     case 'next': $image = 'Continue'; $text = TEXT_CONTINUE; break;
    
    }
    if ($image) $this->button[$name] = array('show' => true, 'icon' => $image, 'params' => $params, 'text' => $text, 'order' => $order);
    
}

Edited January 3, 2017 by mythri

[mythri]

@Jacques1

 

No, not entire thing and also not submit button. its just a <button> and i should give href link. I am not getting how to change, where to start. I am stuck here. Pls guide me

[requinix]

If you want to change the HTML markup of the button/image thing then that isn't the code for it. If all you want to do is change the appearance of the "button" then $image looks like what you need - but it's a path to an image, not "back" or "continue".

 

Maybe you have some screenshots that would help explain what you're trying to do?

[mythri]

In oval shape, those are he icons, instead of that i want to replace text with buttons.

in square shape, i removed image and broken link displaying, like this only i want to display

 

[Jacques1]

So you do want to change the underlying HTML markup.

 

As I already said, this cannot be done with the function you've posted. You have to go to the code or template where the actual markup is generated. You can try searching for the usages of the above function. This should get you closer.

[mac_gyver]

because the toolbar class constructor, add_icon() method, and add_help() method are used throughout the application to define/add items to toolbars and set parameters for the added items (some of the constructor's icon_list properties are being set directly in the application code), you would change the existing relevant toolbar class code, not add new primary methods (and hope that none of the application code is defining it's own icon_list entries, since it's all publicly accessible data.)

 

i would keep all the existing functionality. this will allow the application to be returned to it's current operation and if there are cases where the application code is defining it's own icon_list entries, the application will still work while you are finding and fixing these occurrences. just add a 'use buttons' feature to the existing code, i.e. if you have defined an entry to use a button, it will trigger the new code. i would just add a 'button' field to the icon_list definition. if the button field exists ( isset() ), the logic will run the new code for the button functionality.

 

next, the code already has defined constants that are used for the current image alt='...' parameter. you should use these as your button text so that you are not repeating things in code that have already been defined. presumably, this has been set up to support multiple languages with a language selection menu/configuration.

 

so, in the toolbar class constructor, add_icon(), and add_help() methods, add a 'button'=>true element to any icon_list entry that you want to switch to use a button. in the build_toolbar() method, add a logic test for this button array element. if it's not set, call the existing html_icon() function. if it is set, call a new function that's similar to the html_icon() function code but produces the html that you want for a button.

[mythri]

@mac_gyver

 

Thank you very much. I have added like this

function add_help($index = '', $order = 99) { // adds some common icons, per request
	$this->icon_list['help'] = array(
	  'show'   => true,
	  'button' =>true, 
---

);
  }

and

  function add_button($name, $value, $parameters = '') { // adds some common icons, per request
	switch ($name) {
	  case 'back':
	  case 'previous':   $image = 'Back';            $text = TEXT_BACK;       break;
	  case 'continue':
	  case 'next':       $image = 'actions/go-next.png';                $text = TEXT_CONTINUE;   break;
-----

}
	if ($image) $this->button[$name] = array('show' => true, 'icon' => $image, 'params' => $params, 'text' => $text, 'order' => $order);
	
  }

But i am not getting where and how to add

if(isset())

[mac_gyver]

where the logic test goes is -

 

in the build_toolbar() method, add a logic test for this button array element. if it's not set, call the existing html_icon() function. if it is set, call a new function that's similar to the html_icon() function code but produces the html that you want for a button.

[mythri]

I did like this.

  function build_toolbar($add_search = false, $add_period = false, $cal_props = false) { // build the main toolbar
    global $messageStack;
    $output = '';
    if ($add_search) $output .= $this->add_search();
    if ($add_period) $output .= $this->add_period();
    if ($cal_props)  $output .= $this->add_date($cal_props);
    $output .= '<div id="tb_main_' . $this->id . '" class="ui-state-hover" style="border:0px;">' . "\n";
    // Sort the icons by designated order
    if(isset($this->button[$name])) {
    
    }
    else
    {
        $sort_arr = array();
    foreach($this->icon_list as $uniqid => $row) foreach($row as $key => $value) $sort_arr[$key][$uniqid] = $value;
    array_multisort($sort_arr['order'], SORT_ASC, $this->icon_list);
    foreach ($this->icon_list as $id => $icon) {
      if ($icon['show']) $output .= html_icon($icon['icon'], $icon['text'], $this->icon_size, 'id ="tb_icon_' . $id . '" style="cursor:pointer;" ' . $icon['params']) . "\n";
    }
    }
    $output .= '</div>' . "\n"; // end of the right justified icons
    // display alerts/error messages, if any
    $output .= $messageStack->output();
    return $output;
  }

not getting how to call add_button (my function) here

if(isset($this->button[$name])) {
    
    }

My add_button function

function add_button($name, $value, $parameters = '') { // adds some common icons, per request
	switch ($name) {
	  case 'back':
	  case 'previous':   $image = '<a href="#" id="'.$name.'" class="btn btn-blue" '.$parameters.'>BACK</a>';        break;
	  case 'continue':
	  case 'next':       $image = '<a href="#" id="'.$name.'" class="btn btn-blue" '.$parameters.'>NEXT</a>';        break;
	 
	}
	if ($image) $this->button[$name] = array('show' => true, 'button' => $image, 'params' => $params);
	
  }

Can you please help me in this?