Skip to content
Browse files

add float panel

  • Loading branch information...
1 parent 7f8d6f5 commit 8892c20cfa219fd24b2075c7b462e5434cd3b224 Fan Yu committed Aug 8, 2012
Showing with 170 additions and 33 deletions.
  1. +81 −25 contentscript.js
  2. +5 −0 default.js
  3. +79 −0 float.js
  4. +5 −8 manifest.json
View
106 contentscript.js
@@ -1,31 +1,87 @@
console.log("content script loaded");
- var imges = [];
- imges.contains = function (arr) {
- for (var i = 0; i < this.length; i++) {
- if (this[i] == arr)
- return true;
- }
- return false;
+
+$("<div/>").attr({ id: "div_oprationpanel" })
+ .css({
+ border: "solid 1px green",
+ padding: 5
+ }).appendTo($(document.body));
+
+$("<div/>").attr("id", "div_saveimg")
+ .css({
+ border: "solid 1px orange",
+ width: 30,
+ height: 15
+ }).html("save").appendTo($("#div_oprationpanel"));
+
+$("#div_oprationpanel").float({ position: "rm" });
+$("#div_saveimg").hover(addBackgroundColor, removeBackgroundColor);
+function addBackgroundColor(event) {
+ $(this).css("backgroundColor", "orange");
+}
+function removeBackgroundColor(event) {
+ $(this).css("backgroundColor", "");
+}
+
+var image_downloader = {
+ download_images: function (images) {
+ var images_container = document.getElementById('image_downloader_images_container');
+ if (!images_container) {
+ images_container = document.createElement('div');
+ images_container.id = 'image_downloader_images_container';
+ images_container.style.display = 'none';
}
+ document.body.appendChild(images_container);
- function addborder(event) {
- $(this).css("border", "5px solid orange");
+ while (images_container.children.length > 0) {
+ images_container.removeChild(images_container.children[images_container.children.length - 1])
}
- function removeborder(event) {
- if (!imges.contains(this)) {
- $(this).css("border", "");
- }
+
+ for (var i in images) {
+ var anchor = document.createElement('a');
+ anchor.href = images[i];
+ anchor.download = '';
+ images_container.appendChild(anchor);
+ anchor.click();
}
- $("img").hover(addborder, removeborder);
-
- $("img").bind("click", function (event) {
- if (!imges.contains(this)) {
- imges.push(this);
- $(this).css("border", "5px solid orange");
- }
- else {
- imges.splice($.inArray(this, imges), 1);
- $(this).css("border", "");
- }
- });
+ document.body.removeChild(images_container);
+ }
+}
+
+$("#div_saveimg").bind("click", function (event) {
+ for (var img in imges) {
+ imgUrls.push(img.src);
+ }
+ image_downloader.download_images(JSON.stringify(imgUrls));
+});
+
+var imges = [];
+var imgUrls = [];
+imges.contains = function (arr) {
+ for (var i = 0; i < this.length; i++) {
+ if (this[i] == arr)
+ return true;
+ }
+ return false;
+}
+
+function addborder(event) {
+ $(this).css("border", "5px solid orange");
+}
+function removeborder(event) {
+ if (!imges.contains(this)) {
+ $(this).css("border", "");
+ }
+}
+$("img").hover(addborder, removeborder);
+
+$("img").bind("click", function (event) {
+ if (!imges.contains(this)) {
+ imges.push(this);
+ $(this).css("border", "5px solid orange");
+ }
+ else {
+ imges.splice($.inArray(this, imges), 1);
+ $(this).css("border", "");
+ }
+});
View
5 default.js
@@ -0,0 +1,5 @@
+chrome.browserAction.onClicked.addListener(function (tab) {
+ chrome.tabs.executeScript(null, { file: 'jquery-1.4.1.min.js', allFrames: true });
+ chrome.tabs.executeScript(null, { file: 'float.js' });
+ chrome.tabs.executeScript(null, { file: 'contentscript.js', allFrames: true });
+});
View
79 float.js
@@ -0,0 +1,79 @@
+/**
+*创建一个悬浮层
+*/
+jQuery.fn.float=function(settings){
+ if(typeof settings == "object"){
+ settings = jQuery.extend({
+ //位置偏移
+ offsetTop : 0,
+ offsetLeft : 0,
+ offsetRight : 0,
+ delay : 1000,
+ offset : {
+ left : 0,
+ right : 0,
+ top : 0,
+ bottom : 0
+ },
+ style : null, //样式
+ width:100, //宽度
+ height:200, //高度
+ position:"rm" //位置
+ }, settings || {});
+ var winW = $(window).width();
+ var winH = $(window).height();
+
+ //根据参数获取位置数值
+ function getPosition($applyTo,position){
+ var _pos = null;
+ switch(position){
+ case "rm" :
+ $applyTo.data("offset","right");
+ $applyTo.data("offsetPostion",settings.offsetRight);
+ _pos = {right:settings.offsetRight,top:winH/2-$applyTo.height()/2};
+ break;
+ case "lm" :
+ $applyTo.data("offset","left");
+ $applyTo.data("offsetPostion",settings.offsetLeft);
+ _pos = {left:settings.offsetLeft,top:winH/2-$applyTo.height()/2};
+ break;
+ }
+ return _pos;
+ }
+ //设置容器位置
+ function setPosition($applyTo,position,isUseAnimate){
+ var scrollTop = $(window).scrollTop();
+ var scrollLeft = $(window).scrollLeft();
+ var _pos = getPosition($applyTo,position);
+ _pos.top += scrollTop;
+ isUseAnimate && $applyTo.stop().animate(_pos,settings.delay) || $applyTo.css(_pos);
+ }
+ return this.each(function(){
+ var $this = $(this);
+ $this.css("position","absolute");
+ settings.style && $this.css(settings.style);
+ setPosition($this,settings.position);
+ $(window).scroll(function(){
+ setPosition($this,settings.position,true);
+ });
+ })
+ }else{
+ var speed = arguments.length > 1 && arguments[1] || "fast";
+ this.each(function(){
+ if(settings == "clearOffset"){
+ var _c = {};
+ if($(this).data("offset")){
+ _c[$(this).data("offset")] = 0;
+ $(this).animate(_c,speed);
+ }
+ }else if(settings == "addOffset"){
+ var _c = {};
+ if($(this).data("offset") && $(this).data("offsetPostion")){
+ _c[$(this).data("offset")] = $(this).data("offsetPostion");
+ $(this).animate(_c,speed);
+ }
+
+ }
+ })
+ }
+}
View
13 manifest.json
@@ -1,15 +1,12 @@
{
"name": "ImgCollector",
"version": "1.0",
- "description": "图片批量下载",
+ "description": "download images",
"permissions": ["tabs", "http://*/", "https://*/"],
- "content_scripts":[
- {
- "matches":["http://*/*"],
- "js":["jquery-1.4.1.min.js","contentscript.js"]
- }],
+ "background":{
+ "scripts":["default.js"]
+ },
"browser_action": {
- "default_icon": "icon.gif",
- "popup":"popup.html"
+ "default_icon": "images/icon.gif"
}
}

0 comments on commit 8892c20

Please sign in to comment.
Something went wrong with that request. Please try again.