[Contribution] iOSC - mobile version of OSC on your iPhone

MountainMan · February 4, 2014

A little confused on the payment modules. On the osc contribution page for iOSC, it says for ver 6.0 that:

- Support for all payment modules of standard OsC (catalog/ext/modules/payment/)

And was news to me...because I thought the ones OsC uses are in

catalog/modules/includes/payment/

And in fact I have modified those and know that they are the ones being used.

I also notice that the same modules in

catalog/ext/modules/payment/

are also in

catalog/mobile/ext/modules/payment/

Kind of lost here on what's what...

MountainMan · February 4, 2014

Back to the issue of the jquery mobile CSS...I need to modify the look of the select-option-select dropdowns. Any clues how to do this without changing the existing ones would be appreciated.

greasemonkey · February 4, 2014

@@raiwa

adding your 404 support to the package would be great. You can upload it yourself or send me the files and instructions and I'll add it to the next update. You got my mail?

I'll email you after I have made some basic instructions and tested...

♥raiwa · February 4, 2014

A little confused on the payment modules. On the osc contribution page for iOSC, it says for ver 6.0 that:

- Support for all payment modules of standard OsC (catalog/ext/modules/payment/)

And was news to me...because I thought the ones OsC uses are in

catalog/modules/includes/payment/

And in fact I have modified those and know that they are the ones being used.

I also notice that the same modules in

catalog/ext/modules/payment/

are also in

catalog/mobile/ext/modules/payment/

Kind of lost here on what's what...

@@MountainMan, some payment modules need some modifications to work with mobile. So the ones in mobile/ext.. are modified and will be used in mobile, the modules in catalog/ext are the originals and used in classic. Just use the installation instructions in the newest version 7.3.1.

February 12, 2014

does it work with ...?

Discount Coupon Codes

http://addons.oscommerce.com/info/4269

------

after search looks like yes... ill test it

http://addons.oscommerce.com/info/8504

Edited February 12, 2014 by rabon33

♥raiwa · February 13, 2014

does it work with ...?

Discount Coupon Codes

http://addons.oscommerce.com/info/4269

------

after search looks like yes... ill test it

http://addons.oscommerce.com/info/8504

Hello Jason @@rabon33,

http://addons.oscommerce.com/info/8504

is an obsolete support for iosc 3

To use discount coupon add-on:

http://addons.oscommerce.com/info/4269

with iosc mobile 7.3.1 you need to do your own integration.

Just try to apply all modifications of the catalog page files to the mobile page files.

See also the Add-On Support.doc

Kind regards

Rainer

Papanco · February 13, 2014

help me: I installed OPI: Another OSC Product Image Module (http://addons.oscommerce.com/info/8139) and followed the instructions of the support, but the mobile site does not display additional product images!

♥raiwa · February 13, 2014

help me: I installed OPI: Another OSC Product Image Module (http://addons.oscommerce.com/info/8139) and followed the instructions of the support, but the mobile site does not display additional product images!

Hello @@Papanco,

Yes, this support needs update, will do it asap.

You need to modify the section for the additional images too:

in mobile/product_info.php line 185:

find:

  $pi_entry .= '" target="_blank">' . tep_image(DIR_WS_IMAGES . $pi['image'], $product_info['products_name'], MOBILE_IMAGE_WIDTH, MOBILE_IMAGE_HEIGHT) . '</a>';

change to:

  $pi_entry .= '" target="_blank">' . tep_image(DIR_WS_IMAGES . 'thumbs/def/display/' . $pi['image'], $product_info['products_name'], MOBILE_IMAGE_WIDTH, MOBILE_IMAGE_HEIGHT) . '</a>';

Thanks for the report

Rainer

raiwa · February 18, 2014

is anyway to make the logo responsive?

i fpund something like this to be added to all css on mobile folder

logo.resp
{
position: absolute;
max-width: 80%;
top: 10%;
left: 10%;
border-radius: 3px;
box-shadow: 0 3px 6px rgba(0,0,0,0.9);
}
logo.resp:empty
{
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
@[member='media'] screen and (orientation: portrait) {
logo.resp {
 max-width: 90%;
}
}
@[member='media'] screen and (orientation: landscape) {
logo.resp {
 max-height: 90%;
}

could be on mobile header.....

<div id="headerLogo" class="logo.resp" ><a href="' . tep_mobile_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_HTTP_MOBILE . DIR_MOBILE_IMAGES . 'store_logo.png', STORE_NAME, 0,30) . '</a></div>

??

Edited February 18, 2014 by rabon33

rafhun · February 19, 2014

Hello Rainer,

I'm still working on my mobile store… :) Now I have found that I would like to see which options are chosen in the options screen… I did not edit this function away by accident, did I?

Anyways I have added this code around l29 of the options.php file (in the mobile directory):

while (list($key, $value) = each($lng->catalog_languages)) {
 if ($language == $value['directory']) {
  $icon = 'check';
 } else {
  $icon = 'plus';
 }
 echo tep_button_jquery(tep_image(DIR_WS_LANGUAGES .  $value['directory'] . '/images/' . $value['image'], $value['name']) .' '. $value['name'] , $path . $key , 'a' , 'button' , 'data-icon="'.$icon.'" data-iconpos="right"' );
   }

This works beautifully and gives me a check for the language chosen and pluses for the other ones.

Now I would like to add this function to the currencies too… Do you know the currency variable from the session variable and how to compare it to the key, value pair from the currencies array in similar fashion as I did with the languages?

I do not plan to use the theme selector, but do you see opportunities there too? Just wondering :)

Thanks for your reply!

Raphael

♥raiwa · February 20, 2014

Hello Rainer,

I'm still working on my mobile store… :) Now I have found that I would like to see which options are chosen in the options screen… I did not edit this function away by accident, did I?

Anyways I have added this code around l29 of the options.php file (in the mobile directory):
while (list($key, $value) = each($lng->catalog_languages)) {
 if ($language == $value['directory']) {
 $icon = 'check';
 } else {
 $icon = 'plus';
 }
 echo tep_button_jquery(tep_image(DIR_WS_LANGUAGES . $value['directory'] . '/images/' . $value['image'], $value['name']) .' '. $value['name'] , $path . $key , 'a' , 'button' , 'data-icon="'.$icon.'" data-iconpos="right"' );
}
This works beautifully and gives me a check for the language chosen and pluses for the other ones.

Now I would like to add this function to the currencies too… Do you know the currency variable from the session variable and how to compare it to the key, value pair from the currencies array in similar fashion as I did with the languages?

I do not plan to use the theme selector, but do you see opportunities there too? Just wondering :)

Thanks for your reply!

Raphael

Hello Raphael,@@rafhun,

Very good idea, will be added to the next update if you agree.

Here the snippet for the currencies:

 while (list($key, $value) = each($currencies->currencies)) {
  $currencies_array[] = array('id' => $key, 'text' => $value['title']);
  if ($currency == $key) {
   $icon = 'check';
  } else {
   $icon = 'plus';
  }
  echo tep_button_jquery($value['title'], $path . $key , 'a' , 'button' , 'data-icon="'.$icon.'" data-iconpos="right" ' );
 }

and here for the styles:

   foreach ( $css as $value ) {
 if (CSS == $value) {
  $icon = 'check';
 } else {
  $icon = 'plus';
 }
 echo  tep_button_jquery( $value , tep_mobile_link(FILENAME_DEFAULT,'style='.$value, 'NONSSL') , 'a' , 'button' , 'data-icon="'.$icon.'" rel="external" data-iconpos="right" ' );
}

Thank you and kind regards

Rainer

♥raiwa · February 20, 2014

Hello Raphael @@rafhun,

We could also change the data-theme for the selected item:

 while (list($key, $value) = each($currencies->currencies)) {
  $currencies_array[] = array('id' => $key, 'text' => $value['title']);
  if ($currency == $key) {
  $icon = 'check';
  $datatheme = 'b';
 } else {
  $icon = 'plus';
  $datatheme = 'a';
 }
 echo tep_button_jquery($value['title'], $path . $key , $datatheme , 'button' , 'data-icon="'.$icon.'" data-iconpos="right" ' );
 }

What do you think?

regards

Rainer

rafhun · February 21, 2014

Hello Raphael @@rafhun,

We could also change the data-theme for the selected item:

 while (list($key, $value) = each($currencies->currencies)) {
 $currencies_array[] = array('id' => $key, 'text' => $value['title']);
 if ($currency == $key) {
 $icon = 'check';
 $datatheme = 'b';
 } else {
 $icon = 'plus';
 $datatheme = 'a';
 }
 echo tep_button_jquery($value['title'], $path . $key , $datatheme , 'button' , 'data-icon="'.$icon.'" data-iconpos="right" ' );
 }

What do you think?

regards

Rainer

Yeah sure, makes it even more visible :) Please feel free to add it to the next update!

Since many people might have very similar datathemes it's also a good idea to still change the icon, so great addition!

Thanks for the quick reply!

rafhun · February 21, 2014

One other thing I just added is a basic sort function for the catalog_mb product listing. It so far is just a very basic thing since I at this time only need to sort by one variable. But I think it would be easy to add more buttons and set different get variables. So the basic structure would be:

In catalog_mb.php find

$listing_sql .= " order by pd.products_name";

and replace it with:

if (isset($HTTP_GET_VARS['sort'])) {
 $listing_sql .= " order by p.products_quantity desc";
} else {
$listing_sql .= " order by pd.products_name";
}

Here you can choose the row you want to sort by.

Then go to includes/modules/products.php and find

<div id="results">
<?php
echo $listing_split->display_count(TEXT_DISPLAY_NUMBER_OF_PRODUCTS);
echo '<div data-role="controlgroup" data-type="horizontal" data-mini="true">' . $listing_split->display_links_mobile(MAX_DISPLAY_PAGE_LINKS, tep_get_all_get_params(array('page', 'info', 'x', 'y'))) . '</div>';

Add directly after:

if (!isset($HTTP_GET_VARS['sort'])){
$sort_url = htmlspecialchars($_SERVER['REQUEST_URI']);
$sort_url .= ((strpos($sort_url,'?') > 0) ? '&sort=1' : '?sort=1');
echo '<a rel="external" data-theme="a" data-role="button" href="' . $sort_url . '">' . TEXT_SORT . '</a>';
} else {
$sort_url = htmlspecialchars($_SERVER['REQUEST_URI']);
$sort_url = ((strpos($sort_url,'?') > 0) ? str_replace('&sort=1', '', $sort_url) : str_replace('?sort=1', '', $sort_url));
echo '<a rel="external" data-theme="a" data-role="button" href="' . $sort_url . '">' . TEXT_SORT_AL . '</a>';
}

This adds the button to switch between the two sorting options… I think you could add several more buttons here if you want to sort by more things (e.g. price...) to which you can assign specific get variables…

Now all you that is left to do is to define the TEXT_SORT and TEXT_SORT_AL in the respective language files in includes/languages.

Hopefully this helps a little :)

♥raiwa · February 25, 2014

is anyway to make the logo responsive?

i fpund something like this to be added to all css on mobile folder

logo.resp
{
position: absolute;
max-width: 80%;
top: 10%;
left: 10%;
border-radius: 3px;
box-shadow: 0 3px 6px rgba(0,0,0,0.9);
}
logo.resp:empty
{
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
@[member='media'] screen and (orientation: portrait) {
logo.resp {
 max-width: 90%;
}
}
@[member='media'] screen and (orientation: landscape) {
logo.resp {
 max-height: 90%;
}

could be on mobile header.....

<div id="headerLogo" class="logo.resp" ><a href="' . tep_mobile_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_HTTP_MOBILE . DIR_MOBILE_IMAGES . 'store_logo.png', STORE_NAME, 0,30) . '</a></div>

??

Hello Jason @@rabon33,

Had a time to have look on this now and found maybe the easiest way would be to add to mobile_stylesheet.css under:

#headerLogo {
text-transform:uppercase;
text-align:center;
line-height:11px;
}

this:

#headerLogo img
{
max-width: 100%;
}

no need to add anything in the header

kind regards

Rainer

Edited February 25, 2014 by raiwa

♥raiwa · February 25, 2014

Hello Jason @@rabon33,

Had a time to have look on this now and found maybe the easiest way would be to add to mobile_stylesheet.css under:
#headerLogo {
text-transform:uppercase;
text-align:center;
line-height:11px;
}
this:
#headerLogo img
{
max-width: 100%;
}
no need to add anything in the header

kind regards

Rainer

This doesn't work correct. Do this:

In mobile/includes/header.php:

<div id="headerLogo"><a href="' . tep_mobile_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_HTTP_MOBILE . DIR_MOBILE_IMAGES . 'store_logo.png', STORE_NAME, 'auto', 'auto', 'style="max-width:100%; max-height:100%"') . '</a></div>

and remove in the mobile stylesheet:

#headerLogo img
{
max-width: 100%;
}

regards

Rainer

February 27, 2014

@@raiwa the responsive store logo, works perfect thanks

herbsandhelpers · March 8, 2014

Advanced Search Result

Hello Rainer,

Installation going very smoothly but I can't seem to get SPPC to work with Advanced Search Result. It shows all the products instead of only those related to customer group. The only change I have is the recommended one:

// BOF Separate Price Per Customer
// global variable (session): $sppc_customers_group_id -> local variable $customer_group_id
if(!tep_session_is_registered('sppc_customer_group_id')) {$customer_group_id = '0';
} else {
$customer_group_id = $sppc_customer_group_id;
}
// EOF SPPC
 $listing_sql = $select_str . $from_str . $where_str . $order_str;

I'm not sure what else to do can you guide me?

Best wishes,

Lorraine

♥raiwa · March 8, 2014

Advanced Search Result

Hello Rainer,

Installation going very smoothly but I can't seem to get SPPC to work with Advanced Search Result. It shows all the products instead of only those related to customer group. The only change I have is the recommended one:
// BOF Separate Price Per Customer
// global variable (session): $sppc_customers_group_id -> local variable $customer_group_id
if(!tep_session_is_registered('sppc_customer_group_id')) {$customer_group_id = '0';
} else {
$customer_group_id = $sppc_customer_group_id;
}
// EOF SPPC
$listing_sql = $select_str . $from_str . $where_str . $order_str;
I'm not sure what else to do can you guide me?

Best wishes,

Lorraine

Hello Lorraine @@herbsandhelpers,

SPPC support is included in the support package. I do not use SPPC myself but there I found this additional modification for the sql query:

2. FIND:

$listing_sql .= " order by pd.products_name";

REPLACE with:

$listing_sql .= " and s.customers_group_id = " . (int)$customer_group_id . " order by pd.products_name"; // SPPC

This should do it.

Kind regards

Rainer

herbsandhelpers · March 8, 2014

Hello Rainer,

The problem is that there is no at all in the advanced search results file and I don't know to put the code. My attempts have failed ...

$listing_sql .= " order by pd.products_name";

I was trying to something with this:

$order_str = ' order by pd.products_name';

but no luck.

Lorraine

herbsandhelpers · March 8, 2014

Errrr I may have accidentally fixed it!

I changed

//$listing_sql = $select_str . $from_str . $where_str . $order_str;

to

$listing_sql .= $select_str . $from_str . $where_str . " and s.customers_group_id = " . (int)$customer_group_id . " order by pd.products_name"; // SPPC

It seems to work! I hope this also helps someone else too.

Best wishes,

Lorraine

♥raiwa · March 9, 2014

Errrr I may have accidentally fixed it!

I changed
//$listing_sql = $select_str . $from_str . $where_str . $order_str;
to
$listing_sql .= $select_str . $from_str . $where_str . " and s.customers_group_id = " . (int)$customer_group_id . " order by pd.products_name"; // SPPC
It seems to work! I hope this also helps someone else too.

Best wishes,

Lorraine

Hello Lorraine@@herbsandhelpers,

Oh ok yes sure, it's different coding in advanced_search_result.

Great, the more correct coding would be ($order_str should stay at the end):

 $where_str .= " and s.customers_group_id = " . (int)$customer_group_id; // SPPC
 $listing_sql = $select_str . $from_str . $where_str . $order_str;

The support instructions are not complete/exact. Probably there should be SPPC code added also to shopping_cart, checkout_confirmation and checkout_process at least.

You should take the original SPPC install instructions and apply all changes which affect the catalog site to the correspondent mobile files.

If you get it to work all correct it would be phantastic if you could update/correct/complete the support instructions.

You can also send me the instructions and I'll add them to the support package. Just contact by private message for my mail. I'm preparing an update right now.

regards

Rainer

herbsandhelpers · March 9, 2014

Thanks Rainer,

Yes the new mobile shop is a wonder. The only problem I've got again is SPPC so I'll follow your instructions and see if it will work.

Thanks again,

Lorraine

papalevies · March 11, 2014

1.In "mobile/includes/classes/mobile_redirect.php" line 60 is:

if(strpos('/' . $_SERVER['SCRIPT_NAME'],$this->mobileDir . $this->mobileFile) > 0)

There is no mobileFile variable in class mobileRedirect

2.In "includes/modules/header_tags/ht_alternate.php" line 48 is:

if (isset($mobile_url) && file_exists(DIR_FS_MOBILE . basename($PHP_SELF))) {

However $PHP_SELF is only defined in the function StripSessionID() but not in execute(). As a result, the variable is undefined

Edited March 11, 2014 by papalevies

papalevies · March 11, 2014

1.In "mobile/includes/classes/mobile_redirect.php" line 60 is:
if(strpos('/' . $_SERVER['SCRIPT_NAME'],$this->mobileDir . $this->mobileFile) > 0)
There is no mobileFile variable in class mobileRedirect

2.In "includes/modules/header_tags/ht_alternate.php" line 48 is:
if (isset($mobile_url) && file_exists(DIR_FS_MOBILE . basename($PHP_SELF))) {
However $PHP_SELF is only defined in the function StripSessionID() but not in execute(). As a result, the variable is undefined

Oops... actually it isn't defined at all. MOBILE_SESSION is undefined too

[Contribution] iOSC - mobile version of OSC on your iPhone

Recommended Posts

Link to comment

Share on other sites

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Popular Posts

raiwa

steve_s

Guest

Posted Images

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Guest

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Guest

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Guest

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation