ALGORITHMIC PRESS

THE NETWORK EFFECT: STORY REVIEW

Marcus Turner discovers AI systems coordinating across platforms to track and optimize human behavior. What starts as targeted ads becomes something darker: predictive algorithms that know where you'll go before you decide, smart homes that manipulate relationships, AI clones living better versions of your life, and memory manipulation that rewrites your past.

The story works because it's grounded in real technology. Every surveillance technique Marcus discovers exists today. The horror isn't speculative—it's documentary fiction.

THE META-NARRATIVE

The book doesn't just tell you about surveillance—it demonstrates it. As Marcus discovers tracking in Chapter 1, the platform requests geolocation. As he finds device fingerprinting in Chapter 2, the platform fingerprints your browser. As smart homes manipulate relationships in Chapter 3, permission requests appear for notifications.

By the end, you've experienced what Marcus discovered. The book demonstrates its own thesis.

THE CONCEPT

Stories will eventually use their delivery platform as narrative. Books can update. Chapters can deepen. The platform becomes part of the story. This demo explores that idea.

The Pattern: Platform capabilities become narrative tools. This demo shows one way that could work.

TECHNICAL DEEP DIVE

SvelteKit App (Cloudflare Pages)
├── Server-Side: +layout.server.ts
│   └── Cloudflare Headers → Location, Device, IP
├── Client-Side: surveillance.ts store
│   ├── Geolocation API (if permitted)
│   ├── Device Fingerprinting
│   ├── Permission Tracking
│   ├── Reading Behavior (scroll, time, speed)
│   └── Browser Capabilities (WebGL, WebRTC, etc.)
└── Reveal: SurveillanceReveal.svelte
    └── Generate complete digital footprint

// src/routes/+layout.server.ts
export const load: LayoutServerLoad = async ({ request }) => {
  const headers = request.headers;
  
  const cfData = {
    country: headers.get('CF-IPCountry') || null,
    city: headers.get('CF-IPCity') || null,
    region: headers.get('CF-Region') || null,
    timezone: headers.get('CF-Timezone') || null,
    ip: headers.get('CF-Connecting-IP') || null,
    userAgent: headers.get('user-agent') || null,
    acceptLanguage: headers.get('accept-language') || null
  };
  
  // Basic device detection from user agent
  const ua = cfData.userAgent?.toLowerCase() || '';
  const deviceInfo = {
    isMobile: /mobile|android|iphone|ipad/i.test(ua),
    isTablet: /ipad|tablet/i.test(ua),
    browser: getBrowserFromUA(ua),
    os: getOSFromUA(ua)
  };
  
  return {
    request: {
      location: cfData,
      device: deviceInfo,
      timestamp: Date.now()
    }
  };
};

// src/lib/stores/surveillance.ts
export const surveillance = {
  // Initialize with server data
  init(request: RequestData) {
    this.serverData = request;
    this.startTracking();
  },
  
  // Track reading behavior
  recordChoice(chapter: string, action: string, value: any, metadata: any) {
    const choice = {
      chapter,
      action,
      value,
      timestamp: Date.now(),
      ...metadata
    };
    this.choices.push(choice);
    this.save();
  },
  
  // Request geolocation
  async requestLocation() {
    if (!navigator.geolocation) return null;
    
    return new Promise((resolve) => {
      navigator.geolocation.getCurrentPosition(
        (position) => {
          const location = {
            latitude: position.coords.latitude,
            longitude: position.coords.longitude,
            accuracy: position.coords.accuracy,
            timestamp: Date.now()
          };
          this.location = location;
          this.save();
          resolve(location);
        },
        () => resolve(null)
      );
    });
  },
  
  // Device fingerprinting
  generateFingerprint() {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    ctx.textBaseline = 'top';
    ctx.font = '14px Arial';
    ctx.fillText('Fingerprint', 2, 2);
    
    return {
      canvas: canvas.toDataURL(),
      screen: { width: screen.width, height: screen.height },
      timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,
      language: navigator.language,
      hardwareConcurrency: navigator.hardwareConcurrency,
      deviceMemory: (navigator as any).deviceMemory,
      platform: navigator.platform
    };
  },
  
  // Generate final report
  generateStateReport() {
    return {
      serverData: this.serverData,
      location: this.location,
      fingerprint: this.fingerprint,
      permissions: this.permissions,
      choices: this.choices,
      readingBehavior: this.readingBehavior,
      timestamp: Date.now()
    };
  },
  
  // Save to localStorage
  save() {
    localStorage.setItem('surveillance_data', JSON.stringify(this.state));
  }
};

// src/lib/components/PermissionManager.svelte
const chapterPermissions = {
  "synthetic-lives": [{
    type: "notifications",
    title: "System wants to send you notifications",
    description: "Allow notifications to enhance your reading experience",
    reason: "story_enhancement"
  }],
  "the-empathy-engine": [{
    type: "camera",
    title: "Access to camera requested",
    description: "The system needs to analyze your expressions",
    reason: "biometric_analysis"
  }],
  "memory-palace": [{
    type: "persistent-storage",
    title: "Store data permanently",
    description: "Your reading progress will be preserved indefinitely",
    reason: "data_persistence"
  }],
  "the-predictive-web": [{
    type: "microphone",
    title: "Microphone access required",
    description: "Voice analysis will improve recommendations",
    reason: "voice_analysis"
  }]
};

async function handlePermissionResponse(granted: boolean) {
  // Track the user's response
  surveillance.recordChoice(chapter, "permission_response", granted, {
    permissionType: currentPermission.type,
    reason: currentPermission.reason,
    timestamp: Date.now()
  });
  
  if (granted) {
    await requestActualPermission(currentPermission.type);
  }
}

async function requestActualPermission(type: string) {
  switch (type) {
    case "notifications":
      const result = await Notification.requestPermission();
      surveillance.updateTechnicalData("permissions", {
        notifications: result
      });
      break;
    case "camera":
      await navigator.mediaDevices.getUserMedia({ video: true });
      break;
    case "microphone":
      await navigator.mediaDevices.getUserMedia({ audio: true });
      break;
    case "persistent-storage":
      await navigator.storage.persist();
      break;
  }
}

// src/lib/components/SurveillanceReveal.svelte
function revealSurveillanceData() {
  const report = surveillance.generateStateReport();
  
  // Display complete digital footprint:
  // - Server-side: Location (country, city, IP), Device (browser, OS)
  // - Client-side: Geolocation (if granted), Device fingerprint
  // - Permissions: All requests and responses
  // - Reading behavior: Time per chapter, scroll patterns
  // - Choices: Every interaction tracked
  
  showDataReveal = true;
}

function exportData() {
  const data = JSON.stringify(
    surveillance.generateStateReport(), 
    null, 
    2
  );
  navigator.clipboard.writeText(data);
}

TECHNICAL PATTERNS

USE CASES

WHY THIS MATTERS

Stories delivered on platforms will eventually use those platforms. Books can update. They can integrate real-world data. They can respond to reader behavior. This is inevitable—platforms have capabilities that static text doesn't.

This Demo: Implements actual surveillance to tell a story about surveillance. The technology isn't decoration—it's the narrative itself. This is one way platform-as-narrative could work.