Download & Extend

Switch form auto-submit

Project:Switchtheme
Version:7.x-1.x-dev
Component:Code
Category:feature request
Priority:normal
Assigned:Unassigned
Status:needs work

Issue Summary

Maybe as an option, but I like being able to switch theme from the selection without hitting the submit button.

You can add this to your switchtheme.info file:

scripts[] = switchtheme.js

I've attached the switchtheme.js (rename it from switchtheme.txt) javascript code I am using.

AttachmentSize
switchtheme.txt257 bytes

Comments

#1

This also works really greate for me.
An additional question would be, if the js-code could be use to make a list out of that dropdown-menu? (Or is that not in the scope of a js-file?)

#2

I don't understand the question. Why would you need a javascript list when it's provided in html? Please explain how you would use this.

#3

I am a beginner only, so thats maybe the reason why you dont understand the question. I just dont know much about all the entities in html/js/php...

I had the idea to theme those "fields" of that dropdown, so each single name of a theme, with css. Is this possible?

#4

You'd like a simple html list [ul] that you can style instead of a dropdown [select]? Open another issue with that feature request, see what the maintainer thinks.

#5

By everything I read so far, its more or less impossible to style that dropdown menu the way I would want it to be. Instead of having the switch form as dropdown, I would like to have the switch form as a button for every option on that dropdown list. So that I can style the buttons in a way of adding a "thumbnail" or just a black and a white icon instead of the buttons.
Since the maintainer of this module doesn't have much time as you most likely also experienced, we have to that on our own. It would be kind if you or anybody could help with this issue.
From what I read so far this issue has to be dealt with php? I guess its easy to change that form when knowing php. So what I do now is learning php and solving it, instead of being arrogant on the internet.

#6

Marked #265169: Auto-Switch, possible? as a duplicate.

#7

Title:Switch form auto-submit» Switch form auto-submit with two images and one click

If you want an another solution, you can use a better styled one (if you are going to use only two themes on your site). For example, if you want a normal site, and an accessible one, for disabled users, and thatswhy you can not use a drop-down list. Two images will serve us better in this situation.

First, modify the above linked script a little bit, put it in a .js file, and upload to your theme directory (or it's script subdirectory):

(function ($) {
  Drupal.behaviors.switchtheme = {
    attach: function (context) { //attach the click function on your image both the selection AND the click on the submit function
      $('#YOUR_ACCESSIBLE_IMAGE_ID', context).click(function () { //a unique ID, that allow us to hide the image, after the switch
        $('#edit-theme').val('YOUR_ACCESSIBLE_THEME_NAME'); //take care of uppercase, space and other special characters
        $('#switchtheme-switch-form').submit();
      });
      $('#YOUR_NORMAL_IMAGE_ID', context).click(function () { //a unique ID, that allow us to hide the accessible image, after we are switching back to the normal theme
        $('#edit-theme').val('YOUR_NORMAL_THEME_NAME'); //take care of uppercase, space and other characters
        $('#switchtheme-switch-form').submit();
      });
      $('#edit-theme').hide(); //hiding the drop-down box. put an // before the $ character, if you want to test it and see the drop-down box
      $('#switchtheme-submit').hide(); //hiding the submit button
    }
  };
})(jQuery);

Then call the script, somehow insert it into your D7 header. For example you can call it in your theme's function.php. Solution #1 (insert the below row, as it is described here):

drupal_add_js(drupal_get_path('theme', 'YOUR_THEME_NAME') . '/YOUR_SCRIPT_FOLDER_(IF_YOU_USE_ONE)/YOUR_SCRIPT_NAME.js');

Solution #2 (you can call it from your switchtheme modul as well; if you use this, you don't need to upload the .js file into your theme folder):

Insert scripts[] = YOUR_SCRIPT_NAME.js into your switchtheme module's switchtheme.info file, and upload your javascript next to it.

Now you need two images, then to activate your switchtheme modul and create another block for your images as well, like this (or you can put the below code into any other block too:

<img id="YOUR_ACCESIBLE_IMAGE_ID" href="#" src="ACCESSIBLE_IMAGE_PATH" alt="SOME_INFORMATIVE_TEXT" title="SOME_INFORMATIVE_TEXT" /><img id="NORMAL_IMAGE_ID" href="#" src="NORMAL_IMAGE_PATH" alt="SOME_INFORMATIVE_TEXT" title="SOME_INFORMATIVE_TEXT" />

And after all, insert the below lines into your themes' .css (mostly style.css, local.css, et cetera). First goes into your normal theme's .ccs, the other into the accessible theme's .css. It will hide the "active" image (~hopefully the good one:D) after the switch.

#YOUR_NORMAL_IMAGE_ID {
display:none;
}

#YOUR_ACCESSIBLE_IMAGE_ID {
display:none;
}

Don't forget to allow for anonymous users to use the switching method!

AttachmentSize
switchtheme.txt 551 bytes

#8

Title:Switch form auto-submit with two images and one click» Switch form auto-submit

Setting the issue title back.